Android ImageSwitcher和Gallery的使用
前几天,听说室友的老师要求他们做一个图片效果。其效果如下图所示(可左右滑动切换图片):
我当时晃眼一看,第一感觉好高级的样子。我还没做过这种效果呢,但室友说他们同学已经有人做出来了,我觉得既然有人做出来了,那么我也应该做出来,于是上个星期五的时候在教室研究了一下午,最后在网上找到了两个Demo都与这个效果类似但又不完全一样,果断下载下来研究研究,结果才发现其实这个效果并没有你想的那么难。
废话不多说,上代码:
main.xml:(其实就是两个控件的使用ImageSwitcher和Gallery)
<?xml version="1.0" encoding="utf-8"?> <!-- 相对布局 --> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="fill_parent" > <!-- 单个图片显示 --> <ImageSwitcher android:id="@+id/switcher" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerHorizontal="true" android:layout_centerVertical="true" /> <!-- 显示图片列表控件 --> <Gallery android:id="@+id/gallery" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_alignParentBottom="true" android:layout_marginBottom="30dip" > </Gallery> </RelativeLayout>
创建一个新的JAVA文件galleryImage.java(并在清单文件中设置为默认):
public class galleryImage extends Activity { private Gallery gallery; ImageSwitcher imageSwitcher; // 声明ImageSwitcher对象,图片显示区域 public List<Map<String, Object>> list; private int[] myImageIds = { R.drawable.i1, R.drawable.i2, R.drawable.i3, R.drawable.i4 }; /** Called when the activity is first created. */ @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); requestWindowFeature(Window.FEATURE_NO_TITLE); setContentView(R.layout.main); Init(); } /** * 初始化 */ public void Init(){ // 通过控件的ID获得imageSwitcher的对象 imageSwitcher = (ImageSwitcher) findViewById(R.id.switcher); // 设置自定义的图片显示工厂类 imageSwitcher.setFactory(new MyViewFactory(this)); Animation(); /*adapter = new SwitchereAdapter(this); adapter.createReflectedImages(); // 创建倒影效果 gallery.setAdapter(adapter);*/ gallery = (Gallery) findViewById(R.id.gallery); gallery.setAdapter(new ImageAdapter(this)); gallery.setOnItemSelectedListener(new OnItemSelectedListener() { @Override public void onItemSelected(AdapterView<?> parent, View view, int position, long id) { // 通过求余数,循环显示图片 imageSwitcher.setImageResource(myImageIds[position % myImageIds.length]); } @Override public void onNothingSelected(AdapterView<?> parent) { // TODO Auto-generated method stub } }); } public void ChangeScale(){ } /** * 动画效果 */ public void Animation() { // 设置ImageSwitcher组件显示图像的动画效果 imageSwitcher.setInAnimation(AnimationUtils.loadAnimation(this, android.R.anim.fade_in)); imageSwitcher.setOutAnimation(AnimationUtils.loadAnimation(this, android.R.anim.fade_out)); } /** * Gallery的图片适配器 * @author AF74776 * */ public class ImageAdapter extends BaseAdapter { // 声明一个变量 int mGalleryItemBackGround; private Context mContext; public ImageAdapter(Context c) { mContext = c; // 实用布局文件中的Gallery属性 TypedArray a = obtainStyledAttributes(R.styleable.Gallery); // 取得gallery属性饿index id mGalleryItemBackGround = a.getResourceId( R.styleable.Gallery_android_galleryItemBackground, 0); // 让对象的styleable属性能反复实用 a.recycle(); } public int getCount() {// 返回数组长度 // TODO Auto-generated method stub return Integer.MAX_VALUE; } public Object getItem(int position) { return position; } public long getItemId(int position) {// 得到图片ID return position; } public View getView(int position, View converView, ViewGroup parent) { ImageView i = new ImageView(mContext); // i.setImageResource(myImageIds[position %myImageIds.length ]); i.setImageResource(myImageIds[position % myImageIds.length]); i.setAdjustViewBounds(true); // 图片自动调整显示 i.setScaleType(ImageView.ScaleType.FIT_XY);// 重新设置图片的宽高 i.setLayoutParams(new Gallery.LayoutParams(200, 200));// 设置layout的宽高 i.setBackgroundResource(mGalleryItemBackGround);// 设置背景 return i;// 返回对象 } } // 自定义图片显示工厂类,继承ViewFactory class MyViewFactory implements ViewFactory { private Context context; // 定义上下文 // 参数为上下文的构造方法 public MyViewFactory(Context context) { this.context = context; } // 显示图标区域 public View makeView() { ImageView iv = new ImageView(context); // 创建ImageView对象 iv.setScaleType(ImageView.ScaleType.FIT_CENTER); // 图片自动居中显示 // 设置图片的宽和高 iv.setLayoutParams(new ImageSwitcher.LayoutParams( 400, 400)); return iv; // 返回ImageView对象 } } }
代码中有详细的注释,我觉得我都能看懂(自认为自己比较笨),相信大家也一定能看懂。
作者:af74776
文章出处:http://www.cnblogs.com/scetopcsa/
欢迎关注微信公众号:yilu_yiyou(一路一游),一个不仅仅是代码的世界!
如果文中有什么错误,欢迎指出。以免更多的人被误导。
本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。
文章出处:http://www.cnblogs.com/scetopcsa/
欢迎关注微信公众号:yilu_yiyou(一路一游),一个不仅仅是代码的世界!
如果文中有什么错误,欢迎指出。以免更多的人被误导。
本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。