Animation之ViewFlipper和ViewSwitcher

最新推荐文章于 2020-09-09 18:57:05 发布

「已注销」

最新推荐文章于 2020-09-09 18:57:05 发布

阅读量225

点赞数

分类专栏： Android 文章标签： ViewSwitcher

本文链接：https://blog.csdn.net/iteye_21164/article/details/82648112

版权

Android 专栏收录该内容

10 篇文章 0 订阅

订阅专栏

ViewFlipper继承于ViewAnimator，android.widget.ViewAnimator类继承至FrameLayout，ViewAnimator类的作用是为FrameLayout里面的View切换提供动画效果。

该类有如下几个和动画相关的函数：

l setInAnimation：设置 View进入屏幕时候使用的动画，该函数有两个版本，一个接受单个参数，类型为android.view.animation.Animation；一个接受两个参数，类型为Context和int，分别为 Context对象和定义Animation的resourceID。

setOutAnimation: 设置View退出屏幕时候使用的动画，参数setInAnimation函数一样。
showNext：调用该函数来显示FrameLayout里面的下一个View。
showPrevious：调用该函数来显示FrameLayout里面的上一个View。

一般不直接使用 ViewAnimator而是使用它的两个子类ViewFlipper和ViewSwitcher。
ViewFlipper可以用来指定FrameLayout内多个View之间的切换效果，可以一次指定也可以每次切换的时候都指定单独的效果。该类额外提供了如下几个函数：

XML属性：

属性名称

描述

android:autoStart

当设为true时，自动启动动画。此时必须是一个布尔值，属性值为true或false

（对应于全局资源属性R.attr.autoStart）

android:flipInterval

显示下一个视图的时间间隔

isAutoStart 如果视图显示到窗口上时会自动调用startFlipping()方法，则返回true
isFlipping：用来判断View切换是否正在进行
setAutoStart 设置视图显示到窗口上时是否会自动调用startFlipping()方法
setFilpInterval：设置View之间切换的时间间隔
startFlipping：使用上面设置的时间间隔来开始切换所有的View，切换会循环进行
stopFlipping: 停止View切换

ViewFlipper示例：
记住， ViewFlipper是继承至FrameLayout的，所以它是一个Layout里面可以放置多个View。在示例中定义一个 ViewFlipper，里面包含三个ViewGroup作为示例的三个屏幕，每个ViewGroup中包含一个按钮和一张图片，点击按钮则显示下一个屏幕。代码如下（res\layout\main.xml）：

view plain copy to clipboard print ?

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<ViewFlipper android:id="@+id/details"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:persistentDrawingCache="animation"
android:flipInterval="1000"
android:inAnimation="@anim/push_left_in"
android:outAnimation="@anim/push_left_out">
<LinearLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<Button
android:text="Next"
android:id="@+id/Button_next1"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
</Button>
<ImageView
android:id="@+id/image1"
android:src="@drawable/dell1"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
</ImageView>
</LinearLayout>
<LinearLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<Button
android:text="Next"
android:id="@+id/Button_next2"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
</Button>
<ImageView
android:id="@+id/image2"
android:src="@drawable/lg"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
</ImageView>
</LinearLayout>
<LinearLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<Button
android:text="Next"
android:id="@+id/Button_next3"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
</Button>
<ImageView
android:id="@+id/image3"
android:src="@drawable/lenovo"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
</ImageView>
</LinearLayout>
</ViewFlipper>
</LinearLayout>

很简单，在Layout定义中指定动画的相关属性就可以了，通过persistentDrawingCache指定缓存策略；flipInterval指定每个View动画之间的时间间隔；inAnimation和outAnimation分别指定View进出使用的动画效果。动画效果定义如下：

res\anim\push_left_in.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate
android:fromXDelta="100%p"
android:toXDelta="0"
android:duration="500"/>
<alpha
android:fromAlpha="0.0"
android:toAlpha="1.0"
android:duration="500" />
</set>
res\anim\push_left_out.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate
android:fromXDelta="0"
android:toXDelta="-100%p"
android:duration="500"/>
<alpha
android:fromAlpha="1.0"
android:toAlpha="0.0"
android:duration="500" />
</set>

Activity代码如下（src\cc\c\TestActivity.java）：

public class TestActivity extends Activity {
private ViewFlipper mViewFlipper;
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
Button buttonNext1 = (Button) findViewById(R.id.Button_next1);
mViewFlipper = (ViewFlipper) findViewById(R.id.flipper);
buttonNext1.setOnClickListener(new View.OnClickListener() {
public void onClick(View view) {
//在layout中定义的属性，也可以在代码中指定
// mViewFlipper.setInAnimation(getApplicationContext(), R.anim.push_left_in);
// mViewFlipper.setOutAnimation(getApplicationContext(), R.anim.push_left_out);
// mViewFlipper.setPersistentDrawingCache(ViewGroup.PERSISTENT_ALL_CACHES); //指定缓存策略
// mViewFlipper.setFlipInterval(1000);
mViewFlipper.showPrevious(); //显示前一个视图
mViewFlipper.showNext();//显示下一个视图
//调用下面的函数将会循环显示mViewFlipper内的所有View。
// mViewFlipper.startFlipping(); //启动循环切换
}
});
Button buttonNext2 = (Button) findViewById(R.id.Button_next2);
buttonNext2.setOnClickListener(new View.OnClickListener() {
public void onClick(View view) {
mViewFlipper.showNext();
}
});
Button buttonNext3 = (Button) findViewById(R.id.Button_next3);
buttonNext3.setOnClickListener(new View.OnClickListener() {
public void onClick(View view) {
mViewFlipper.showNext();
}
});
}
}

ViewSwitcher 顾名思义Switche r特指在两个View之间切换，可以通过该类指定一个ViewSwitcher.ViewFactory 工程类来创建这两个View。该类也具有两个子类ImageSwitcher、TextSwitcher分别用于图片和文本切换。

注意:一个 ViewSwitcher 只允许包含两个子视图，且一次仅能显示一个。
（译者注：与ViewFlipper 类相似，但该类不常用，常用其两个子类 ImageSwitcher ：转换图片时增加动画效果; TextSwitcher ：转换文字时增加动画效果; 其实例见apidemos 中ImageSwitcher 实例和TextSwitcher 实例）

公共方法：

public void addView(View child, int index, ViewGroup.LayoutParams params) —— 添加一个指定布局参数的子视图

参数：child     添加的子视
      index     添加的子视图的索引
      params     子视图的布局参数
      异常
      IllegalStateException        如果切换器中已经包含了两个视图时。

public View getNextView ()　　返回下一个要显示的视图

　　返回视图切换之后将要显示出的下一个视图

public void reset ()　重置视图转换器(ViewSwitcher ）来隐藏所有存在的视图，并使转换器达到一次动画都还没有播放的状态。

public void setFactory (ViewSwitcher.ViewFactory factory) ——设置用来生成将在视图转换器中切换的两个视图的工厂。也可以调用两次 addView(android.view.View, int, android.view.ViewGroup.LayoutParams) 来替代使用工厂的方法。
可通过实现ViewSwitcher.ViewFactory接口的makeView()方法来添加布局。

文字转换器控件（改变文字时增加一些动画效果）

    被用来使屏幕上的label产生动画效果。每当 setText(CharSequence)被调用时，TextSwitcher使用动画方式将当前的文字内容消失并显示新的文字内容。

公共方法:
public void setCurrentText (CharSequence text)    设置当前显示的文本视图的文字内容。非动画方式显示。

public void setText (CharSequence text)    设置下一视图的文本内容并切换到下一视图。可以动画的退出当前文本内容，显示下一文本内容。

示例：
public class TextSwitcher1 extends Activity implements ViewSwitcher.ViewFactory,
        View.OnClickListener {

    private TextSwitcher mSwitcher;

    private int mCounter = 0;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        setContentView(R.layout.text_switcher_1);

        mSwitcher = (TextSwitcher) findViewById(R.id.switcher);
        // 指定转换器的 ViewSwitcher.ViewFactory
         mSwitcher.setFactory(this);
          // 设置淡入和淡出的动画效果
        Animation in = AnimationUtils.loadAnimation(this,
                android.R.anim.fade_in);
        Animation out = AnimationUtils.loadAnimation(this,
                android.R.anim.fade_out);
        mSwitcher.setInAnimation(in);
        mSwitcher.setOutAnimation(out);
         // 单击一次按钮改变一次文字
        Button nextButton = (Button) findViewById(R.id.next);
        nextButton.setOnClickListener(this);

        updateCounter();
    }

    public void onClick(View v) {
        mCounter++;
        updateCounter();
    }

    private void updateCounter() {
        mSwitcher.setText(String.valueOf(mCounter));
    }
// 重写 ViewSwitcher.ViewFactory 的 makeView()，返回一个 View
    public View makeView() {
        TextView t = new TextView(this);
        t.setGravity(Gravity.TOP | Gravity.CENTER_HORIZONTAL);
        t.setTextSize(36);
        return t;
    }
}

ImageSwitcher图片切换器

ImageSwitcher是Android中控制图片展示效果的一个控件，每当调用以下方法：

　　　　setImageURI(Uri uri)：设置图片地址

　　　　setImageResource(int resid)：设置图片资源库

　　　　setImageDrawable(Drawable drawable)：绘制图片

ImageSwitcher使用动画方式实现图片之间的切换效果。

示例:

public class ImageSwitcher1 extends Activity implements
        AdapterView.OnItemSelectedListener, ViewSwitcher.ViewFactory {

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        requestWindowFeature(Window.FEATURE_NO_TITLE);

        setContentView(R.layout.image_switcher_1);
        //实例化ImageSwitcher
        mSwitcher = (ImageSwitcher) findViewById(R.id.switcher);

//指定转换器的 ViewSwitcher.ViewFactory
mSwitcher.setFactory(this);

       //指定转换的动画效果
        mSwitcher.setInAnimation(AnimationUtils.loadAnimation(this,
                android.R.anim.fade_in));
        mSwitcher.setOutAnimation(AnimationUtils.loadAnimation(this,
                android.R.anim.fade_out));

        Gallery g = (Gallery) findViewById(R.id.gallery);
        g.setAdapter(new ImageAdapter(this));
        g.setOnItemSelectedListener(this);
    }

    public void onItemSelected(AdapterView<?> parent, View v, int position, long id) {

       //设置ImageSwitcher显示的图片，将触发图片之间的变化
        mSwitcher.setImageResource(mImageIds[position]);
    }

    public void onNothingSelected(AdapterView<?> parent) {
    }
   // 重写 ViewSwitcher.ViewFactory 的 makeView()，返回一个 View
    public View makeView() {
        ImageView i = new ImageView(this);
        i.setBackgroundColor(0xFF000000);
        i.setScaleType(ImageView.ScaleType.FIT_CENTER);
        i.setLayoutParams(new ImageSwitcher.LayoutParams(LayoutParams.MATCH_PARENT,
                LayoutParams.MATCH_PARENT));
        return i;
    }

    private ImageSwitcher mSwitcher;

    public class ImageAdapter extends BaseAdapter {
        public ImageAdapter(Context c) {
            mContext = c;
        }

        public int getCount() {
            return mThumbIds.length;
        }

        public Object getItem(int position) {
            return position;
        }

        public long getItemId(int position) {
            return position;
        }

        public View getView(int position, View convertView, ViewGroup parent) {
            ImageView i = new ImageView(mContext);

            i.setImageResource(mThumbIds[position]);
            i.setAdjustViewBounds(true);
            i.setLayoutParams(new Gallery.LayoutParams(
                    LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT));
            i.setBackgroundResource(R.drawable.picture_frame);
            return i;
        }

        private Context mContext;

    }

    private Integer[] mThumbIds = {
            R.drawable.sample_thumb_0, R.drawable.sample_thumb_1,
            R.drawable.sample_thumb_2, R.drawable.sample_thumb_3,
            R.drawable.sample_thumb_4, R.drawable.sample_thumb_5,
            R.drawable.sample_thumb_6, R.drawable.sample_thumb_7};

    private Integer[] mImageIds = {
            R.drawable.sample_0, R.drawable.sample_1, R.drawable.sample_2,
            R.drawable.sample_3, R.drawable.sample_4, R.drawable.sample_5,
            R.drawable.sample_6, R.drawable.sample_7};

}