Android控件之Gallery探究

Gallery组件主要用于横向显示图像列表,不过按常规做法。Gallery组件只能有限地显示指定的图像。也就是说,如果为Gallery组件指定了10张图像,那么当Gallery组件显示到第10张时,就不会再继续显示了。这虽然在大多数时候没有什么关系,但在某些情况下,我们希望图像显示到最后一张时再重第1张开始显示,也就是循环显示。要实现这种风格的Gallery组件,就需要对Gallery的Adapter对象进行一番改进。

以下通过Gallery模拟循环显示图像,在单击某一个Gallery组件中的图像时在下方显示一个放大的图像(使用ImageSwitcher组件)。

目录结构

1.png

2011-5-14 08:59:03 上传
下载附件 (14.12 KB)

main.xml布局文件


  1. <?xml version="1.0" encoding="utf-8"?>
  2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  3.     android:orientation="vertical"
  4.     android:layout_width="fill_parent"
  5.     android:layout_height="fill_parent">
  6.     <!-- android:unselectedAlpha: 设置未选中的条目的透明度(Alpha)。该值必须是float类型,比如:“1.2”。 -->
  7.     <Gallery android:layout_width="fill_parent"
  8.         android:layout_height="wrap_content"
  9.         android:spacing="10dip"
  10.         android:unselectedAlpha="1.2"
  11.         android:id="@+id/gallery"
  12.         android:layout_marginTop="30dp"/>
  13.     <ImageSwitcher android:id="@+id/imageSwitcher"
  14.         android:layout_width="fill_parent"
  15.         android:layout_height="wrap_content"
  16.         android:layout_marginTop="30dp" />
  17. </LinearLayout>
复制代码



GalleryActivity类


package com.ljq.ga;

  1. import android.app.Activity;
  2. import android.os.Bundle;
  3. import android.util.Log;
  4. import android.view.View;
  5. import android.view.animation.AnimationUtils;
  6. import android.widget.AdapterView;
  7. import android.widget.Gallery;
  8. import android.widget.ImageSwitcher;
  9. import android.widget.ImageView;
  10. import android.widget.AdapterView.OnItemClickListener;
  11. import android.widget.AdapterView.OnItemSelectedListener;
  12. import android.widget.LinearLayout.LayoutParams;
  13. import android.widget.ViewSwitcher.ViewFactory;

  14. public class GalleryActivity extends Activity implements ViewFactory {
  15.     private Gallery gallery = null;
  16.     private ImageSwitcher imageSwitcher=null;
  17.     int[] imageIDs={
  18.             R.drawable.p1,R.drawable.p2,R.drawable.p3,
  19.             R.drawable.p4,R.drawable.p5,R.drawable.p6,
  20.             R.drawable.p7,R.drawable.p8 };
  21.    
  22.    
  23.     @Override
  24.     public void onCreate(Bundle savedInstanceState) {
  25.         super.onCreate(savedInstanceState);
  26.         setContentView(R.layout.main);
  27.         
  28.         imageSwitcher=(ImageSwitcher)findViewById(R.id.imageSwitcher);
  29.         // 设置ImageSwitcher组件的工厂对象
  30.         imageSwitcher.setFactory(this);
  31.         // 设置ImageSwitcher组件显示图像的动画效果
  32.         imageSwitcher.setInAnimation(AnimationUtils.loadAnimation(this,
  33.                 android.R.anim.fade_in));      
  34.         imageSwitcher.setOutAnimation(AnimationUtils.loadAnimation(this,
  35.                 android.R.anim.fade_out));

  36.         gallery = (Gallery) findViewById(R.id.gallery);
  37.         ImageViewAdapter adapter=new ImageViewAdapter(GalleryActivity.this, imageIDs);
  38.         gallery.setAdapter(adapter);
  39.         gallery.setOnItemSelectedListener(new OnItemSelectedListener(){

  40.             public void onItemSelected(AdapterView<?> parent, View view, int position, long id) {
  41.                 //选中Gallery中某个图像时,在ImageSwitcher组件中放大显示该图像
  42.                 imageSwitcher.setImageResource(imageIDs[position%imageIDs.length]);
  43.             }

  44.             public void onNothingSelected(AdapterView<?> arg0) {
  45.                
  46.             }
  47.             
  48.         });
  49.         
  50.         gallery.setOnItemClickListener(new OnItemClickListener(){
  51.             public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
  52.                 Log.i("ljq", "parent="+parent.getClass().getName()); //Gallery
  53.                 Log.i("ljq", "view="+view.getClass().getName()); //ImageView
  54.                 Log.i("ljq", "position=" + position); //1
  55.                 Log.i("ljq", "id=" + id);//1
  56.                 Gallery gl=(Gallery)parent;
  57.                 ImageView iv=(ImageView)view;
  58.             }
  59.         });
  60.         
  61.         
  62.     }

  63.     // ImageSwitcher组件需要这个方法来创建一个View对象(一般为ImageView对象)
  64.     // 来显示图像
  65.     public View makeView() {
  66.         ImageView imageView = new ImageView(this);
  67.         imageView.setBackgroundColor(0xFF000000);
  68.         imageView.setScaleType(ImageView.ScaleType.FIT_CENTER);
  69.         imageView.setLayoutParams(new ImageSwitcher.LayoutParams(
  70.                 LayoutParams.FILL_PARENT, LayoutParams.FILL_PARENT));
  71.         return imageView;
  72.     }
  73. }
复制代码



ImageViewAdapter自定义适配器


  1. package com.ljq.ga;

  2. import android.content.Context;
  3. import android.view.View;
  4. import android.view.ViewGroup;
  5. import android.widget.BaseAdapter;
  6. import android.widget.ImageView;
  7. import android.widget.LinearLayout;

  8. public class ImageViewAdapter extends BaseAdapter{
  9.     private int[] imageIDs=null;
  10.     private Context context=null;
  11.    
  12.     public ImageViewAdapter(Context context, int[] imageIDs) {
  13.         this.context=context;
  14.         this.imageIDs=imageIDs;
  15.     }
  16.    
  17.     //用于返回图像总数,要注意的是,这个总数不能大于图像的实际数(可以小于图像的实际数),否则会抛出越界异常。
  18.     public int getCount() {
  19.         //优化一
  20.         //return imageIDs.length;
  21.         return Integer.MAX_VALUE;
  22.     }

  23.     public Object getItem(int position) {
  24.         return imageIDs[position];
  25.     }

  26.     public long getItemId(int position) {
  27.         return position;
  28.     }

  29.     //ScaleType的用法
  30.     //CENTER/center  按图片的原来size居中显示,当图片长/宽超过View的长/宽,则截取图片的居中部分显示
  31.     //CENTER_CROP/centerCrop  按比例扩大图片的size居中显示,使得图片长 (宽)等于或大于View的长(宽)
  32.     //CENTER_INSIDE/centerInside  将图片的内容完整居中显示,通过按比例缩小 或原来的size使得图片长/宽等于或小于View的长/宽
  33.     //FIT_CENTER/fitCenter  把图片按比例扩大/缩小到View的宽度,居中显示
  34.     //FIT_END/fitEnd   把 图片按比例扩大/缩小到View的宽度,显示在View的下部分位置
  35.     //FIT_START/fitStart  把 图片按比例扩大/缩小到View的宽度,显示在View的上部分位置
  36.     //FIT_XY/fitXY  把图片 不按比例 扩大/缩小到View的大小显示
  37.     //MATRIX/matrix 用矩阵来绘制
  38.     public View getView(int position, View convertView, ViewGroup parent) {
  39.         ImageView iv = new ImageView(context);
  40.         //优化二,通过取余来循环取得imageIDs数组中的图像资源ID,取余可以大大较少资源的浪费
  41.         iv.setImageResource(imageIDs[position%imageIDs.length]);
  42.         iv.setScaleType(ImageView.ScaleType.CENTER_INSIDE);
  43.         iv.setLayoutParams(new LinearLayout.LayoutParams(77,77));//把图片缩小原来的60%
  44.         return iv;

  45.     }

  46. }
复制代码



运行结果

2.png

2011-5-14 08:59:01 上传
下载附件 (48.67 KB)

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值