项目中需要使用文字自动轮播的效果,先上效果图;
实现也很简单,就是一个进入和出去的动画。可以让文字自动轮播。
首先最简单的两个动画,写在了XML里面,当然也可以写到java中,
第一个in_animation.xml
- <?xml version="1.0" encoding="utf-8"?>
- <set xmlns:android="http://schemas.android.com/apk/res/android">
- <translate
- android:duration="1000"
- android:fromYDelta="100%"
- android:toYDelta="0%" />
- </set>
第二个out_animation.xml
- <?xml version="1.0" encoding="utf-8"?>
- <set xmlns:android="http://schemas.android.com/apk/res/android">
- <translate
- android:duration="1000"
- android:fromYDelta="0%"
- android:toYDelta="-100%" />
- </set>
下面就要开始自定义这个自动轮播的TextView了,、
第一步:上网查了下,Android里面已经有了TextSwitcher这个类,我们继承这个类,实现ViewSwitcher.ViewFactory提供的创建TextView的方法即可;
第二步:为了实现轮播,当然是每隔一个时间段就播放一次的效果,我们可以使用Timer定时器,每隔几秒发送一个Message给Handler,handler接受到消息开始更新文字。代码不多,就一下子贴出来吧,类似这样:
- public class TextSwitchView extends TextSwitcher implements ViewSwitcher.ViewFactory{
-
- private int index= -1;
- private Context context;
- private String[] resources = {"窗前明月光","疑是地上霜","举头望明月","低头思故乡"};
- private Timer timer;
-
- private Handler mHandler = new Handler(){
- @Override
- public void handleMessage(Message msg) {
- switch(msg.what) {
- case 1:
- index = next();
- updateText();
- break;
- }
- super.handleMessage(msg);
- }
- };
-
- //自定义View的构造方法
- public TextSwitchView(Context context) {
- super(context);
- this.context = context;
- init();
- }
-
- public TextSwitchView(Context context, AttributeSet attrs) {
- super(context, attrs);
- this.context = context;
- init();
- }
-
- private void init() {
- if (timer == null) {
- timer = new Timer();
- }
- //实现ViewSwitcher.ViewFactory接口方法,创建出TextView并启动动画
- setFactory(this);
- setInAnimation(AnimationUtils.loadAnimation(context, R.anim.in_animation));
- setOutAnimation(AnimationUtils.loadAnimation(context, R.anim.out_animation));
- }
-
- public void setResources(String[] res) {
- resources = res;
- }
-
- //这个是自定义View的启动点,从外面传进来的间隔时间,并以此来开启这个定时任务器
- public void setTextStillTime(long time) {
- if (timer == null) {
- timer = new Timer();
- } else {
- timer.scheduleAtFixedRate(new MyTask(), 1, time);
- }
- }
-
- //启动任务,每间隔time时间发送一个消息给handler更新文字
- private class MyTask extends TimerTask {
- @Override
- public void run() {
- mHandler.sendEmptyMessage(1);
- }
- }
-
- private int next() {
- int flag = index + 1;
- if (flag > resources.length - 1) {
- flag = flag - resources.length;
- }
- return flag;
- }
-
- private void updateText() {
- setText(resources[index]);
- }
-
- @Override
- public View makeView() {
- TextView tv = new TextView(context);
- tv.setTextColor(Color.parseColor("#FF0000"));
- tv.setTextSize(22);
- return tv;
- }
- }
在项目中使用,要是需要自动更新的话就使用 textSwitchView.setTextStillTime(3000)方法;
- /**
- * 自动更新的TextSwitchView
- */
- TextSwitchView textSwitchView = (TextSwitchView) findViewById(R.id.switcher2);
- String[] autoRes = {"窗前明月光","疑是地上霜","举头望明月","低头思故乡"};
- textSwitchView.setResources(autoRes);
- textSwitchView.setTextStillTime(3000);
要是需要手动点击的话,给SwitchTextView设置点击响应事件就好了,整体Activity代码:
- public class MainActivity extends AppCompatActivity {
- private TextSwitcher textSwitcher1;
- private int curStr;
- String[] mRes = {"点击我翻转", "窗前明月光","疑是地上霜","举头望明月","低头思故乡"};
-
- @Override
- protected void onCreate(Bundle savedInstanceState) {
- super.onCreate(savedInstanceState);
- setContentView(R.layout.activity_main);
-
- /**
- * 自动更新的TextSwitchView
- */
- TextSwitchView textSwitchView = (TextSwitchView) findViewById(R.id.switcher2);
- String[] autoRes = {"窗前明月光","疑是地上霜","举头望明月","低头思故乡"};
- textSwitchView.setResources(autoRes);
- textSwitchView.setTextStillTime(3000);
-
-
- /**
- * 点击更新的TextSwitchView
- */
- textSwitcher1 = (TextSwitcher) findViewById(R.id.switcher1);
- textSwitcher1.setFactory(new ViewSwitcher.ViewFactory() {
- @Override
- public View makeView() {
- TextView tv = new TextView(MainActivity.this);
- tv.setTextColor(Color.parseColor("#30c2b1"));
- tv.setText("点击我翻转");
- tv.setTextSize(22);
- return tv;
- }
- });
- next(null);
- }
-
- public void next(View source) {
- textSwitcher1.setText(mRes[curStr++ % mRes.length]);
- }
-
- }
上面的onClick()事件是在xml中定义的:这里要注意下,到进来的项目和你自己的包名不同,需要修改成自己的包名的TextSwitchView
- <?xml version="1.0" encoding="utf-8"?>
- <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
- android:layout_width="match_parent"
- android:layout_height="match_parent"
- android:orientation="vertical" >
-
-
- <TextSwitcher
- android:id="@+id/switcher1"
- android:layout_width="wrap_content"
- android:layout_height="wrap_content"
- android:layout_marginTop="100dp"
- android:inAnimation="@anim/in_animation"
- android:outAnimation="@anim/out_animation"
- android:layout_gravity="center"
- android:onClick="next"></TextSwitcher>
-
- <com.example.verticalscrolltext.TextSwitchView
- android:id="@+id/switcher2"
- android:layout_width="wrap_content"
- android:layout_height="wrap_content"
- android:layout_marginTop="100dp"
- android:inAnimation="@anim/in_animation"
- android:outAnimation="@anim/out_animation"
- android:layout_gravity="center"
- android:onClick="next"></com.example.verticalscrolltext.TextSwitchView>
-
-
- </LinearLayout>
上面把整个项目代码全贴出来了,下载项目代码链接:
https://github.com/buder-cp/base_component_learn/tree/master/verticalscrolltext