7.8. ImageSwitcher(图片切换组件)
ImageSwitcher组件的主要功能是完成图片的切换显示，例如用户在进行图片浏览的时候，可以通过按钮点击一张张的切换显示的图片，而且使用ImageSwitcher组件在每次切换的时候也可以为其增加一些动画的效果，类的继承结构如下：
|
|||||||||||||||||||||||||||||||||||||||||||||||||
如果要想真正的实现图片的切换操作，那么问题的关键就在于ViewFactory工厂的使用上，它是ViewSwitcher的一个内部接口。
| public static interface ViewSwitcher.ViewFactory |
在这个接口中有一个操作方法：
| public abstract View makeView () |
这个方法的作用是创建一个View显示的组件。
配置：
| <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/MyLayout" android:orientation="vertical" android:layout_width="fill_parent" android:layout_height="fill_parent"> <ImageSwitcher android:id="@+id/myImageSwitcher" android:layout_width="wrap_content" android:layout_height="wrap_content"/> <LinearLayout android:orientation="horizontal" android:layout_width="fill_parent" android:layout_height="fill_parent"> <Button android:id="@+id/butPrevious" android:text="上一张图片" android:enabled="false" android:layout_width="wrap_content" android:layout_height="wrap_content"/> <Button android:id="@+id/butNext" android:text="下一张图片" android:enabled="true" android:layout_width="wrap_content" android:layout_height="wrap_content"/> </LinearLayout> </LinearLayout> |
Activity:
| package com.makyan.demo; import android.app.Activity; import android.os.Bundle; import android.view.View; import android.view.View.OnClickListener; import android.view.ViewGroup.LayoutParams; import android.view.animation.AnimationUtils; import android.widget.Button; import android.widget.ImageSwitcher; import android.widget.ImageView; import android.widget.ViewSwitcher.ViewFactory; public class ImageSwitcherActivity extends Activity { private ImageSwitcher myImageSwitcher = null; // 图片切换 private Button butPrevious = null; // 按钮组件 private Button butNext = null; // 按钮组件 private int[] imgRes = new int[] { R.drawable.ispic_a, R.drawable.ispic_b, R.drawable.ispic_c, R.drawable.ispic_d, R.drawable.ispic_e }; // 资源图片ID private int foot = 0; // 资源读取位置 @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); super.setContentView(R.layout.activity_image_switcher); // 调用布局管理器 this.myImageSwitcher = (ImageSwitcher) super .findViewById(R.id.myImageSwitcher); // 取得组件 this.butPrevious = (Button) super.findViewById(R.id.butPrevious); // 取得组件 this.butNext = (Button) super.findViewById(R.id.butNext) ; // 取得组件 this.myImageSwitcher.setFactory(new ViewFactoryImpl()); // 设置转换工厂 this.myImageSwitcher.setInAnimation(AnimationUtils.loadAnimation(this, android.R.anim.fade_in)); // 设置动画 this.myImageSwitcher.setOutAnimation(AnimationUtils.loadAnimation(this, android.R.anim.fade_out)); // 设置动画 this.myImageSwitcher.setImageResource(imgRes[foot++]) ; // 设置图片 this.butNext.setOnClickListener(new OnClickListenerNext()) ;// 设置单击事件 this.butPrevious.setOnClickListener(new OnClickListenerPrevious()) ;// 设置单击事件 } private class OnClickListenerPrevious implements OnClickListener { @Override public void onClick(View v) { ImageSwitcherActivity.this.myImageSwitcher .setImageResource(imgRes[foot--]); // 修改显示图片 ImageSwitcherActivity.this.checkButEnable(); // 设置按钮状态 } }
private class OnClickListenerNext implements OnClickListener { @Override public void onClick(View v) { ImageSwitcherActivity.this.myImageSwitcher .setImageResource(imgRes[foot++]); // 修改显示图片 ImageSwitcherActivity.this.checkButEnable(); // 设置按钮状态 } } public void checkButEnable() { // 设置按钮状态 if (this.foot < this.imgRes.length - 1) { this.butNext.setEnabled(true); // 按钮可用 } else { this.butNext.setEnabled(false); // 按钮不可用 } if (this.foot == 0) { this.butPrevious.setEnabled(false); // 按钮不可用 } else { this.butPrevious.setEnabled(true); // 按钮可用 } } private class ViewFactoryImpl implements ViewFactory { @Override public View makeView() { ImageView img = new ImageView(ImageSwitcherActivity.this); // 实例化图片显示 img.setBackgroundColor(0xFFFFFFFF); // 设置背景颜色 img.setScaleType(ImageView.ScaleType.CENTER); // 居中显示 img.setLayoutParams(new ImageSwitcher.LayoutParams( // 自适应图片大小 LayoutParams. return img; } } } |
切换图片主要方法在ImageSwitcher中的以下方法中：
| public void setImageResource (int resid) public void setFactory (ViewSwitcher.ViewFactory factory) ，一定要通过此方法来设置组件，产生组件。 |
演示效果：
小结：
- 使用ImageSwitcher和ViewFactory可以实现图片的切换显示。
- 用户可以使用Animation进行切换时的动画显示。
7.9. TextSwitcher组件
跟ImageSwitcher相似，也需要一个ViewFactory
配置：
| <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/MyLayout" android:orientation="vertical" android:layout_width="fill_parent" android:layout_height="fill_parent"> <TextSwitcher android:id="@+id/myTextSwitcher" android:layout_width="wrap_content" android:layout_height="wrap_content"/> <Button android:id="@+id/but" android:text="显示当前时间" android:layout_width="wrap_content" android:layout_height="wrap_content"/> </LinearLayout> |
Activity:
| package com.makyan.demo; import java.text.SimpleDateFormat; import java.util.Date; import android.app.Activity; import android.os.Bundle; import android.view.View; import android.view.View.OnClickListener; import android.view.ViewGroup.LayoutParams; import android.view.animation.AnimationUtils; import android.widget.Button; import android.widget.TextSwitcher; import android.widget.TextView; import android.widget.ViewSwitcher.ViewFactory; public class TextSwitcherActivity extends Activity { private TextSwitcher txtsw = null; // 文字切换 private Button but = null; // 按钮组件 @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); super.setContentView(R.layout.activity_text_switcher); // 调用布局管理器 txtsw = (TextSwitcher) super.findViewById(R.id.myTextSwitcher) ; but = (Button) super.findViewById(R.id.but) ; // 取得组件 txtsw.setFactory(new ViewFactoryImpl()); // 设置转换工厂 txtsw.setInAnimation(AnimationUtils.loadAnimation(this, android.R.anim.fade_in)); // 设置动画 txtsw.setOutAnimation(AnimationUtils.loadAnimation(this, android.R.anim.fade_out)); // 设置动画 but.setOnClickListener(new OnClickListenerImpl()) ; // 定义监听 }
private class OnClickListenerImpl implements OnClickListener { @Override public void onClick(View v) { txtsw.setText("当前时间为："+ new SimpleDateFormat("yyyy-MM-dd HH:mm:ss.SSS").format(new Date())); // 显示当前时间 } } private class ViewFactoryImpl implements ViewFactory { @Override public View makeView() { TextView txt = new TextView(TextSwitcherActivity.this); // 实例化图片显示 txt.setBackgroundColor(0xFFFFFFFF); // 设置背景颜色 txt.setTextColor(0xFF000000) ; txt.setLayoutParams(new TextSwitcher.LayoutParams( // 自适应图片大小 LayoutParams. txt.setTextSize(30) ; // 文字大小 return txt; } } } |
