一.ImageSwitcher(图片切换器):
当我们想点击一张图片时,想让它出现的不太突然,想要缓慢显示,这时Gallery视图就需要ImageSwitcher来配合使用。
其中我们还需要用到ViewFactory接口,这是一个视图转换器,我们要重写makeView()方法,来创建一个用于添加到视图转换器(ViewSwitcher)中的新视图。
动画效果:
由左向右滑入的效果:
android.R.anim.slide_in_left
android.R.anim.slide_out_right
淡入淡出:
android.R.anim.fade_in
android.R.anim.fade_out
演示实例:
布局文件:
<?xml version="1.0" encoding="utf-8" ?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="fill_parent" android:orientation="vertical" > <TextView android:id="@+id/textView1" android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="显示图片:" /> <Gallery android:id="@+id/gallery1" android:layout_width="fill_parent" android:layout_height="wrap_content" /> <ImageSwitcher android:id="@+id/imageSwitcher1" android:layout_width="fill_parent" android:layout_height="fill_parent" /> </LinearLayout>
自定义属性(attrs.xml):
<?xml version="1.0" encoding="utf-8"?> <resources> <declare-styleable name="Gallery1"> <attr name="android:galleryItemBackground"/> </declare-styleable> </resources>
主要代码:
public class MainActivity extends Activity implements ViewFactory { Integer[] imgId = {R.drawable.img1, R.drawable.img2,R.drawable.img3, R.drawable.img4,R.drawable.img5, R.drawable.img8,R.drawable.img9,}; private ImageSwitcher is ; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); is = (ImageSwitcher)findViewById(R.id.imageSwitcher1); is.setFactory(this); //设置动画效果。由左向右滑入 is.setInAnimation(AnimationUtils.loadAnimation(this, android.R.anim.slide_in_left)); is.setOutAnimation(AnimationUtils.loadAnimation(this, android.R.anim.slide_out_right)); Gallery gallery = (Gallery)findViewById(R.id.gallery1); gallery.setAdapter(new ImageAdapter(this)); gallery.setOnItemClickListener(new OnItemClickListener() { @Override public void onItemClick(AdapterView<?> arg0, View arg1, int arg2, long arg3) { is.setImageResource(imgId[arg2]); } }); } @Override public boolean onCreateOptionsMenu(Menu menu) { getMenuInflater().inflate(R.menu.main, menu); return true; } //创建一个新的View来添加到ImageView中。 @Override public View makeView() { ImageView imageView = new ImageView(this); //设置背景颜色 imageView.setBackgroundColor(0xffffff00); imageView.setScaleType(ImageView.ScaleType.FIT_CENTER); //填充控件。 imageView.setLayoutParams(new ImageSwitcher.LayoutParams(LayoutParams.FILL_PARENT, LayoutParams.FILL_PARENT)); return imageView; } //Image适配器类,绑定Gallery。 private class ImageAdapter extends BaseAdapter{ private Context context; private int item; public ImageAdapter(Context context) { this.context = context; TypedArray ta = context.obtainStyledAttributes(R.styleable.Gallery1); item = ta.getResourceId(R.styleable.Gallery1_android_galleryItemBackground, 0); ta.recycle(); } @Override public int getCount() { return imgId.length; } @Override public Object getItem(int arg0) { // TODO Auto-generated method stub return arg0; } @Override public long getItemId(int arg0) { // TODO Auto-generated method stub return arg0; } @Override public View getView(int arg0, View arg1, ViewGroup arg2) { // TODO Auto-generated method stub ImageView image = new ImageView(context); image.setImageResource(imgId[arg0]); image.setScaleType(ImageView.ScaleType.FIT_XY); image.setLayoutParams(new Gallery.LayoutParams(160,130)); image.setBackgroundResource(item); return image; } } }
运行图片:
当我们点击第二章图片时:
当点击后面图片时: