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

之前本来是打算做TextView垂直向上滚动的，后来发现一位大神做得很好，https://github.com/sfsheng0322/MarqueeView 孙福生大神，然后自己要用到多个View向上滚动，也就是类似淘宝首页头条的那种滚动，所以就按照那个思路想了系啊，可以把View拿来滚动，这样可以自己随意的修改View里面的内容，还比较简单一些。所以这个整个思路就是把View就行循环滚动。

看一下循环滚动View的内容咋写的吧，非常简单。

[html] view plain copy

1. package com.dreamlive.upmarqueeview;  
2.   
3. import android.content.Context;  
4. import android.util.AttributeSet;  
5. import android.view.View;  
6. import android.view.animation.Animation;  
7. import android.view.animation.AnimationUtils;  
8. import android.widget.ViewFlipper;  
9.   
10. import java.util.List;  
11.   
12. /**  
13.  * 仿淘宝首页的 淘宝头条滚动的自定义View  
14.  *  
15.  * Created by dreamlive on 2016/7/20.  
16.  */  
17. public class UPMarqueeView extends ViewFlipper {  
18.   
19.     private Context mContext;  
20.     private boolean isSetAnimDuration = false;  
21.     private int interval = 2000;  
22.     /**  
23.      * 动画时间  
24.      */  
25.     private int animDuration = 500;  
26.   
27.     public UPMarqueeView(Context context, AttributeSet attrs) {  
28.         super(context, attrs);  
29.         init(context, attrs, 0);  
30.     }  
31.   
32.     private void init(Context context, AttributeSet attrs, int defStyleAttr) {  
33.         this.mContext = context;  
34.         setFlipInterval(interval);  
35.         Animation animIn = AnimationUtils.loadAnimation(mContext, R.anim.anim_marquee_in);  
36.         if (isSetAnimDuration) animIn.setDuration(animDuration);  
37.         setInAnimation(animIn);  
38.         Animation animOut = AnimationUtils.loadAnimation(mContext, R.anim.anim_marquee_out);  
39.         if (isSetAnimDuration) animOut.setDuration(animDuration);  
40.         setOutAnimation(animOut);  
41.     }  
42.   
43.   
44.     /**  
45.      * 设置循环滚动的View数组  
46.      *  
47.      * @param views  
48.      */  
49.     public void setViews(List<View> views) {  
50.         if (views == null || views.size() == 0) return;  
51.         removeAllViews();  
52.         for (int i = 0; i < views.size(); i++) {  
53.             addView(views.get(i));  
54.         }  
55.         startFlipping();  
56.     }  
57.   
58.   
59. }  

MainActivity的内容：

[html] view plain copy

1. package com.dreamlive.upmarqueeviewdemo;  
2.   
3. import android.os.Bundle;  
4. import android.support.v7.app.AppCompatActivity;  
5. import android.view.LayoutInflater;  
6. import android.view.View;  
7. import android.widget.LinearLayout;  
8. import android.widget.TextView;  
9.   
10. import com.dreamlive.upmarqueeview.UPMarqueeView;  
11.   
12. import java.util.ArrayList;  
13. import java.util.List;  
14.   
15. /**  
16.  * 仿淘宝首页的 淘宝头条滚动的自定义View  
17.  * Created by dreamlive on 2016/7/20.  
18.  */  
19. public class MainActivity extends AppCompatActivity {  
20.   
21.   
22.     private UPMarqueeView upview1;  
23.     List<String> data = new ArrayList<>();  
24.     List<View> views = new ArrayList<>();  
25.   
26.     @Override  
27.     protected void onCreate(Bundle savedInstanceState) {  
28.         super.onCreate(savedInstanceState);  
29.         setContentView(R.layout.activity_main);  
30.         initParam();  
31.         initdata();  
32.         initView();  
33.     }  
34.   
35.     /**  
36.      * 实例化控件  
37.      */  
38.     private void initParam() {  
39.         upview1 = (UPMarqueeView) findViewById(R.id.upview1);  
40.     }  
41.   
42.     /**  
43.      * 初始化界面程序  
44.      */  
45.     private void initView() {  
46.         setView();  
47.         upview1.setViews(views);  
48.     }  
49.   
50.     /**  
51.      * 初始化需要循环的View  
52.      * 为了灵活的使用滚动的View，所以把滚动的内容让用户自定义  
53.      * 假如滚动的是三条或者一条，或者是其他，只需要把对应的布局，和这个方法稍微改改就可以了，  
54.      */  
55.     private void setView() {  
56.         for (int i = 0; i < data.size(); i = i + 2) {  
57.             //设置滚动的单个布局  
58.             LinearLayout moreView = (LinearLayout) LayoutInflater.from(this).inflate(R.layout.item_view, null);  
59.             //初始化布局的控件  
60.             TextView tv1 = (TextView) moreView.findViewById(R.id.tv1);  
61.             TextView tv2 = (TextView) moreView.findViewById(R.id.tv2);  
62.             //进行对控件赋值  
63.             tv1.setText(data.get(i).toString());  
64.             if (data.size() > i + 1) {  
65.                 //因为淘宝那儿是两条数据，但是当数据是奇数时就不需要赋值第二个，所以加了一个判断，还应该把第二个布局给隐藏掉  
66.                 tv2.setText(data.get(i + 1).toString());  
67.             }else {  
68.                 moreView.findViewById(R.id.rl2).setVisibility(View.GONE);  
69.             }  
70.   
71.             //添加到循环滚动数组里面去  
72.             views.add(moreView);  
73.         }  
74.     }  
75.   
76.     /**  
77.      * 初始化数据  
78.      */  
79.     private void initdata() {  
80.         data = new ArrayList<>();  
81.         data.add("家人给2岁孩子喝这个，孩子智力倒退10岁!!!");  
82.         data.add("iPhone8最感人变化成真，必须买买买买!!!!");  
83.         data.add("简直是白菜价！日本玩家33万甩卖15万张游戏王卡");  
84.         data.add("iPhone7价格曝光了！看完感觉我的腰子有点疼...");  
85.         data.add("主人内疚逃命时没带够，回废墟狂挖30小时！");  
86. //        data.add("竟不是小米乐视！看水抢了骁龙821首发了！！！");  
87.   
88.     }  
89. }  

github地址：https://github.com/dreamlivemeng/UpMarqueeTextView-master 欢迎star，fork，提pr， issues。