使用TextSwitcher和ImageSwitcher实现平滑过渡

更改视图中的内容是多数应用程序的基本功能,但是这未必是单调无趣的。如果使用默认的TextView控件,你会发现当切换其内容时,并没有良好的视觉体验。因此如果有一种方法可以为内容切换添加动画效果就太好了。为了使过渡过程的视觉效果更自然,Android提供了TextSwitcher和ImageSwitcher这两个类分别代替TextView与ImageView。效果如下:

使用TextSwitcher和ImageSwitcher实现平滑过渡_第1张图片

TextSwitcher用于为文本标签添加动画效果。当调用TextSwitcher的相关方法时,TextSwitcher便会以动画的方式换出当前文本,并换入新的文本。要获得这种让用户愉悦的过渡效果,只需要以下几个简单步骤:

package com.example.huangfei.switcherdemo;

import android.app.Activity;
import android.os.Bundle;
import android.view.Gravity;
import android.view.View;
import android.widget.TextSwitcher;
import android.widget.TextView;
import android.widget.ViewSwitcher;

public class MainActivity extends Activity {
    private TextSwitcher mTextSwitcher;
    private static final String[] TEXTS = {"First", "Second", "Third"};
    private int mTextsPosition = 0;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        /** * TextSwitcher使用步骤: * 1、通过findViewById()方法获取TextSwitcher对象的引用mTextSwitcher,当然也可以直接在代码中构造该 * 对象。 * 2、通过mTextSwitcher.setFactory()方法指定TextSwitcher的ViewFactory。 * 3、通过mTextSwitcher.setInAnimation()方法设置换入动画效果。 * 4、通过mTextSwitcher.setOutAnimation()方法设置换出动画效果。 * * TextSwitcher的工作原理是:首先通过ViewFactory创建两个用于在TextSwitcher中切换的视图,每当调用 * setText()方法时,TextSwitcher首先移除当前视图并显示setOutAnimation()方法设置的动画,然后并将 * 另一个视图切换进来,并显示setInAnimation()方法设置的动画 */
        mTextSwitcher = (TextSwitcher) findViewById(R.id.ts_text);
        mTextSwitcher.setFactory(new ViewSwitcher.ViewFactory() {
            @Override
            public View makeView() {
                TextView t = new TextView(MainActivity.this);
                t.setGravity(Gravity.CENTER);
                return t;
            }
        });
        mTextSwitcher.setInAnimation(this, android.R.anim.fade_in);
        mTextSwitcher.setOutAnimation(this, android.R.anim.fade_out);

        onSwitchText(null);
    }

    public void onSwitchText(View v) {
        mTextSwitcher.setText(TEXTS[mTextsPosition]);
        setNextPosition();
    }

    private void setNextPosition() {
        mTextsPosition = (mTextsPosition + 1) % TEXTS.length;
    }

}

布局文件

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout  xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent">

    <TextSwitcher  android:id="@+id/ts_text" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerInParent="true"/>

    <Button  android:layout_alignParentBottom="true" android:layout_width="fill_parent" android:layout_height="wrap_content" android:onClick="onSwitchText" android:text="Click me"/>

</RelativeLayout>

ImageSwitcher与TextSwitcher的原理是一样的,只不过前者切换的是图片,或者切换的是文本。请注意,不要滥用TextSwitcher和ImageSwitcher,因为谁也也不想把自己的应用程序点缀的像一颗圣诞树那样不自然。

你可能感兴趣的:(switcher)