Android 中textSwitcher与imageSwitcher的使用

TextSwitcher的使用，它和ImageSwitcher非常类似，都是继承ViewSwitcher，只是TextSwitcher用于切换文本，我们可以设置进入和退出的动画，使其设置文字和图片更加平滑，增加用户体验。

这里我们写了一个按钮来切换文字和图片的例子：
效果图如下：

xml布局文件：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/activity_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="com.example.administrator.textswitcherdemo.MainActivity">

    <TextSwitcher
        android:id="@+id/textSwitcher"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />

    <ImageSwitcher
        android:id="@+id/imageSwitcher"
        android:layout_width="match_parent"
        android:layout_height="200dp" />

    <Button
        android:id="@+id/btn"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="改变文字" />
</LinearLayout>

activity中：

package com.example.administrator.textswitcherdemo;

import android.graphics.Color;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.Gravity;
import android.view.View;
import android.view.animation.Animation;
import android.view.animation.AnimationUtils;
import android.widget.Button;
import android.widget.ImageSwitcher;
import android.widget.ImageView;
import android.widget.TextSwitcher;
import android.widget.TextView;
import android.widget.ViewSwitcher;

public class MainActivity extends AppCompatActivity implements View.OnClickListener {

    private Button btn;
    private TextSwitcher textSwitcher;
    private int i = 0;
    private String[] strings = {"社会王", "我的加特林呢", "哒哒哒哒哒哒", "冒蓝光的"};
    private int[] ints = {R.drawable.iv1, R.drawable.iv2, R.drawable.iv3, R.drawable.iv4};
    private ImageSwitcher imageSwitcher;

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


        // 设置转换时的淡入和淡出动画效果（可选）  
        Animation inAnimation = AnimationUtils.loadAnimation(this, android.R.anim.fade_in);
        Animation outAnimation = AnimationUtils.loadAnimation(this, android.R.anim.fade_out);


        textSwitcher = (TextSwitcher) findViewById(R.id.textSwitcher);
        imageSwitcher = (ImageSwitcher) findViewById(R.id.imageSwitcher);
        textSwitcher.setFactory(new ViewSwitcher.ViewFactory() {
            @Override
            public View makeView() {
                TextView textView = new TextView(MainActivity.this);
                //设置文字居中显示
                textView.setGravity(Gravity.CENTER);
                //设置字体大小
                textView.setTextSize(36);
                //设置字体的颜色
                textView.setTextColor(Color.GREEN);
                return textView;
            }
        });
        textSwitcher.setInAnimation(inAnimation);
        textSwitcher.setOutAnimation(outAnimation);

        imageSwitcher.setFactory(new ViewSwitcher.ViewFactory() {
            @Override
            public View makeView() {
                ImageView imageView = new ImageView(MainActivity.this);
                imageView.setImageResource(R.drawable.iv2);
                return imageView;
            }
        });
        imageSwitcher.setInAnimation(inAnimation);
        imageSwitcher.setOutAnimation(outAnimation);

        btn = (Button) findViewById(R.id.btn);
        btn.setOnClickListener(this);
    }

    @Override
    public void onClick(View v) {
        switch (v.getId()) {
            case R.id.btn:
                if (i < 4) {
                    textSwitcher.setText(strings[i]);
                    imageSwitcher.setImageResource(ints[i]);
                }
                i++;
                break;
        }
    }
}

当然我么也可以使用imageSwitcher进行图片的左右切换，来看效果

/**
 * 一个左右滑动浏览图片的Demo
 *
 */
public class ImageSwicherDemoActivity extends Activity implements ViewFactory,
        OnTouchListener {

    private ImageSwitcher imageSwicher;

    // 图片数组
    private int[] arrayPictures = { R.drawable.iv1, R.drawable.iv2,
            R.drawable.iv3, R.drawable.iv4 };
    // 要显示的图片在图片数组中的Index
    private int pictureIndex;
    // 左右滑动时手指按下的X坐标
    private float touchDownX;
    // 左右滑动时手指松开的X坐标
    private float touchUpX;

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_image_swicher);

        imageSwicher = (ImageSwitcher) findViewById(R.id.imageSwitcher);

        // 为ImageSwicher设置Factory，用来为ImageSwicher制造ImageView
        imageSwicher.setFactory(this);
        // 设置ImageSwitcher左右滑动事件
        imageSwicher.setOnTouchListener(this);
    }

    @Override
    public View makeView() {
        ImageView imageView = new ImageView(this);
        imageView.setImageResource(arrayPictures[pictureIndex]);
        return imageView;
    }

    @Override
    public boolean onTouch(View v, MotionEvent event) {
        if (event.getAction() == MotionEvent.ACTION_DOWN) {
            // 取得左右滑动时手指按下的X坐标
            touchDownX = event.getX();
            return true;
        } else if (event.getAction() == MotionEvent.ACTION_UP) {
            // 取得左右滑动时手指松开的X坐标
            touchUpX = event.getX();
            // 从左往右，看前一张
            if (touchUpX - touchDownX > 100) {
                // 取得当前要看的图片的index
                pictureIndex = pictureIndex == 0 ? arrayPictures.length - 1
                        : pictureIndex - 1;
                // 设置图片切换的动画
                imageSwicher.setInAnimation(AnimationUtils.loadAnimation(this,
                        android.R.anim.slide_in_left));
                imageSwicher.setOutAnimation(AnimationUtils.loadAnimation(this,
                        android.R.anim.slide_out_right));
                // 设置当前要看的图片
                imageSwicher.setImageResource(arrayPictures[pictureIndex]);
                // 从右往左，看下一张
            } else if (touchDownX - touchUpX > 100) {
                // 取得当前要看的图片的index
                pictureIndex = pictureIndex == arrayPictures.length - 1 ? 0
                        : pictureIndex + 1;
                // 设置图片切换的动画
                // 由于Android没有提供slide_out_left和slide_in_right，所以仿照slide_in_left和slide_out_right编写了slide_out_left和slide_in_right
                imageSwicher.setInAnimation(AnimationUtils.loadAnimation(this,
                        R.anim.slide_out_left));
                imageSwicher.setOutAnimation(AnimationUtils.loadAnimation(this,
                        R.anim.slide_in_right));
                // 设置当前要看的图片
                imageSwicher.setImageResource(arrayPictures[pictureIndex]);
            }
            return true;
        }
        return false;

 }
}

效果图如下：

demo下载地址

http://download.csdn.net/detail/afanbaby/9916546

本人菜鸟一个，有什么不对的地方希望大家指出评论，大神勿喷，希望大家一起学习进步！