viewpager

闲着无聊,撸个微信导航栏的动画吧!

时间秒杀一切 提交于 2019-11-29 10:03:57
/ 开始 / 微信自发布以来,底部导航栏的动画一直让开发者津津乐道,而且伴随着版本更新,底部导航栏的动画也一直在改进。我最近在闲暇之余,看了下微信的底部导航栏动画,于是思考了下这个动画的原理,感觉非常有意思,于是写下这篇文章。 下图就是我实现的效果,大家可以对比下微信的效果,几乎可以以假乱真。 / 动画过程 / 关于这个动画的过程,我刚开始了是瞅了老半天了,因为如果我们不了解动画的过程也是无从去实现了,所以动画过程很重要,这个动画其实有两个过程。 首先是默认图片的轮廓变色。 轮廓变色到一定程度后,整个图片出现了绿色的填充效果,也就是整个图片开始变绿,直到整个图片完全变为了绿色。其实这是两个图片的透明度变换的达成的效果。 / 动画实现原理 /首先我们从整体上看,滑动的页面可以用ViewPager实现,在滑动的过程中,通过监听ViewPager的滑动事件,可以获取一个滑动的比例值。底部的导航栏的4个Tab可以用自定义一个View来实现,我把这个自定义的View叫做TabView。那么,在滑动的过程中,当前页面的TabView执行褪色动画,后一个页面执行变色动画。动画到底执行到哪一步,肯定就是由ViewPager的滑动比例值决定的。因此TabView需要一个接收动画进度比例值的方法来控制动画的程度。/ 代码实现 /俗话说得好,Talk is cheap, show me the code

仿抖音上下滑动分页视频

余生颓废 提交于 2019-11-29 07:49:43
目录介绍 01.先来看一下需求 02.有几种实现方式 2.1 使用ViewPager 2.2 使用RecyclerView 03.用ViewPager实现 3.1 自定义ViewPager 3.2 ViewPager和Fragment 3.3 修改滑动距离翻页 3.4 修改滑动速度 04.用RecyclerView实现 4.1 自定义LayoutManager 4.2 添加滑动监听 4.3 监听页面是否滚动 4.4 attach和Detached 05.优化点详谈 5.1 ViewPager改变滑动速率 5.2 PagerSnapHelper注意点 5.3 自定义LayoutManager注意点 5.4 视频播放逻辑优化 5.5 视频逻辑充分解藕 5.6 翻页卡顿优化分析 5.7 上拉很快翻页黑屏 01.先来看一下需求 项目中的视频播放,要求实现抖音那种竖直方向一次滑动一页的效果。滑动要流畅不卡顿,并且手动触摸滑动超过1/2的时候松开可以滑动下一页,没有超过1/2返回原页。 手指拖动页面滑动,只要没有切换到其他的页面,视频都是在播放的。切换了页面,上一个视频销毁,该页面则开始初始化播放。 切换页面的时候过渡效果要自然,避免出现闪屏。具体的滑动效果,可以直接参考抖音…… 02.有几种实现方式 2.1 使用ViewPager 使用ViewPager实现竖直方法上下切换视频分析 1

Android的ViewPager添加布局

社会主义新天地 提交于 2019-11-28 18:44:55
public class VerifyActivity extends BaseActivity { private ViewPager mVerifyViewPager; private LinearLayout ll_indicator_verify; private ArrayList<View> viewList = new ArrayList<>(); @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_verify); StatusBarCompat.setStatusBarColor(VerifyActivity.this, Color.parseColor("#ffffff"), true); initView(); } private void initView() { mVerifyViewPager = (ViewPager) findViewById(R.id.mVerifyViewPager); tv_to_verify = (TextView) findViewById(R.id.tv_to_verify); ll_indicator

Android进阶之绘制-自定义View完全掌握(二)

試著忘記壹切 提交于 2019-11-28 15:08:12
这是自定义View系列的第二篇博客,我们继续来学习关于自定义View的知识。 今天我们来实现一下广告条案例。 我们要实现的是这样的一个效果。 要想实现这样的效果,我们可以借助ViewPager控件,然后加上自定义的一些控件即可完成。那么现在就开始吧。 新建一个android项目。 修改activity_main.xml文件。 <?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" tools:context="com.itcast.test0429.MainActivity"> <android.support.v4.view.ViewPager android:id="@+id/viewpager" android:layout_width="match_parent"