Android 原生控件ViewFlipper实现淘宝头条垂直滚动广告条

            ViewFlipper 是Android 原生自带的控件，几乎很少有人知道，但这个控件使用很简单，也很好理解。从源码可以看出，其实ViewFlipper间接的继承了FrameLayout，也可以说ViewFlipper其实就是个FrameLayout，只不过在内部封装了动画实现和Handler实现一个循环而已。

一、效果图

      下面是打开淘宝的原型图：

                                                       

二、ViewFlipper的常用属性

•    android : antoStart         设置自动加载下一个View
  
•    android : flipInterval       设置View之间切换的时间间隔
•    android : inAnimation     设置切换View的进入动画
•    android : outAnimation   设置切换View的退出动画

三、ViewFlipper的常用方法

•    isFlipping()：                  判断View切换是否正在进行
•    setFilpInterval()：           设置View之间切换的时间间隔
•    startFlipping()：              开始View的切换，而且会循环进行 
  
•    stopFlipping()：              停止View的切换
•    setInAnimation()：         设置切换View的进入动画
•    setOutAnimation()：      设置切换View的退出动画
•    showNext()：                 显示ViewFlipper里的下一个View
•    showPrevious()：          显示ViewFlipper里的上一个View
  

四、ViewFlipper的详细使用设置View

      1.首先在xml中声明ViewFlipper

<LinearLayout
        android:layout_width="match_parent"
        android:layout_height="100dp"
        android:orientation="horizontal">
        <ImageView
            android:layout_width="0dp"
            android:layout_height="60dp"
            android:layout_weight="1"
            android:src="@mipmap/toutiao"/>
        <View
            android:layout_width="1dp"
            android:layout_height="60dp"
            android:background="#b6b5b5"
            android:layout_marginLeft="5dp"
            android:layout_marginRight="5dp"/>
        <ViewFlipper
            android:id="@+id/view_flipper"
            android:layout_width="0dp"
            android:layout_weight="4"
            android:layout_height="60dp"
            android:autoStart="true"
            android:flipInterval="3000"
            android:inAnimation="@anim/flipper_in_anim"
            android:outAnimation="@anim/flipper_out_anim"/>
    </LinearLayout>

     2.在res下创建anim文件夹，并在里面创建两个xml分别是入场动画和出场动画

<!--进入动画-->
<translate xmlns:android="http://schemas.android.com/apk/res/android"

    android:fromYDelta="100%p"
    android:toYDelta="0"
    android:duration="1500">

</translate>

<!--退出动画-->
<translate xmlns:android="http://schemas.android.com/apk/res/android"

    android:fromYDelta="0"
    android:toYDelta="-100%p"
    android:duration="1500">

</translate>

       3.在java代码中初始化ViewFlipper，并添加子布局（在这里我们只显示了一个子布局）

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="match_parent"
    android:layout_height="match_parent">
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:orientation="horizontal">
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text=" 运动 "
            android:textColor="#ff0000"
            android:background="@drawable/text_shap"/>
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="  精致！哈登上脚 Harden 1"/>
    </LinearLayout>
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:orientation="horizontal">
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text=" 热品 "
            android:textColor="#ff0000"
            android:background="@drawable/text_shap"/>
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="  比奥迪A4还贵，上市第一天卖了27万辆"/>
    </LinearLayout>
</LinearLayout>

        /**
         * 在java代码中初始化，并添加导入三个子布局
         */
        mFlipper = (ViewFlipper) findViewById(R.id.view_flipper);
        mFlipper.addView(View.inflate(this,R.layout.one,null));
        mFlipper.addView(View.inflate(this,R.layout.two,null));
        mFlipper.addView(View.inflate(this,R.layout.three,null));