博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
Android的GridView和Gallery结合Demo
阅读量:7172 次
发布时间:2019-06-29

本文共 11342 字,大约阅读时间需要 37 分钟。

Demo介绍:首页是一个GridView加载图片,竖屏时显示3列图片,横屏时显示4列图片;并且对图片进行大小限制和加灰色边框处理。

点击某一张图片,会链接到Gallery页面,由于Android自带的Gallery控件滑动效果很不好(滑动一次会加载好多张图片),这里对Gallery进行了扩展,滑动一次只加载一张图片。

Demo效果如下:

 

1、首页Activity页面,GridViewActivity.java介绍:

1 public class GridViewActivity extends Activity {  2     private DisplayMetrics dm;  3     private GridImageAdapter ia;  4     private GridView g;  5     private int imageCol = 3;  6    7     @Override  8     protected void onCreate(Bundle savedInstanceState) {  9         // TODO Auto-generated method stub 10         super.onCreate(savedInstanceState); 11         // requestWindowFeature(Window.FEATURE_NO_TITLE); 12         ia = new GridImageAdapter(this); 13         setContentView(R.layout.mygridview); 14         g = (GridView) findViewById(R.id.myGrid); 15         g.setAdapter(ia); 16         g.setOnItemClickListener(new OnItemClick(this)); 17         // 得到屏幕的大小 18         dm = new DisplayMetrics(); 19         getWindowManager().getDefaultDisplay().getMetrics(dm); 20   21     } 22   23     /** 24      * 屏幕切换时进行处理 如果屏幕是竖屏,则显示3列,如果是横屏,则显示4列 25      */ 26     @Override 27     public void onConfigurationChanged(Configuration newConfig) { 28         try { 29   30             super.onConfigurationChanged(newConfig); 31             // 如果屏幕是竖屏,则显示3列,如果是横屏,则显示4列 32             if (this.getResources().getConfiguration().orientation == Configuration.ORIENTATION_LANDSCAPE) { 33                 imageCol = 4; 34             } else if (this.getResources().getConfiguration().orientation == Configuration.ORIENTATION_PORTRAIT) { 35                 imageCol = 3; 36             } 37             g.setNumColumns(imageCol); 38             g.setAdapter(new ImageAdapter(this)); 39             // ia.notifyDataSetChanged(); 40         } catch (Exception ex) { 41             ex.printStackTrace(); 42         } 43     } 44   45     /** 46      * 47      * @author 空山不空 点击具体的小图片时,会链接到GridViewActivity页面,进行加载和展示 48      */ 49     public class OnItemClick implements OnItemClickListener { 50         public OnItemClick(Context c) { 51             mContext = c; 52         } 53   54         @Override 55         public void onItemClick(AdapterView aview, View view, int position, 56                 long arg3) { 57             Intent intent = new Intent(); 58             intent.setClass(GridViewActivity.this, GalleryActivity.class); 59             intent.putExtra("position", position); 60             GridViewActivity.this.startActivity(intent); 61         } 62   63         private Context mContext; 64     } 65   66     /** 67      * 68      * @author 空山不空 设置GridView的图片适配器 69      */ 70     public class GridImageAdapter extends BaseAdapter { 71   72         Drawable btnDrawable; 73   74         public GridImageAdapter(Context c) { 75             mContext = c; 76             Resources resources = c.getResources(); 77             btnDrawable = resources.getDrawable(R.drawable.bg); 78         } 79   80         public int getCount() { 81             return ImageSource.mThumbIds.length; 82         } 83   84         public Object getItem(int position) { 85             return position; 86         } 87   88         public long getItemId(int position) { 89             return position; 90         } 91   92         public View getView(int position, View convertView, ViewGroup parent) { 93             ImageViewExt imageView; 94   95             if (convertView == null) { 96                 imageView = new ImageViewExt(mContext); 97                 // 如果是横屏,GridView会展示4列图片,需要设置图片的大小 98                 if (imageCol == 4) { 99                     imageView.setLayoutParams(new GridView.LayoutParams(100                             dm.heightPixels / imageCol - 6, dm.heightPixels101                                     / imageCol - 6));102                 } else {
// 如果是竖屏,GridView会展示3列图片,需要设置图片的大小103 imageView.setLayoutParams(new GridView.LayoutParams(104 dm.widthPixels / imageCol - 6, dm.widthPixels105 / imageCol - 6));106 }107 imageView.setAdjustViewBounds(true);108 imageView.setScaleType(ImageView.ScaleType.CENTER_CROP);109 } else {110 imageView = (ImageViewExt) convertView;111 }112 imageView.setImageResource(ImageSource.mThumbIds[position]);113 114 return imageView;115 }116 117 private Context mContext;118 }119 }

 

 

加载GridView页面,如果屏幕是竖屏,则显示3列,如果是横屏,则显示4列;并且显示的图片加上灰色边框,这里在适配器GridImageAdapter的getView方法里引用了ImageViewExt类来对图片进行处理,这个类扩展自ImageView;点击其中的某一张图片,会跳转到GalleryActivity页面。

2、ImageViewExt.java文件

 

1 /** 2  * 3  * @author 空山不空 4  * 扩展ImageView类,将图片加上边框,并且设置边框为灰色 5  */ 6 public class ImageViewExt extends ImageView { 7  //将图片加灰色的边框 8     private int color; 9  10     public ImageViewExt(Context context) {11         super(context);12        // TODO Auto-generated constructor stub13         color=Color.GRAY;14   }15      16    public ImageViewExt(Context context, AttributeSet attrs) {17          super(context, attrs);18         // TODO Auto-generated constructor stub19          color=Color.GRAY;20    }21  22      23     @Override24      protected void onDraw(Canvas canvas) {25          // TODO Auto-generated method stub   26         27         super.onDraw(canvas);   28         //画边框29          Rect rec=canvas.getClipBounds();30         rec.bottom--;31         rec.right--;32         Paint paint=new Paint();33         paint.setColor(color);34         paint.setStrokeWidth(5);35         paint.setStyle(Paint.Style.STROKE);36         canvas.drawRect(rec, paint);37     }38 }

 

 

通过重载onDraw方法来画边框和设置边框颜色

3、相册GalleryActivity.java

1 /** 2  * 3  * @author 空山不空 4  * Gallery图片页面,通过Intent得到GridView传过来的图片位置,加载图片,再设置适配器 5  */ 6 public class GalleryActivity extends Activity { 7     public int i_position = 0; 8     private DisplayMetrics dm; 9  10     @Override11     public void onCreate(Bundle savedInstanceState) {12         super.onCreate(savedInstanceState);13         requestWindowFeature(Window.FEATURE_NO_TITLE);14         setContentView(R.layout.mygallery); 15         dm = new DisplayMetrics();16         getWindowManager().getDefaultDisplay().getMetrics(dm);17         // 获得Gallery对象 18         GalleryExt  g = (GalleryExt) findViewById(R.id.ga);19         //通过Intent得到GridView传过来的图片位置20         Intent intent = getIntent();21         i_position = intent.getIntExtra("position", 0); 22         // 添加ImageAdapter给Gallery对象23         ImageAdapter ia=new ImageAdapter(this);    24         g.setAdapter(ia);25         g.setSelection(i_position);    26          27         //加载动画28         Animation an= AnimationUtils.loadAnimation(this,R.anim.scale );29         g.setAnimation(an);30  31     }32 }

 

 这里有三点:

(1)、扩展Gallery组件,即GalleryExt控件,设置滑动一次只加载一张图片,并且, 如果是第一张图片时,向左滑动会提示“已到第一页”,如果是最后一张图片时,向右滑动会提示“已到第后页”

(2)、接收GridViewActivity页面传过来的参数position,通过这个参数找到具体的图片,通过ImageAdapter适配器加载

(3)、ImageAdapter图片适配器,用来加载图片

4、GalleryExt.java文件

1 /** 2  * 3  * @author 空山不空 4  * 扩展Gallery组件,设置滑动一次只加载一张图片,并且, 5  * 如果是第一张图片时,向左滑动会提示“已到第一页” 6  * 如果是最后一张图片时,向右滑动会提示“已到第后页” 7  */ 8 public class GalleryExt extends Gallery { 9     boolean is_first=false;10     boolean is_last=false;11     public GalleryExt(Context context) {12         super(context);13         // TODO Auto-generated constructor stub14     }15      16     public GalleryExt(Context context,AttributeSet paramAttributeSet)17      {18            super(context,paramAttributeSet);19  20      }21  22     private boolean isScrollingLeft(MotionEvent e1, MotionEvent e2)23        {  24         return e2.getX() > e1.getX();25        }26  27      @Override28     public boolean onFling(MotionEvent e1, MotionEvent e2, float distanceX,29                     float distanceY) {30  //通过重构onFling方法,使Gallery控件滑动一次只加载一张图片31          //获取适配器32          ImageAdapter ia=(ImageAdapter)this.getAdapter();33         //得到当前图片在图片资源中的位置34          int p=ia.getOwnposition();35          //图片的总数量36          int count=ia.getCount();37          int kEvent; 38           if(isScrollingLeft(e1, e2)){39            //Check if scrolling left 40               if(p==0&&is_first){41                   //在第一页并且再往左移动的时候,提示42                   Toast.makeText(this.getContext(), "已到第一页", Toast.LENGTH_SHORT).show();43               }else if(p==0){44                   //到达第一页时,把is_first设置为true45                   is_first=true;46               }else{47                   is_last=false;48               }49                50            kEvent = KeyEvent.KEYCODE_DPAD_LEFT; 51            }  else{52             //Otherwise scrolling right   53                if(p==count-1&&is_last){54                       Toast.makeText(this.getContext(), "已到最后一页", Toast.LENGTH_SHORT).show();55                   }else if( p==count-1){56                       is_last=true;57                   }else{58                       is_first=false;59                   }60                    61             kEvent = KeyEvent.KEYCODE_DPAD_RIGHT;  62             } 63           onKeyDown(kEvent, null); 64           return true; 65     }

 

 

5、ImageAdapter.java文件

1 /** 2  * 3  * @author 空山不空 4  *  图片适配器,用来加载图片 5  */ 6 public class ImageAdapter extends BaseAdapter { 7 //图片适配器 8     // 定义Context 9     private int ownposition;10       11  12     public int getOwnposition() {13         return ownposition;14     }15  16     public void setOwnposition(int ownposition) {17         this.ownposition = ownposition;18     }19  20     private Context mContext;21  22     // 定义整型数组 即图片源23  24     // 声明 ImageAdapter25     public ImageAdapter(Context c) {26         mContext = c;27     }28  29     // 获取图片的个数30     public int getCount() {31         return ImageSource.mThumbIds.length;32     }33  34     // 获取图片在库中的位置35     public Object getItem(int position) {36         ownposition=position;37         return position;38     }39  40     // 获取图片ID41     public long getItemId(int position) {42         ownposition=position;43         return position;44     }45  46     public View getView(int position, View convertView, ViewGroup parent) {47  48           49         ownposition=position;50         ImageView imageview = new ImageView(mContext);51         imageview.setBackgroundColor(0xFF000000);52         imageview.setScaleType(ImageView.ScaleType.FIT_CENTER);53         imageview.setLayoutParams(new GalleryExt.LayoutParams(54                 LayoutParams.MATCH_PARENT, LayoutParams.MATCH_PARENT));55  56         imageview.setImageResource(ImageSource.mThumbIds[position]);57         // imageview.setAdjustViewBounds(true);58         // imageview.setLayoutParams(new GridView.LayoutParams(320, 480));59         // imageview.setScaleType(ImageView.ScaleType.CENTER_INSIDE);60         return imageview;61     }62 }

 

 

6、配置文件

(1)AndroidManifest.xml :

 

 

(2)mygridview.xml,即GridView页面

1 
2 3 4

 

 

(3)mygallery.xml,加载图片页面

1 
2
6
9 10
13
14

 

 

Demo下载地址:<a href="http://files.cnblogs.com/fbsk/gridGalleryDemo.zip"> gridGalleryDemo.zip下载</a>

 

转自:http://www.cnblogs.com/fbsk/archive/2011/10/10/2205776.html

 

转载于:https://www.cnblogs.com/Sharley/p/5580714.html

你可能感兴趣的文章
Ubuntu的默认root密码
查看>>
Vue+Element+Select获取选中的对象
查看>>
Ubuntu下Tomcat连接MySql数据库
查看>>
JAV基础学习
查看>>
零散的小知识
查看>>
WPF Summary 系列指导(连载中…^_^)
查看>>
feof()的实现
查看>>
VS中Debug与Release、_WIN32与_WIN64的区别
查看>>
真正通用的SQL分页存储过程
查看>>
coredump的裁剪方法
查看>>
精选30个优秀的CSS技术和实例
查看>>
洛谷P5206 数树
查看>>
20160509-hibernate--继承映射
查看>>
删除字符串最后一个字符的几种方法
查看>>
extjs apply,applyif,override,extend 的区别
查看>>
mycat 自增id笔记
查看>>
.net开源CMS系统使用教程之:如何用We7 CMS建设全新网站
查看>>
查看表扫描次数,并对比索引对表查询的作用
查看>>
Java多线程系列目录(共43篇)
查看>>
解决MySQL登录ERROR 1045 (28000): Access denied for user 'root'@'localhost' (using passwor)问题
查看>>