所谓前人栽树，后人乘凉，在此感谢博主的贡献。

参考博文：

仿淘宝首页的淘宝头条View垂直滚动

我在博主的基础上做了如下工作：

• 修复了滚动条第二条点击事件无法触发这个bug；
• 充分简化了自定义ViewFlipper类的代码；
• 添加了直接使用ViewFlipper控件实现同样效果；
  

先上效果图：

这里使用了一个比较少用的控件：ViewFlipper
学习一个未知的东西，第一步就是要搞懂what：学的这个东西是什么以及能够实现什么效果！第二步就是要搞懂How：这个东西如何使用。

What:

该控件的官方介绍：

Simple ViewAnimator that will animate between two or more views that have been added to it. Only one child is shown at a time. If requested, can automatically flip between each child at a regular interval.

鄙人的翻译：

简单ViewAnimator实现器将已添加到其两个或多个视图之间实现动画效果。 一次只显示一个孩子（子视图）。
如果需要，可以在每个孩子（子视图）之间定期自动翻转。

How:

实现方式：

1.继承ViewFlipper类通过代码设置动画间隔时间以及动画效果

1.1自定义ViewFlipper

/**
 * Created by Veyron on 2017/2/20.
 * Function：自定义ViewFlipper控件
 */

public class UpView extends ViewFlipper {

 private Context mContext;
 private boolean isSetAnimDuration = false;
 private int interval = 2000;
 /**
 * 动画时间
 */
 private int animDuration = 500;

 public UpView(Context context, AttributeSet attrs) {
 super(context, attrs);
 init(context, attrs, 0);
 }

 private void init(Context context, AttributeSet attrs, int defStyleAttr) {
 this.mContext = context;
 setFlipInterval(interval);//设置时间间隔2000毫秒
 //进来的动画
 Animation animIn = AnimationUtils.loadAnimation(mContext, R.anim.anim_in);
 if (isSetAnimDuration)
 animIn.setDuration(animDuration);
 setInAnimation(animIn);
 //退出的动画
 Animation animOut = AnimationUtils.loadAnimation(mContext, R.anim.anim_out);
 if (isSetAnimDuration)
 animOut.setDuration(animDuration);
 setOutAnimation(animOut);
 }

 /**
 * 设置循环滚动的View数组
 *
 * @param views
 */
 public void setViews(final List<View> views) {
 if (views == null || views.size() == 0) return;
 removeAllViews();
 for ( int i = 0; i < views.size(); i++) {
 final int position=i;
 //设置翻滚的子view
 addView(views.get(i));
 }
 startFlipping(); //开启翻滚
 }
}

1.2布局文件中引入

 <com.veyron.www.viewflipperdemo.View.UpView
 android:id="@+id/upview1"
 android:layout_marginLeft="20dp"
 android:layout_width="match_parent"
 android:layout_toRightOf="@+id/tbtv"
 android:layout_centerVertical="true"
 android:layout_marginTop="10dp"
 android:layout_height="match_parent">
 </com.veyron.www.viewflipperdemo.View.UpView>

2.除了方式一，还可以在布局文件中通过设定ViewFlipper的属性来达到同样的效果。

<ViewFlipper
 android:id="@+id/upview2"
 android:autoStart="true"
 android:background="#fff"
 android:inAnimation="@anim/anim_in"
 android:outAnimation="@anim/anim_out"
 android:flipInterval="3000">
 </ViewFlipper>

具体实现上面两种方式

MainActivity.java

/**
 * Created by Veyron on 2017/2/20.
 * Function：主界面，加载布局
 */
public class MainActivity extends AppCompatActivity {
 private UpView upview1; //自定义的ViewFlipper
 private ViewFlipper mViewFlipper; //直接使用该控件

 List<String> data = new ArrayList<>(); //文字数据集合
 List<View> views = new ArrayList<>(); //滚动的view集合

 @Override
 protected void onCreate(Bundle savedInstanceState) {
 super.onCreate(savedInstanceState);
 setContentView(R.layout.activity_main);
 initdata();
 initView();
 }

 private void initView() {
 //自定义的
 upview1 = (UpView) findViewById(R.id.upview1);
 setView();
 upview1.setViews(views);//给自定义的ViewFlipper设置滚动的view


 //非自定义的，直接使用控件的
 mViewFlipper = (ViewFlipper) findViewById(R.id.upview2);
 //添加翻滚的子view
 mViewFlipper.addView(View.inflate(this, R.layout.view1, null));
 mViewFlipper.addView(View.inflate(this, R.layout.view2, null));
 }

 /**
 * 初始化需要循环的View
 * 为了灵活的使用滚动的View，所以把滚动的内容让用户自定义
 * 假如滚动的是三条或者一条，或者是其他，只需要把对应的布局，和这个方法稍微改改就可以了，
 */
 private void setView() {
 for (int i = 0; i < data.size(); i = i + 2) {
 final int position = i;
 //设置滚动的单个布局
 LinearLayout moreView = (LinearLayout) LayoutInflater.from(this).inflate(R.layout.item_view, null);
 //初始化布局里面的控件,只要设置这两个控件的监听就达到目的
 TextView tv1 = (TextView) moreView.findViewById(R.id.tv1);
 TextView tv2 = (TextView) moreView.findViewById(R.id.tv2);

 /**
 * 设置监听
 */
 moreView.findViewById(R.id.rl).setOnClickListener(new View.OnClickListener() {
 @Override
 public void onClick(View view) {
  Toast.makeText(MainActivity.this, data.get(position).toString(), Toast.LENGTH_SHORT).show();
  Log.d("TAG",data.get(position).toString());
  /**
  * 添加业务代码
  */
 }
 });
 /**
 * 设置监听
 */
 moreView.findViewById(R.id.rl2).setOnClickListener(new View.OnClickListener() {
 @Override
 public void onClick(View view) {
  Toast.makeText(MainActivity.this, data.get(position+1).toString(), Toast.LENGTH_SHORT).show();
  Log.d("TAG",data.get(position+1).toString());
  /**
  * 添加业务代码
  */
 }
 });


 //进行对控件赋值
 tv1.setText(data.get(i).toString());
 if (data.size() > i + 1) {
 //因为淘宝那儿是两条数据，但是当数据是奇数时就不需要赋值第二个，所以加了一个判断，还应该把第二个布局给隐藏掉
 tv2.setText(data.get(i + 1).toString());
 } else {
 moreView.findViewById(R.id.rl2).setVisibility(View.GONE);
 }

 //添加到循环滚动数组里面去
 views.add(moreView); //也就是滚动的view集合
 }
 }
 /**
 * 初始化数据
 */
 private void initdata() {
 data = new ArrayList<>();
 data.add("美剧《行尸走肉》上线Steam 每一集售价2.99...");
 data.add("2017四月新番动画全预览！你期待那部");
 data.add("生娃后，老公有过这些举动，你却没加错人！");
 data.add("汽车开空调耗油？只因为按错了一个键");
 data.add("心疼S7 edge 三星官方‘虐机'视频上线");
 }
}

API介绍

常用属性：

• autoStart：ture，则自动开始滚动
• inAnimation：滚动进入的动画
• outAnimation：滚动出去的动画
• flipInterval：时间间隔
  

常用方法：

• startFlipping()：开始翻滚
• setOutAnimation():滚动出去的动画
• setInAnimation():滚动进入的动画
• setFlipInterval():设置时间间隔-毫秒
• ViewFlipper对象的addView():加载需要滚动的视图对象
  

ViewFlipper具体属性详见：ViewFlipper控件的官方api

源码：

ViewFlipperDemo

如果该你喜欢该项目，欢迎fork,欢迎点个Star!!

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持。

# Android  # 滚动  # ViewFlipper  # Android使用ViewPager实现滚动广告  # Android 知乎广告效果实现代码  # Android 实现广告欢迎界面(倒计时)  # Android开发实现广告无限循环功能示例  # Android滚动条广告实现代码示例  # Android ViewPager实现无限循环轮播广告位Banner效果  # Android 应用启动欢迎界面广告的实现实例  # Kotlin FrameLayout与ViewPager2控件实现滚动广告栏方法  # 自定义  # 淘宝  # 第二个  # 要搞  # 前人栽树  # 的是  # 加载  # 后人乘凉  # 我在  # 还可以  # 多个  # 在此  # 不需要  # 两种  # 只需  # 要把  # 这两个  # 有过  # 错了  # 或者是 

相关栏目： 【 网站优化151355 】 【 网络推广146373 】 【 网络技术251813 】 【 AI营销90571 】

相关推荐： Laravel如何使用Sanctum进行API认证？（SPA实战）  Python高阶函数应用_函数作为参数说明【指导】  Android中Textview和图片同行显示(文字超出用省略号，图片自动靠右边)  北京的网站制作公司有哪些,哪个视频网站最好？  C语言设计一个闪闪的圣诞树  怎样使用JSON进行数据交换_它有什么限制  Laravel如何使用withoutEvents方法临时禁用模型事件  Laravel如何理解并使用服务容器（Service Container）_Laravel依赖注入与容器绑定说明  Laravel软删除怎么实现_Laravel Eloquent SoftDeletes功能使用教程  谷歌Google入口永久地址_Google搜索引擎官网首页永久入口  如何在建站主机中优化服务器配置？  Mybatis 中的insertOrUpdate操作  使用Dockerfile构建java web环境  Edge浏览器如何截图和滚动截图_微软Edge网页捕获功能使用教程【技巧】  如何快速配置高效服务器建站软件？  Laravel如何正确地在控制器和模型之间分配逻辑_Laravel代码职责分离与架构建议  百度输入法ai面板怎么关 百度输入法ai面板隐藏技巧  Windows10电脑怎么查看硬盘通电时间_Win10使用工具检测磁盘健康  简单实现Android文件上传  独立制作一个网站多少钱,建立网站需要花多少钱？  googleplay官方入口在哪里_Google Play官方商店快速入口指南  Laravel怎么实现验证码(Captcha)功能  网站设计制作书签怎么做,怎样将网页添加到书签/主页书签/桌面？  如何在阿里云通过域名搭建网站？  Windows10电脑怎么设置虚拟光驱_Win10右键装载ISO镜像文件  公司门户网站制作公司有哪些,怎样使用wordpress制作一个企业网站？  如何在云主机上快速搭建网站？  如何登录建站主机？访问步骤全解析  Laravel如何实现密码重置功能_Laravel密码找回与重置流程  如何在建站宝盒中设置产品搜索功能？  如何在腾讯云服务器上快速搭建个人网站？  今日头条微视频如何找选题 今日头条微视频找选题技巧【指南】  如何将凡科建站内容保存为本地文件？  Laravel如何处理文件下载请求？（Response示例）  猪八戒网站制作视频,开发一个猪八戒网站，大约需要多少？或者自己请程序员，需要什么程序员，多少程序员能完成？  如何在阿里云完成域名注册与建站？  高防服务器租用指南：配置选择与快速部署攻略  iOS UIView常见属性方法小结  如何构建满足综合性能需求的优质建站方案？  香港服务器建站指南：免备案优势与SEO优化技巧全解析  LinuxCD持续部署教程_自动发布与回滚机制  UC浏览器如何切换小说阅读源_UC浏览器阅读源切换【方法】  作用域操作符会触发自动加载吗_php类自动加载机制与::调用【教程】  韩国代理服务器如何选？解析IP设置技巧与跨境访问优化指南  Laravel如何获取当前登录用户信息_Laravel Auth门面使用与Session用户读取【技巧】  Laravel Eloquent模型如何创建_Laravel ORM基础之Model创建与使用教程  Laravel如何发送系统通知？（Notification渠道示例）  php在windows下怎么调试_phpwindows环境调试操作说明【操作】  如何快速查询网站的真实建站时间？  详解CentOS6.5 安装 MySQL5.1.71的方法