Android添加item动画,RecyclerView基础篇-Item添加动画
Android_Banner.jpg
简介
本节中我们介绍下给RecyclerView中的Item添加动画。
添加的动画,分为,在打开列表时有Item的展示动画,当滑动的时候没有动画
和打开列表滑动时有动画两种
实现过程
实现一个列表
效果如下
Screenshot_2020-09-01-17-03-35-349_com.dashingqi.module.recyclerview.png
接下来我们就要操作这个列表中的Item,让其产生动画
布局的实现代码
main_activity.xml 的布局文件
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools">
name="viewModel"
type="com.dashingqi.module.recyclerview.RvAnimationViewModel" />
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".RvAnimationActivity">
android:id="@+id/animRv"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layoutManager="androidx.recyclerview.widget.LinearLayoutManager" />
MainActivity.kt中的代码
lass RvAnimationActivity : AppCompatActivity() {
private val animationDownToUp by lazy {
AnimationUtils.loadAnimation(this, R.anim.item_anim_down_to_up)
}
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
val dataBinding = DataBindingUtil.setContentView(
this,
R.layout.activity_rv_animation
)
//获取到ViewModel的实例
val viewModel = ViewModelProvider(this)[RvAnimationViewModel::class.java]
//绑定ViewModel
dataBinding.viewModel = viewModel
//设置适配器
var adapter = RvAnimationAdapter(viewModel.items, animRv)
animRv.adapter = adapter
// 为Rv中的Item添加装饰器
animRv.addItemDecoration(object : RecyclerView.ItemDecoration() {
override fun getItemOffsets(
outRect: Rect,
view: View,
parent: RecyclerView,
state: RecyclerView.State
) {
val childPosition = parent.getChildAdapterPosition(view)
if (childPosition != 0) {
outRect.top = DensityUtils.dip2pxInt(parent.context, 16f)
}
}
})
}
}
ViewModel中的代码
class RvAnimationViewModel : ViewModel() {
val items = ObservableArrayList()
val itemBinding = ItemBinding.of(BR.item, R.layout.item_anim_view)
init {
for (index in 0 until 80) {
items.add("Item${index}")
}
}
}
Adapter中的代码
class RvAnimationAdapter(var datas: ArrayList, var recyclerView: RecyclerView) :
RecyclerView.Adapter() {
class MyViewHolder(var dataBinding: ItemAnimViewBinding) :
RecyclerView.ViewHolder(dataBinding.root) {
}
override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): MyViewHolder {
val dataBinding = DataBindingUtil.inflate(
LayoutInflater.from(parent.context),
R.layout.item_anim_view,
parent,
false
)
return MyViewHolder(dataBinding)
}
override fun getItemCount(): Int {
return datas.size
}
override fun onBindViewHolder(holder: MyViewHolder, position: Int) {
val itemDataBinding = holder.dataBinding as ItemAnimViewBinding
itemDataBinding.item = datas[position]
itemDataBinding.executePendingBindings()
}
}
item的布局文件
xmlns:app="http://schemas.android.com/apk/res-auto">
name="item"
type="String" />
android:layout_width="match_parent"
android:layout_height="wrap_content">
android:layout_width="match_parent"
android:layout_height="240dp"
android:background="@android:color/holo_red_dark"
android:text="@{item}"
android:gravity="center"
android:textColor="#ffffff"
android:textSize="20sp"
android:textStyle="bold"
app:layout_constraintTop_toTopOf="parent" />
实现进入列表时的动画
实现效果如下
list_start.gif
该动画是从右侧平移到屏幕中,所以我们的平移动画的X轴的起点从 100%开始,终止点为0 ,y不变
android:duration="500">
android:fromXDelta="100%p"
android:fromYDelta="0"
android:toXDelta="0"
android:toYDelta="0" />
android:fromAlpha="0"
android:toAlpha="100" />
接着借助LayoutAnimationController 给 RV的layoutAnimation设置动画数据
val viewModel = ViewModelProvider(this)[RvAnimationViewModel::class.java]
dataBinding.viewModel = viewModel
var adapter = RvAnimationAdapter(viewModel.items, animRv)
animRv.adapter = adapter
var animation = AnimationUtils.loadAnimation(this, R.anim.item_anim_translate)
val layoutAnimationController = LayoutAnimationController(animation)
//设置顺序
layoutAnimationController.order = LayoutAnimationController.ORDER_NORMAL
animRv.layoutAnimation = layoutAnimationController
滑动的时候带有动画
效果如下
list_scroll.gif
上图中的效果,是在ItemView可见的时候执行动画,我们的切入点也就是这个时机,正好Adapter中有提供一个方法onViewAttachedToWindow()
onViewAttachedToWindow() 是当Adapter创建好的View依附在Window的时候调用的,所以这个方法是一个时机,在这个方法中,为每一个ItemView设置动画。
同时我们还需要为Rv设置滑动的监听事件,来记录滑动的方向,这样在onViewAttachedToWindow()方法中设置不同的动画
所以Adapter中的代码变更如下
class RvAnimationAdapter(var datas: ArrayList, var recyclerView: RecyclerView) :
RecyclerView.Adapter() {
/**
* 用来记录当前是向上滑动的
*/
var isScrollUp = false
/**
* 用来记录当前是向下滑动的
*/
var isScrollDown = false
/**
* 动画
*/
private val animation by lazy {
AnimationUtils.loadAnimation(recyclerView.context, R.anim.item_anim_translate)
}
private val animationUpToDown by lazy {
AnimationUtils.loadAnimation(recyclerView.context, R.anim.item_anim_up_to_down)
}
private val animationDownToUp by lazy {
AnimationUtils.loadAnimation(recyclerView.context, R.anim.item_anim_down_to_up)
}
init {
//为RV添加滑动事件的监听
recyclerView.addOnScrollListener(object : RecyclerView.OnScrollListener() {
override fun onScrollStateChanged(recyclerView: RecyclerView, newState: Int) {
super.onScrollStateChanged(recyclerView, newState)
}
override fun onScrolled(recyclerView: RecyclerView, dx: Int, dy: Int) {
super.onScrolled(recyclerView, dx, dy)
isScrollUp = dy > 0
isScrollDown = dy < 0
}
})
}
class MyViewHolder(var dataBinding: ItemAnimViewBinding) :
RecyclerView.ViewHolder(dataBinding.root) {
}
override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): MyViewHolder {
val dataBinding = DataBindingUtil.inflate(
LayoutInflater.from(parent.context),
R.layout.item_anim_view,
parent,
false
)
return MyViewHolder(dataBinding)
}
override fun getItemCount(): Int {
return datas.size
}
override fun onBindViewHolder(holder: MyViewHolder, position: Int) {
val itemDataBinding = holder.dataBinding as ItemAnimViewBinding
itemDataBinding.item = datas[position]
itemDataBinding.executePendingBindings()
}
/**
* 当创建好的View依附到Window上时回调的
*/
override fun onViewAttachedToWindow(holder: MyViewHolder) {
super.onViewAttachedToWindow(holder)
for (index in 0 until recyclerView.childCount) {
//获取到Item
val itemView = recyclerView.getChildAt(index)
//清除每一个Item上的动画
itemView?.clearAnimation()
}
// 当向上滑动的时候
if (isScrollUp) {
holder.itemView.startAnimation(animationDownToUp)
}
//当向下滑动的时候
if (isScrollDown) {
holder.itemView.startAnimation(animationUpToDown)
}
}
}
对应的动画文件
android:duration="200">
android:fromYDelta="100%"
android:toYDelta="0" />
android:fromAlpha="0"
android:toAlpha="1" />
android:duration="200"
>
android:fromYDelta="-100%"
android:toYDelta="0" />
android:fromAlpha="0"
android:toAlpha="1" />
Android添加item动画,RecyclerView基础篇-Item添加动画相关推荐
- Android 音视频开发之基础篇 使用 SurfaceView绘制一张图片
Android 音视频开发 上一篇文章:使用 imageview绘制一张图片 任务一 SurfaceView绘制一张图片 文章目录 Android 音视频开发 前言 一.surfaceview是什么? ...
- Android自动化测试第一季(基础篇)-金阳光-专题视频课程
Android自动化测试第一季(基础篇)-32195人已学习 课程介绍 Android自动化测试第一季 初级 课程收益 零基础 讲师介绍 金阳光 更多讲师课程 ...
- Android事件分发机制:基础篇:最全面、最易懂
如何提升安卓水平?安卓开发者必须了解的事件分发机制. 最全面.最易懂的形式来讲解Android事件分发机制. 0. 前言 鉴于安卓分发机制较为复杂,故分为多个层次进行讲解,分别为基础篇.实践篇与高级篇 ...
- cocos2dx基础篇(24)——基本动画CCAnimation/CCAnimate
[唠叨] 基本动画制作需要用到CCAnimation类,用于存储动画相关的信息.以及由CCActionInterval继承的CCAnimate动画动作. 还有一些在创建动画动作的过程中,可能会用到的一 ...
- android HDMI (一):HDMI基础篇
关键词:android 4.0 HDMI 平台信息: 内核:linux3.0 系统:android4.0.3 平台:S5PV310(samsung exynos 4210) 作者:xubin34171 ...
- Android 音视频开发之基础篇 使用 imageview绘制一张图片
Android 音视频开发 任务一 ImageView 绘制图片 文章目录 Android 音视频开发 任务一 ImageView 绘制图片 前言 一.配置activity_main.xml 二.添加 ...
- 基础篇——树莓派添加一键锁屏
简介 在使用树莓派的过程中,常常会想有没有类似windows系统的WIN+L一键锁屏的操作,今天研究了一下还真有,还是内置的.简单记录分享一下. 原理介绍 修改系统桌面配置文件,重启系统即可完成 实现 ...
- android java设计模式,Android开发之Java设计模式基础篇
今日我们就Android开发中的一些设计模式做一些 根底性的 主宰,本次就Android项 目标架构设计 有关内容做 综合: 1. 静态工厂 步骤 静态工厂 步骤 可以算是工厂 步骤加单例模式的整合在 ...
- iOS动画系列之五:基础动画之缩放篇旋转篇Swift+OC
这一篇主要介绍基础动画之缩放和旋转.这些基本操作分享完之后,我想想可以找个稍微复杂一点点的动画做做啦. 这篇继续基础篇,分享一下缩放和旋转.因为整体思路和平移基本上没有变化,加上源代码里面也有OC版本 ...
最新文章
- 科大星云诗社动态20210319
- Scala模式匹配(类似Java的switch)
- python机器学习入门(Day1:Numpy)
- iis服务器修改内存,修改IIS的虚拟内存
- leetcode python3 简单题7.Reverse integer
- Mp4v2实现h264+aac打包成Mp4视频文件
- CGLib与JDK的动态代理
- 云呐-动环监控巡检表,信息机房巡检表
- 重心选址法matlab,在运用重心法选址时,需要已知哪些变量? 答案:物流量物流点坐标...
- View补间动画Animation运行原理
- 计算机三级网络技术最全知识点总结九
- scrapy mysql 豆瓣_Python爬虫之Scrapy+Mysql+Mongodb爬豆瓣top250电影
- ACP 云计算试题集
- ZYNQ简介 | ZYNQ到底是什么?
- C语言中表示输出类型的格式字符
- 数据结构与算法之排序(Java版)
- ckeditor php 上传图片_ckeditor 4上传图片功能配置方法
- 展会圆满收官 柏克利招商峰会业绩闪亮
- 坚定的探索者——2022春软件工程课程总结
- libpcap使用整理