图像切换器(ImageSwitcer)的功能与用法
ImageSwitcher继承了VewSwitcher,因此它具有与ViewSwitcher相同的特征,可以在切换View组件时使用动画效果。ImageSwitcher继承了ViewSwitcher并重写了ViewSwitcher的showNext()、showPrevous()方法,因此ImageSwitcher使用起来更加方便。使用ImageSwitcher只要如下两步即可。
(1):为ImageSwitcher提供给一个VewFactory,该ViewFactory生成的View组件必须是ImageView。
(2):需要切换图片时,只要调用ImageSwitcher的setImageDrawable(Drawable drawable)、setImgeResource(int resid)和setImageURI(Uri uri)方法更换图片即可。
下面通过一个实例来介绍ImageSwitcher的用法。
实例:支持动画的图片浏览器
下面的实例是对前面的GridViewTest实例的修改,该实例使用ImageSwitcher代替了原有的ImageView。该实例的布局文件如下。
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="fill_parent" android:layout_height="fill_parent" android:gravity="center_horizontal" > <!-- 定义一个GridView组件 --> <GridView android:id="@+id/grid01" android:layout_width="fill_parent" android:layout_height="wrap_content" android:horizontalSpacing="1pt" android:verticalSpacing="2pt" android:numColumns="4" android:gravity="center"/> <!-- 定义一个ImageSwitcher组件 --> <ImageSwitcher android:id="@+id/switcher" android:layout_width="300dp" android:layout_height="300dp" android:layout_gravity="center_horizontal" android:inAnimation="@android:anim/fade_in" android:outAnimation="@android:anim/fade_out" /> </LinearLayout>
上面布局文件的粗体字代码定义了一个ImageSwitcher,并通过android:inAnimation和android:outAnimation指定了图片切换时的动画效果。
接下来Activity代码需要为该ImageSwitcher设置ViewFactory,并让该ViewFactory的makeView()方法返回ImageView。下面是该Activity的代码。
package org.crazyit.helloworld; import java.util.ArrayList; import java.util.HashMap; import java.util.List; import java.util.Map; import android.os.Bundle; import android.app.Activity; import android.view.Menu; import android.view.View; import android.view.ViewGroup.LayoutParams; import android.widget.AdapterView; import android.widget.AdapterView.OnItemClickListener; import android.widget.AdapterView.OnItemSelectedListener; import android.widget.GridView; import android.widget.ImageSwitcher; import android.widget.ImageView; import android.widget.SimpleAdapter; import android.widget.ViewSwitcher.ViewFactory; public class ImageSwitcherTest extends Activity { int[] imageIds=new int[]{ R.drawable.bomb5, R.drawable.bomb6, R.drawable.bomb7, R.drawable.bomb8, R.drawable.bomb9, R.drawable.bomb10, R.drawable.bomb11, R.drawable.bomb12, R.drawable.bomb13, R.drawable.bomb14, R.drawable.bomb15, R.drawable.bomb16 }; ImageSwitcher switcher; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.image_switcher_test); //创建一个List对象,List对象的元素是Map List<Map<String,Object>> listItems=new ArrayList<Map<String,Object>>(); for(int i=0;i<imageIds.length;i++) { Map<String,Object> listItem=new HashMap<String,Object>(); listItem.put("image",imageIds[i]); listItems.add(listItem); } //获取显示图片的ImageSwitcher switcher=(ImageSwitcher)findViewById(R.id.switcher); //为ImageSwitcher设置图片切换的动画效果 switcher.setFactory(new ViewFactory(){ @Override public View makeView() { // TODO Auto-generated method stub //创建ImageView对象 ImageView imageView=new ImageView(ImageSwitcherTest.this); imageView.setScaleType(ImageView.ScaleType.FIT_CENTER); imageView.setLayoutParams(new ImageSwitcher.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT)); return imageView; } }); //创建一个SimpleAdapter SimpleAdapter simpleAdapter=new SimpleAdapter(this,listItems,R.layout.cell, new String[]{"image"},new int[]{R.id.image1}); GridView grid=(GridView)findViewById(R.id.grid01); //为GridView设置Adapter grid.setAdapter(simpleAdapter); //添加列表项被选中的监听器 grid.setOnItemSelectedListener(new OnItemSelectedListener(){ @Override public void onItemSelected(AdapterView<?> parent, View view, int position, long id) { // TODO Auto-generated method stub //显示当前被选中的图片 switcher.setImageResource(imageIds[position]); } @Override public void onNothingSelected(AdapterView<?> arg0) { // TODO Auto-generated method stub } }); //添加列表项被单击的监听器 grid.setOnItemClickListener(new OnItemClickListener(){ @Override public void onItemClick(AdapterView<?> parent, View view, int position, long id) { // TODO Auto-generated method stub switcher.setImageResource(imageIds[position]); } }); } @Override public boolean onCreateOptionsMenu(Menu menu) { // Inflate the menu; this adds items to the action bar if it is present. getMenuInflater().inflate(R.menu.image_switcher_test, menu); return true; } }
上面的代码中第一段粗体字代码重写了ViewFactory的makeView()方法,该方法返回一个ImageView对象,这样该ImageView即可正常工作。该Activity还为GridView绑定了事件监听器,当用户单击GridView或选中GridView的指定单元格时,ImageSwitcher切换为显示对应的图片。
运行上面的代码将会看到如下效果: