Android 实现小红书登陆页面背景图无限滚动效果

最新推荐文章于 2024-01-05 01:20:28 发布
最新推荐文章于 2024-01-05 01:20:28 发布
阅读量1.1k 收藏 4
点赞数
CC 4.0 BY-SA版权
分类专栏： android 文章标签： html5 android
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/wangqing830414/article/details/120196844
android 专栏收录该内容
74 篇文章 ¥9.90 ¥99.00
订阅专栏
本文介绍了如何在Android中实现类似小红书登录页面的背景图无限循环滚动效果。通过分析页面布局，确定使用自定义FrameLayout，加载本地图片，并在onDraw方法中绘制滚动背景。详细步骤包括缩放图片、定时滚动、平移处理和无限滚动的视觉效果。同时，提供了自定义属性以调整滚动速度、方向和遮罩层颜色，并提供了源码和Demo地址。

1.需求分析

小红书登陆页面背景图滚动效果

 需求特点

背景无限循环滚动
 


登陆页面布局分析

 功能分析

通过 uiautomatorviewer 分析页面布局，确定其应是通过自定义 FrameLayout 实现
通过清除 App 数据同时断开数据连接再启动该页面，确定背景加载的是本地图片
通过小红书 apk 获取资源文件，确定背景图片为单张图片
 

2.具体实现

实现效果

实现步骤

自定义 SrcScrollFrameLayout 继承于 FrameLayout ，初始化时 setWillNotDraw(false)  使 onDraw 方法生效
获取背景图片 Bitmap 对象，按 SrcScrollFrameLayout 实际宽度按比例缩放，同时计算需要绘制的背景图 Bit

了解本专栏 订阅专栏 解锁全文
Android开发图片滚动效果
weixin_43918957的博客
06-13 2897
Android开发图片滚动效果 效果图： 设置适配来设置图片位置大小 package com.example.gallary; import android.content.Context; import android.view.View; import android.view.ViewGroup; import android.widget.BaseAdapter; import andr...
Android-仿小红书登录页长图片背景自动滚动效果
08-13
仿小红书登录页 长图片背景自动滚动效果
Android仿小红书大众点评登录页背景动态效果
weixin_43522997的博客
12-01 1116
SrcScrollFrameLayout我转载Ziwen Lan的只用于个人记录 Introduction :仿小红书登陆页面背景图无限滚动 FrameLayout 功能特点： 1.将选择的图片按比例缩放填满当前 View 高度 2.背景图片缩放后宽/高度小于当前 View 宽/高度时自动复制黏贴直到占满当前 View 宽/高度，以此来达到无限滚动效果 3.可通过自定义属性 speed 调整滚动速度，提供 slow、ordinary 和 fast 选项，也可自行填入 int 值，值越大滚动速度越快，建议
Android实现小红书登录页面背景无限滚动效果教程
资源摘要信息:"在Android平台上实现小红书登陆页面背景图无限滚动效果，主要涉及到Android UI设计与开发技术，特别是对于ScrollView或ViewPager等滚动组件的运用。小红书作为一款社交分享型的应用程序，其登陆页面...
Android实现仿小红书长图片自动滚动登录效果
在本次的知识点总结中，我们将探讨如何实现一个仿小红书登录页面中的长图片背景自动滚动效果。这个效果不仅能够增强应用的视觉吸引力，还能够提供流畅的用户体验。 ### Android开发知识点： 1. **Activity生命周期...
Android viewpager+fragment实现无限滚动，左右有前/后一页的部分，并fragment显示的内容是activity传过去的数据
肖波的博客
07-19 8194
      背景：最近在做app的时候碰到一个这样的需求。1，将从网络上获取的json数组数据显示出来，每页显示一个数据源，并且可以左右翻页查看；2，中间显示一个完整页，两边分别还有上下一页的一点,；3，可无限循环滑动。大致效果如下： 思考：这样的效果一下就想到用viewpager+fragment来做。本案例所有代码都有贴出来，有需要的可以自己试试看！      1，activity向f...
安卓项目实战之视频形式欢迎页和长图片自动滚动的背景效果实现
智玲君
09-29 718
本篇只是单纯的转载收藏，感恩原创，尊重原创！ 视频形式欢迎页 效果如下图： 转载自：https://github.com/watire/xiamivd 长图片自动循环滚动的背景效果 转载自：https://github.com/forvv231/EasyScollImage ...
安卓 android 图片滚动 无缝循环滚动实例.rar
07-10
安卓 android 图片滚动 无缝循环滚动实例，在PC上似乎对这种图片特效很熟悉了，在Android系统的手机应用中，图片滚动也是很常见的，这款无缝循环的图片滚动是一个产品展示中取下来的，代码简洁，提供给安卓初学者学习参考。
模仿QQ,小红书等登录时的背景视频
07-24
BackgroundVideo 视频做背景,模仿QQ,小红书等登录时的背景视频,视频文件放在raw中 BackgroundVideo 视频做背景,模仿QQ,小红书等登录时的背景视频,视频文件放在raw中
Android 循环背景动画
12-28
Android 循环背景动画（需要添加v7包）
绝绝美登录界面！滑动切换效果!图片背景.html
最新发布
lulei5153的博客
01-05 918
绝绝美登录界面！滑动切换效果，图片背景html。
android 重复背景图片,Android实战打飞机游戏之无限循环的背景图(2)
weixin_42502643的博客
05-26 359
首先分析下游戏界面内的元素：无限滚动的背景图, 可以操作的主角,主角的子弹, 主角的血量,两种怪物(敌机),一个boss, boss的爆炸效果.先看效果图1、首先实现无限滚动的背景图 原理: 定义两个位图对象 当第一个位图到末尾是 第二个位图从第一个位图的末尾跟上.public class GameBg {// 游戏背景的图片资源// 为了循环播放，这里定义两个位图对象，// 其资源引用的是同一张...
android 自动滑动图片,炫酷-背景图垂直循环滚动登录页，Android RecyclerView实现
weixin_39639260的博客
05-25 321
炫酷-背景图上下循环滚动登录页，Android RecyclerView实现方法某站的登录页背景不停循环滚动，和街边的广告箱很像，感觉不错我也心动了。决定高仿一下，参考了几篇文章后就动手了。实现步骤：1.效果图展示2.自定义实现滚动效果RecyclerView3.适配器Adapter实现4.适配器布局文件5.主程序调用过程6.主布局文件7.总结1.效果图展示666.gif2.自定义实现滚动效果Re...
Android 长图自动循环播放
a5911188的专栏
01-07 3068
今天设计要让做一个引导页。就是一个很长的横图，然后从右往左慢慢播放，在播放完了之后会重新播放，当然，需求是要很连贯的效果。
图文短视频信息流开发总结（仿小红书， Instagram）
Chrissen's Blog
11-22 4649
少废话，先看效果 需求分析 在开发中需要实现图文视频信息流的功能，可以参考下面的动图： 上面的动图来自小红书，我们可以发现：整个列表中有图片（多张）以及视频，视频是可以自动播放的。根据需求，我们来需要实现图片标签的功能，这一块我们是参考Instagram的效果。见下图： 很抱歉，gif中没有很好的体现需要实现的效果，那么我就用文字描述一下吧。如果图片上有标签，那么当滑动到图片时，需要显示一个...
仿小红书顶部自适应高度viewpager
Tiger、
04-01 2417
不废话,上效果图: 首先获取第一张图片的高度设置给viewpager,在viewpager滑动的时候调用onPageScrolled()方法,动态的设置viewpager的高 //为ViewPager设置高度 ViewGroup.LayoutParams params = mViewpager.getLayoutParams(); params.height = defaulthe
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
表情包 代码片
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

喜欢听风的人

你的鼓励是我最大的动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值