您的位置:首页 > 其它

简单图片浏览工具—ImageSwitcher和Gallery组件结合使用

2012-09-23 18:34 447 查看


ImageSwitcher和Gallery

ImageSwitcher:图片切换

Gallery:画廊,开发中也可用于做滑动的菜单

1.定义布局文件activity_main.xml

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<ImageSwitcher
android:id="@+id/imageSwitcher1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true" >
</ImageSwitcher>

<Gallery
android:id="@+id/gallery1"
android:layout_width="fill_parent"
android:layout_height="60dp"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:background="#55000000"
android:spacing="10dp" />
</RelativeLayout>



2.定义控制器Activity

public class MainActivity extends Activity implements ViewFactory,
OnItemClickListener {
private ImageSwitcher imageSwitcher;
private Gallery gallery;
// 存放大图的数组
private int[] imagesLarge = { R.drawable.sample_0, R.drawable.sample_1,
R.drawable.sample_2, R.drawable.sample_3, R.drawable.sample_4,
R.drawable.sample_5, R.drawable.sample_6, R.drawable.sample_7 };
// 存放小图的数组
private int[] imagesSmall = { R.drawable.sample_thumb_0,
R.drawable.sample_thumb_1, R.drawable.sample_thumb_2,
R.drawable.sample_thumb_3, R.drawable.sample_thumb_4,
R.drawable.sample_thumb_5, R.drawable.sample_thumb_6,
R.drawable.sample_thumb_7 };

@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
// 设置窗体无标题
requestWindowFeature(Window.FEATURE_NO_TITLE);
setContentView(R.layout.activity_main);
// 得到组件
imageSwitcher = (ImageSwitcher) this.findViewById(R.id.imageSwitcher1);
imageSwitcher.setFactory(this);
imageSwitcher.setInAnimation(AnimationUtils.loadAnimation(this,
android.R.anim.fade_in));
imageSwitcher.setInAnimation(AnimationUtils.loadAnimation(this,
android.R.anim.fade_out));

gallery = (Gallery) this.findViewById(R.id.gallery1);
gallery.setAdapter(new ImageAdapter());
//设置默认选择的图片
gallery.setSelection(imagesSmall.length/2);
//注册事件监听器
gallery.setOnItemClickListener(this);
}

@Override
public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.activity_main, menu);
return true;
}

@Override
public void onItemClick(AdapterView<?> adapterview, View view, int postion,
long id) {
imageSwitcher.setImageResource(imagesLarge[postion]);

}

// 重写视图工厂中的makeView方法,对ImageSwitcher显示的ImageView对象进行了设置
@Override
public View makeView() {
ImageView imageView = new ImageView(MainActivity.this);
imageView.setLayoutParams(new ImageSwitcher.LayoutParams(
LayoutParams.FILL_PARENT, LayoutParams.FILL_PARENT));
return imageView;
}

/**
* 负责产生gallery中的图片
*/
private class ImageAdapter extends BaseAdapter {

// 返回图片的个数,比如你想得到图片的个数
@Override
public int getCount() {
return imagesSmall.length;
}

@Override
public Object getItem(int position) {
return imagesSmall[position];
}

@Override
public long getItemId(int position) {
return position;
}

@Override
public View getView(int position, View convertView, ViewGroup parent) {

ImageView imageView = new ImageView(MainActivity.this);
// 设置imageView中的图像资源
imageView.setImageResource(imagesSmall[position]);
// 设置图像大小尺寸自适应
imageView.setAdjustViewBounds(true);
return imageView;
}
}
}



3.给画廊中的图片加边框

步骤1:在values下定义item.xml文件

<?xml version="1.0" encoding="utf-8"?>
<resources>
<declare-styleable name="HelloGallery">
<attr name="android:galleryItemBackground" />
</declare-styleable>
</resources>



步骤2:修改ImageAdapter类

/**
* 负责产生gallery中的图片
*/
private class ImageAdapter extends BaseAdapter {
int mGalleryItemBackground;;
public ImageAdapter(){
TypedArray typedArray=obtainStyledAttributes(R.styleable.HelloGallery);
mGalleryItemBackground=typedArray.getResourceId(R.styleable.HelloGallery_android_galleryItemBackground, 0);
typedArray.recycle();
}

// 返回图片的个数,比如你想得到图片的个数
@Override
public int getCount() {
return imagesSmall.length;
}

@Override
public Object getItem(int position) {
return imagesSmall[position];
}

@Override
public long getItemId(int position) {
return position;
}

@Override
public View getView(int position, View convertView, ViewGroup parent) {

ImageView imageView = new ImageView(MainActivity.this);
// 设置imageView中的图像资源
imageView.setImageResource(imagesSmall[position]);
/*// 设置图像大小尺寸自适应
imageView.setAdjustViewBounds(true);*/
imageView.setBackgroundResource(mGalleryItemBackground);
return imageView;
}
}


效果图:


内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: