Android提供三种常用的图像类组件,分别是ImageView组件,Gallery组件和ImageSwitcher组件,其中,ImageView组件用来显示图像视图,Gallery组件用来显示画廊视图,而ImageSwitcher组件用来表示一个图像切换器。
ImageView组件:
ImageView也就是图像视图,用于在屏幕中显示任何的Drawable对象,通常用来显示图片。在Android中使用图片之前,通常要将要显示的图片放置在res/drawable目录中,然后应用下面的代码将其显示在布局管理器中
<ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:src="@drawable/calculator" />
Gallery组件
画廊视图使用Gallery表示,能够按水平方向显示内容,并且可用手指直接拖动图片移动,一般用来浏览图片,被选中的选项位于中间,并且可以响应显示信息。在使用画廊需要在XML布局文件中添加Gallery标签,也需要使用Adapter提供要显示的数据,通常使用BaseAdapter类为Gallery组件提供数据。
Step1,在XML布局文件中添加以下代码设置Gallery组件的id属性,未选择项的透明度:
<Gallery android:layout_width="match_parent" android:layout_height="wrap_content" android:id="@+id/gall" android:spacing="5dp" android:unselectedAlpha="0.5" >
Step2,在主活动中定义一个用于保存要显示图片ID的数组:
<declare-styleable name="Gallery">
<attr name="android:galleryItemBackground"/>
</declare-styleable>
Step3,在onCreate方法中获取在布局文件中添加的画廊视图:
Gallery gallery=(Gallery)findViewById(R.id.gall);
Step4,在string.xml文件中定义一个新的对象,该对象用于组合多个属性,这里定义了一个系统自带的属性– android:galleryItemBackground;用于设置各属性的背景:
BaseAdapter adapter=new BaseAdapter() {
@Override
public int getCount() {
return imageID.length;
}
@Override
public Object getItem(int position) {
return position;
}
@Override
public long getItemId(int position) {
return position;
}
@Override
public View getView(int position, View convertView, ViewGroup parent) {
ImageView imageView;//声明对象
if(convertView==null){
imageView=new ImageView(MainActivity.this);//创建对象
imageView.setScaleType(ImageView.ScaleType.FIT_XY);//设置缩放方式
imageView.setLayoutParams(new Gallery.LayoutParams(180, 135));
TypedArray typedArray=obtainStyledAttributes(R.styleable.Gallery);
imageView.setBackgroundResource(typedArray.getResourceId(R.styleable.
Gallery_android_galleryItemBackground,0));
imageView.setPadding(5,0,5,0);
}else{
imageView=(ImageView)convertView;
}
imageView.setImageResource(imageID[position]);
return imageView;
}
};
Step5,创建BaseAdapter类的对象,并重写其中的各方法。最重要的是重写getView()方法来设置显示图片的格式:
gallery.setAdapter(adapter);
gallery.setSelection(imageID.length / 2);
gallery.setOnItemClickListener(new AdapterView.OnItemClickListener() {
@Override
public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
Toast.makeText(MainActivity.this
,"你选择了"+String.valueOf(position)+"张图片",Toast.LENGTH_SHORT).show();
}
});
ImageSwitcher组件
图像切换器使用ImageSwitcher表示,用于实现类似于图片查看器的上一张、下一张的功能。在使用ImageSwitcher前需要使用ViewSwitcher.ViewFactory接口,并通过makeView()方法来创建用于显示图片的ImageView。在使用ImageSwitcher组件时还需要使用setImageResource()方法来指定在中显示的图片资源。
Step1,在XML布局文件中添加标签ImageSwitcher,并设置图像切换器布局:
<Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="上一张" android:id="@+id/bt1" android:layout_gravity="center" />
<ImageSwitcher android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center" android:id="@+id/imgSw" >
</ImageSwitcher>
<Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="下一张" android:id="@+id/bt2" android:layout_gravity="center"/>
</LinearLayout>
Step2,在主活动窗口中,初始化一个保存要显示图像ID的数组,然后声明一个当前显示图像索引的变量,最后再声明一个图像切换器的对象:
private int[] imgID=new int[]{R.drawable.android,R.drawable.bluetooth,R.drawable.browser,
R.drawable.bump,R.drawable.calculator,R.drawable.galaxy};
private int index=0;
private ImageSwitcher imageSwitcher;
Step3,在主活动窗口的onCreate()方法中,首先获取布局文件中添加的图像切换器,并为其设置淡入淡出效果。再设置imageSwitcher.setFactory,重写makeView(),在里面设置图像显示的方式、大小等信息。最后设置初始默认显示的图片:
imageSwitcher.setFactory(new ViewSwitcher.ViewFactory() {
@Override
public View makeView() {
ImageView imageView = new ImageView(MainActivity.this);
imageView.setAdjustViewBounds(true);
imageView.setScaleType(ImageView.ScaleType.FIT_CENTER);
imageView.setLayoutParams(new ImageSwitcher.LayoutParams(240, 180));
return imageView;
}
});
imageSwitcher.setImageResource(imgID[index]);
Step4,获取用于控制显示图片动作的按钮,编写监听事件:
Button up=(Button)findViewById(R.id.bt1);
Button down=(Button)findViewById(R.id.bt2);
up.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
if(index>0){
index--;
}else{
index=imgID.length-1;
}
imageSwitcher.setImageResource(imgID[index]);
}
});
down.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
if(index<imgID.length-1){
index++;
}else{
index=0;
}
imageSwitcher.setImageResource(imgID[index]);
}
});