StackView

1 描述

      StackView 和前文介绍的AdapterViewFlipper一样也继承了AdapterViewAnimator，它也会显示Adapter提供的多个View组件，也可以通过showNext、showPrevious显示下一个、上一个组件，但它是以 “堆叠（stack）”的方式显示多个列表项。

       控制View的显示有两种方式：

       a：拖走stack顶端的view，显示下一个view，也可以把上一个view拖入stack中显示出来；

       b：通过调用showNext、showPrevious方法显示下一个、上一个组件；

2 XML属性：

Android:animateFirstView：设置显示该组件的第一个View时是否使用动画

android:inAnimation：设置组件显示时使用的动画

android:loopViews：设置循环到最后一个组件后是否自动“转头”到第一个组件

android:outAnimation：设置组件隐藏时使用的动画

3 常用方法：

//设置动画自动播放的时间间隔
//设置显示第一个View时是否使用动画
 setAnimateFirstView(true);
  //设置适配器
setAdapter(adapter);
setInAnimation(Context context, int resourceID);//设置图片进入动画
setOutAnimation(Context context, int resourceID);//设置图片出来动画
showNext();//显示下一个view
showPrevious();//显示下一个view

4  使用示例

xml布局：

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:orientation="horizontal"    android:gravity="center"    android:layout_width="match_parent"    android:layout_height="match_parent">    <!--属性  android:loopViews="true" 设置动画可循环播放-->    <StackView        android:id="@+id/av_flipper"        android:layout_width="0dp"        android:loopViews="true"        android:layout_weight="2"        android:layout_height="wrap_content">    </StackView>    <LinearLayout        android:layout_width="0dp"        android:gravity="center"        android:layout_weight="1"        android:layout_height="wrap_content"        android:layout_marginBottom="10dp"        android:orientation="vertical">        <Button            android:text="下一个"            android:onClick="next"            android:layout_width="wrap_content"            android:layout_height="wrap_content"/>        <Button            android:text="上一个"            android:onClick="previous"            android:layout_width="wrap_content"            android:layout_height="wrap_content"/>        <Button            android:text="自动播放"            android:visibility="gone"            android:onClick="auto"            android:layout_width="wrap_content"            android:layout_height="wrap_content"/>    </LinearLayout></LinearLayout>

自定义动画xml文件：

anim_left_enter.xml：

<?xml version="1.0" encoding="utf-8"?><objectAnimator xmlns:android="http://schemas.android.com/apk/res/android"     android:interpolator="@android:anim/accelerate_decelerate_interpolator"    android:propertyName="x"    android:valueType="floatType"    android:valueFrom="-1500"    android:valueTo="0"    android:duration="600"></objectAnimator>

anim_left_exit.xml：

<?xml version="1.0" encoding="utf-8"?><objectAnimator xmlns:android="http://schemas.android.com/apk/res/android"     android:interpolator="@android:anim/accelerate_decelerate_interpolator">    <objectAnimator        android:propertyName="x"        android:valueType="floatType"        android:valueFrom="0"        android:valueTo="1500"        android:duration="600"/></objectAnimator>

anim_right_enter.xml：

<?xml version="1.0" encoding="utf-8"?><objectAnimator xmlns:android="http://schemas.android.com/apk/res/android"     android:interpolator="@android:anim/accelerate_decelerate_interpolator"    android:propertyName="x"    android:valueType="floatType"    android:valueFrom="1500"    android:valueTo="0"    android:duration="600"></objectAnimator>

anim_right_exit.xml：

<?xml version="1.0" encoding="utf-8"?><objectAnimator xmlns:android="http://schemas.android.com/apk/res/android"     android:interpolator="@android:anim/accelerate_decelerate_interpolator">    <objectAnimator        android:propertyName="x"        android:valueType="floatType"        android:valueFrom="0"        android:valueTo="-1500"        android:duration="600"/></objectAnimator>

Activity中实现：

public class StackviewActivity extends Activity  {    private StackView avFlipper;    //图片资源    public int[] imgIds = {R.mipmap.pic_1,R.mipmap.pic_2,R.mipmap.pic_3,R.mipmap.pic_4,R.mipmap.pic_5};    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_stackview);        FliperAdapter adapter  = new FliperAdapter(this,imgIds);        avFlipper = (StackView) findViewById(R.id.av_flipper);        //设置显示第一个View时是否使用动画        avFlipper.setAnimateFirstView(true);        //设置适配器        avFlipper.setAdapter(adapter);    }    /**     * 下一个     * @param view     */    public void next(View view){        //左进左出        avFlipper.setInAnimation(this , R.animator.anim_left_enter);//设置图片进入动画        avFlipper.setOutAnimation(this , R.animator.anim_left_exit);//设置图片出来动画        avFlipper.showNext();//显示下一个view    }    /**     * 上一个     * @param view     */    public void previous(View view){        //右进右出        avFlipper.setInAnimation(this , R.animator.anim_right_enter);        avFlipper.setOutAnimation(this , R.animator.anim_right_exit);        avFlipper.showPrevious();//显示下一个view    }}

完整源码点击查看。

5 效果图