首页

ImageSwitcher

搜索

概述
若要编写一个相册浏览的应用,通过Gallery显示、拖动相册,当单击其中某个图
片时,在下方会有该图片的动画显示。放大显示的图片以不断旋转、逐渐放大、由虚变实的动画完成。
对于这类应用可通过ImageSwitcher类来实现。

1, ImageSwitcher是一个容器,间接继承自FrameLayout,以下是与ImageSwitcher相关的继承树:
FrameLayout
ViewSwitcher
TextViewSwitcher
ImageSwitcher
2、容器中有且仅有两个子View(IamgeView)
3, ImageSwitcher需要设置Factory
由该Factory对象的makeView,为switcher提供两个子View

相关接口-ViewFactory
1、作用:ImageSwitcher类必须设置一个ViewFactory,主要用来将显示的图片和父窗口区分开
因此需要实现ViewSwitcher.ViewFactory接口。
2、接口中声明的方法:
makeView();
作用:该方法用来创建并返回一个ImageView对象。
示例代码:
public View makeView(){
//用Java代码创建一个ImageView对象
ImageView iv=new ImageView(MainAct.this);
//设置该控件两宽和高
iv.setLayoutParams(new ImageSwitcher.LayoutParams(
LayoutParams.WRAP_CONTENT,LayoutParams.WRAP_CONTENT);
//设置该控件中图片的缩放方式:图片填充整个控件
iv.setScaleType(ImageView.ScaleType.FIT_XY};
//设置显示的图片
iv.setImageResource(CommonUtiIs. PHOTOS[mIndex]);
return iv;
说明
1, LayoutParams类在ViewGroup类中定义,因止浓ImageSwitcher这些ViewGroup的子类
中都可使用LayoutParams类。该类用于设置控件的宽和高。
用Java代码设置控件的彰口高,要用new ImageSwitcher.LayoutParamsQ;创建一个
LayoutParams对象,并设置两个参数,第一个参数代表宽,第二个参数代表高。
它们有以下可选的常量值:
LayoutParams.WRAP_CONTENT,
LayoutParams.FILL_PARENT,
LayoutParams.MATHCH_PARENT,
ImageSwitcher类的常用方法
1, showNext();
作用:切换至下一个ImageView
提示:ImageSwitcher只能对两个ImageView进行切换。
2, setFactory(ViewFactory vf)
作用:设置一个实现了ViewFactory接口的类的对象。通过将该对象的地址保存在ImageSwitcher
的成员变量mFactory中,在需要的时候将回调该对象中编写的makeView方法。

3, setImageDrawable(Drawable);
作用:绘制图片。
4, setImageResource(int res);
作用:设置图片资源库。
5, setInAnimation(Animation);
setInAnimation(Context context,int animRes);
作用:设置View进入屏幕时候使用的动画。
该函数有两个版本,一个接收单个参数,类型为android.view.animation.Animation,一个接收
两个参数,类型为Context和int,分别为Context对象和定义Animation的resourceID
6, setOutAnimation(Animation);
setOutAnimation(Context context,int animRes);
作用:设置View退出屏幕时候使用的动画,参数与setInAnimation()一样。
ImageSwitcher的使用步骤
以实现图一1为例说明该类的使用步骤:
步骤1、在res/anim文件夹下创建rotate_fade_in.xml文件,该文件用于实现将圈片逐渐放大、旋转、
由虚变实的动画,代码如下:
<?xml version= "1.0" encoding= "utf-8"?>
<set
xmlns:android="http://schemas.android.com/apk/res/android ">
<rotate
android:fromDegrees= "0"
androidaoDegrees= "360"
android:pivotX= "50}”
android:pivotY="50}”
android:duration= "1000"/>
<scale
android:fromXScale= "0.0"
androidaoXScale= "1.0"
android:fromYScale= "0.0"
androidaoYScale= "1.0"
android:pivotX= "50}”
android:pivotY="50}”
android:duration= "1000"/>
<alpha
android:fromAlpha="0.0"
androidaoAlpha="1.0"
android:duration= "1000"/>
</set>
步骤2、在res/layout文件夹下创建gallery_itemxml,该文件设置Gallery控件的每个列表项的布
局。
<?xml version= "1.0" encoding= "utf-8"?>
<LinearLayout
xmlns:android="http://schemas. android. co m/apk/res/android "
android:orientation="vertical "
androidaayout width= "wrap_content"
androidaayout height= "wrap_content">
<ImageView
android:id="@+id/ivPhoto”
android:layout_width= "80dp”
android:layout_height= "80dp”
android:src= "@drawable/dogl"/>
</LinearLayout>
提示:该布局中只有一个ImageView控件。
步骤3、在main.xml中定义图一1的布局,该布局中包括Gallery和ImageSwitcher控件,代码如
下:
<?xml version= "1.0" encoding= "utf-8"?>
<LinearLayout xmlns:android="http://schemas. and roid. com/a p k/res/android "
android:orientation="vertical "
androidaayout width= "fill_parent"
androidaayout height= "fill_parent">
<!一定义Gallery控件,显示并拖动相册->
<Gallery
android:id= "@+id/Gallery"
android:layout_width= "fill_parent"
android:layout_height= "wrap_content"
android:spacing= "ldp"/>
<!一定义ImaeSwitcher控件,设置切换图片的动画为res/anim/rotate fade_ in.xml一>
<ImageSwitcher
android:inAnimation= "@anim/rotate_fade_in"
android:layout_width= "wrap_content"
android:layout height= "wrap_content"
android:id= "@+id/isDog”>
</ImageSwitcher>
</LinearLayout>
步骤4、在Ma i nActjava中,按以下注释的步骤编写实现拖动和动画显示的代码:
public class MainAct extends Activity{
ImageSwitcher mImageSwitcher;//动画切换的控件
int mIndex;//当前被选择的图片的索引值
@Override
publicvoid onCreate(Bundle savedInstanceState){
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
//步骤1一实例化Gallery控件
Gallery gallery=(Gallery) findViewById(R.id.galle);
//步骤一2创建并关联适配器
gallery.setAdapter(new BaseAdapter(){
@Override
public View getView(int position, View convertView, ViewGroup parent){
//步骤2.1一获取res/layout/gallery_item.xml布局
View layout=LayoutInflater.from(MainAct.this).inflate(
R.layout.gallery_item, null);
//步骤2.2一创建ImageView对象
ImageView iv=(ImageView) layout.findViewById(R.id.ivPhoto);
//步骤2.3一设置Gallery中显示的图片
iv.setImageResource(getltem(position));
return layout;
//返回当前列表项的索引值,
@Override
public long getItemId(nt position){
//以下算法保证循环显示图片的正确性
return position%CommonUtiIs.PHOTOS.length;
}
//返回当前列表项的图片索引值
@Override
public Integer getItem(int position){
return CommonUtiIs.PHOT05[(int) getItemId(position)];
}
//返回列表项总数,这里设置为int类型的最大值,目的是能循环显示列表项
@Override
public int getCountQ{
return Integer.MAX VALUE;
}
});
//步骤3一设置Gallery的列表项被单击时的响应代码
gallery.setOnItemCIickListener(new OnItemCIickListenerQ{
@Override
public void onItemClick(AdapterView<?> parent, View view,
int position, long id){
//获取当前列表项的索引值
position%=CommonUtiIs.PHOTOS.length;
mIndex=position;//保存在类的成员变量中
//在ImageSwitcher中显示被选择的列表项的图片
mImageSwitcher.setImageResource(CommonUtiIs.PHOT05[mIndex]);
});
//步骤4一创建ImageSiwtcher控件
mImageSwitcher=(ImageSwitcher) findViewById(R.id.isDog);
//步骤5一创建ViewFacto的实现类对象,该对象在ImageSwitche显示图片时被回调
mImageSwitcher.setFactory(new ViewFactory(){
/*makeView方法负责创建ImageSwitcher中显示的 ImageView对象,并设置
*该控件显示的图片。
*/

@Override
publicView makeView(){
ImageView iv=new ImageView(MainAct.this);
iv.setLayoutParams(new ImageSwitcher.LayoutParams(
LayoutParams.WRAP_CONTEN1,LayoutParams.WRAP_CONTENT);
iv.setScaleType(ImageView.ScaleType.FITXY};
iv.setImageResource(CommonUtiIs. PHOTOS[mIndex]);
return iv;
})

 

 

上一页 下一页