博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
Android_TextSwitcher和ImageSwitcher
阅读量:6912 次
发布时间:2019-06-27

本文共 7902 字,大约阅读时间需要 26 分钟。

hot3.png

先看看继承关系,ImageSwitcher和TextSwitcher的继承关系是一样的。两个重要的父类:ViewSwitcher和ViewAnimator

继承于ViewSwitcher,说明具备了切换功能

继承于ViewAnimator,说明具备了动画功能

ImageSwitcher原理

ImageSwitcher的内容在Gallery中已经有所讲解,这边系统的详解一下

ImageSwitcher粗略的理解就是ImageView的选择器

ImageSwitcher的原理:ImageSwitcher有两个子View:ImageView,当左右滑动的时候,就在这两个ImageView之间来回切换来显示图片

下面我们来看看Android自带的source,以便更深的理解这个原理:

既然有两个子ImageView,那么我们要创建两个ImageView给ImageSwitcher。创建ImageSwitcher是通过工厂来实现的,看下面代码

imageSwicher.setFactory(this);
为imageSwitcher设置ViewFactory

@Overridepublic View makeView() {	ImageView imageView = new ImageView(this);	imageView.setImageResource(arrayPictures[pictureIndex]);	return imageView;}
实现ViewFactory的makeView()方法,makeView()方法就是负责给ImageSwitcher创建两个字ImageView

下面再来看看setFactory()方法的具体代码

public void setFactory(ViewFactory factory) {    mFactory = factory;    obtainView();    obtainView();}
可以看到在setFactory的同时,调用了两遍obtainView()方法,obtainView()方法就是给ImageSwitcher添加子ImageView的,调用两遍就是添加了两个子ImageView

再来看看obtainView()方法的具体代码

private View obtainView() {    View child = mFactory.makeView();    LayoutParams lp = (LayoutParams) child.getLayoutParams();    if (lp == null) {        lp = new LayoutParams(LayoutParams.FILL_PARENT, LayoutParams.WRAP_CONTENT);    }    addView(child, lp);    return child;}
可以看到obtainView()方法的的职责就是:通过makeView()方法创建View,然后把创建出来的View添加到ImageSwitcher上

再来看看下面的方法

public void setImageResource(int resid){    ImageView image = (ImageView)this.getNextView();    image.setImageResource(resid);    showNext();}
此方法就是用来显示下一张图片的,我们可以看到这个方法里面调用了getNextView()方法和showNext()方法,那么我们来看看这两个方法的具体代码

public View getNextView() {    int which = mWhichChild == 0 ? 1 : 0;    return getChildAt(which);}
public void showNext() {    setDisplayedChild(mWhichChild + 1);}
getNextView()方法是在两个子ImageView之间切换,showNext()方法是负责显示这两个子View中的哪一个

也就是说,现用getNextView()方法得到下一个View,然后重新设置这个View的imageResource,最后通过showNext()方法将下一个View显示出来

好了,ImageSwitcher的原理讲完了。下面附上一个Demo

ImageSwitcher实例

main.xml

ImageSwicherDemoActivity.java

package com.tianjf;import android.app.Activity;import android.os.Bundle;import android.view.MotionEvent;import android.view.View;import android.view.View.OnTouchListener;import android.view.animation.AnimationUtils;import android.widget.ImageSwitcher;import android.widget.ImageView;import android.widget.ViewSwitcher.ViewFactory;/** * 一个左右滑动浏览图片的Demo *  * @author tianjf *  */public class ImageSwicherDemoActivity extends Activity implements ViewFactory,		OnTouchListener {	private ImageSwitcher imageSwicher;	// 图片数组	private int[] arrayPictures = { R.drawable.bg001, R.drawable.bg002,			R.drawable.bg003, R.drawable.bg004 };	// 要显示的图片在图片数组中的Index	private int pictureIndex;	// 左右滑动时手指按下的X坐标	private float touchDownX;	// 左右滑动时手指松开的X坐标	private float touchUpX;	@Override	public void onCreate(Bundle savedInstanceState) {		super.onCreate(savedInstanceState);		setContentView(R.layout.main);		imageSwicher = (ImageSwitcher) findViewById(R.id.imageSwicher);		// 为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;	}}
由于Android没有提供slide_out_left和slide_in_right,所以仿照slide_in_left和slide_out_right编写了slide_out_left和slide_in_right,代码如下:

slide_in_right.xml

slide_out_left.xml

好了ImageSwitcher的讲解到此结束,下面附上一个和ImageSwitcher差不多的TextSwitcher的Demo。

由于TextSwitcher的原理和ImageSwitcher一样,只是一个是ImageView,一个是TextView。那么在此就不多说,直接上代码

main.xml

TextSwitcherDemoActivity.java

package com.tianjf;import android.app.Activity;import android.os.Bundle;import android.view.Gravity;import android.view.MotionEvent;import android.view.View;import android.view.View.OnTouchListener;import android.view.ViewGroup.LayoutParams;import android.view.animation.AnimationUtils;import android.widget.TextSwitcher;import android.widget.TextView;import android.widget.ViewSwitcher.ViewFactory;/** * 一个左右滑动浏览文本的Demo *  * @author tianjf *  */public class TextSwitcherDemoActivity extends Activity implements ViewFactory,		OnTouchListener {	private TextSwitcher textSwicher;	// 图片数组	private String[] arrayTexts = { "文本01", "文本02", "文本03", "文本04" };	// 要显示的图片在图片数组中的Index	private int textIndex;	// 左右滑动时手指按下的X坐标	private float touchDownX;	// 左右滑动时手指松开的X坐标	private float touchUpX;	@Override	public void onCreate(Bundle savedInstanceState) {		super.onCreate(savedInstanceState);		setContentView(R.layout.main);		textSwicher = (TextSwitcher) findViewById(R.id.textSwicher);		// 为TextSwitcher设置Factory,用来为TextSwitcher制造TextView		textSwicher.setFactory(this);		// 设置TextSwitcher左右滑动事件		textSwicher.setOnTouchListener(this);	}	@Override	public View makeView() {		TextView textView = new TextView(this);		textView.setTextSize(100);		textView.setLayoutParams(new TextSwitcher.LayoutParams(				LayoutParams.FILL_PARENT, LayoutParams.FILL_PARENT));		textView.setGravity(Gravity.CENTER);		textView.setText(arrayTexts[textIndex]);		return textView;	}	@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				textIndex = textIndex == 0 ? arrayTexts.length - 1						: textIndex - 1;				// 设置文本切换的动画				textSwicher.setInAnimation(AnimationUtils.loadAnimation(this,						android.R.anim.slide_in_left));				textSwicher.setOutAnimation(AnimationUtils.loadAnimation(this,						android.R.anim.slide_out_right));				// 设置当前要看的文本				textSwicher.setText(arrayTexts[textIndex]);				// 从右往左,看下一张			} else if (touchDownX - touchUpX > 100) {				// 取得当前要看的文本的index				textIndex = textIndex == arrayTexts.length - 1 ? 0						: textIndex + 1;				// 设置文本切换的动画				// 由于Android没有提供slide_out_left和slide_in_right,所以仿照slide_in_left和slide_out_right编写了slide_out_left和slide_in_right				textSwicher.setInAnimation(AnimationUtils.loadAnimation(this,						R.anim.slide_out_left));				textSwicher.setOutAnimation(AnimationUtils.loadAnimation(this,						R.anim.slide_in_right));				// 设置当前要看的文本				textSwicher.setText(arrayTexts[textIndex]);			}			return true;		}		return false;	}}
slide_in_right.xml和slide_out_left.xml可以参照ImageSwitcher的Demo,在此就不重复了。

转载于:https://my.oschina.net/yolinfeng/blog/425722

你可能感兴趣的文章
将 instance 连接到 first_local_net - 每天5分钟玩转 OpenStack(82)
查看>>
Ubuntu屏幕截图快捷键知多少
查看>>
60佳优秀的 Photoshop 网页制作教程【下篇】
查看>>
JQuery Select多选插件实现
查看>>
1-Ictclas50分词系统ForJava
查看>>
Tomcat部署servlet小应用无法找到相应的servlet类的问题可能原因
查看>>
Coding and Paper Letter(七)
查看>>
51CTO篮球俱乐部精彩集锦(5月9日)
查看>>
java实现正则表达式到NFA的转换
查看>>
python-54: 验证码登陆尝试
查看>>
Fedora 11 安装指南-06
查看>>
C#中的异步和多线程
查看>>
归并非递归排序
查看>>
我的友情链接
查看>>
HeadFirst设计模式(五) - 单例模式
查看>>
executeQuery、executeUpdate 和 execute返回值
查看>>
Java利用Tomcat作为服务器与Android的Http通信
查看>>
HDP-2.6.5 & ambari-2.6.2 安装配置
查看>>
一天一点T-SQL:关于分区表(二)
查看>>
如何找到适合自己的学习方法
查看>>