Android UI学习 - GridView和ImageView的使用

    GridView: A view that shows items in two-dimensional scrolling grid. The items in the grid come from the  ListAdapter associated with this view. 简单说GridView就是我们资源管理器平常见到的一个个文件的icon显示方式。
    上面提及到了GridView的Item是来自ListAdapter的所以一般在Activity的onCreate使用GridView的代码
 
 
  1. @Override 
  2. public void onCreate(Bundle savedInstanceState) { 
  3.     super.onCreate(savedInstanceState); 
  4.  
  5.     setContentView(R.layout.grid_2); 
  6.  
  7.     GridView g = (GridView) findViewById(R.id.myGrid); 
  8.     g.setAdapter(new ImageAdapter(this)); 
     而ImageAdapter一般是extends BaseAdapter。BaseAdapter是implements ListAdapter SpinnerAdapter但很多时候自定义的Adapter都是override ListAdapter的父类Adapter接口里面的方法
    int     getCount()                   获取当前Adapter的Items数目
    Object getItem(int position)     获取相应position的Item
    long     getItemId(int position)  获取相应position的Item在List中的row id
    View    getView(int position, View convertView, ViewGroup parent) 获取在指定position所要显示的data的View
 
    这些方法函数和swing的差不多都是基于MVC。大概原理过程是这样的程序需要显示GridView那么要把data一个一个地显示出来是通过一个for循环首先call Adapter.getCount()得到有多少个data然后position++地getItemgetView得到要显示的view,这样子逐一地显示出来
 
下面是官方sample里面的Photo Grid的例子本人省略了某些代码
 
 
  1. public class ImageAdapter extends BaseAdapter { 
  2.     public ImageAdapter(Context c) { 
  3.         mContext = c; 
  4.     } 
  5.  
  6.     public int getCount() { 
  7.         return mThumbIds.length; 
  8.     } 
  9.  
  10.     public Object getItem(int position) { 
  11.         return position; 
  12.     } 
  13.  
  14.     public long getItemId(int position) { 
  15.         return position; 
  16.     } 
  17.  
  18.     public View getView(int position, View convertView, ViewGroup parent) { 
  19.         ImageView imageView; 
  20.         if (convertView == null) { 
  21.             imageView = new ImageView(mContext); 
  22.             imageView.setLayoutParams(new GridView.LayoutParams(4545));//设置ImageView宽高 
  23.             imageView.setAdjustViewBounds(false); 
  24.             imageView.setScaleType(ImageView.ScaleType.CENTER_CROP); 
  25.             imageView.setPadding(8888); 
  26.         } else { 
  27.             imageView = (ImageView) convertView; 
  28.         } 
  29.  
  30.         imageView.setImageResource(mThumbIds[position]); 
  31.  
  32.         return imageView; 
  33.     } 
  34.  
  35.     private Context mContext; 
  36.  
  37.     private Integer[] mThumbIds = { 
  38.             R.drawable.sample_thumb_0, R.drawable.sample_thumb_1, 
  39.             R.drawable.sample_thumb_2, R.drawable.sample_thumb_3, 
  40.             R.drawable.sample_thumb_4, R.drawable.sample_thumb_5, 
  41.             R.drawable.sample_thumb_6, R.drawable.sample_thumb_7
  42.     }; 
留意getView里面的代码要判断convertView是否为null以便重用减少对象的创建减少内存占用。
 
XML布局文件内容原来就只是指明GridView
 
 
  1. <?xml version="1.0" encoding="utf-8"?> 
  2. <GridView xmlns:android="http://schemas.android.com/apk/res/android"  
  3.     android:id="@+id/myGrid" 
  4.     android:layout_width="fill_parent"  
  5.     android:layout_height="fill_parent" 
  6.     android:padding="10dp" 
  7.     android:verticalSpacing="10dp" 
  8.      
  9.     android:horizontalSpacing="10dp" 
  10.     android:numColumns="auto_fit" 
  11.     android:columnWidth="60dp" 
  12.     android:stretchMode="columnWidth" 
  13.      
  14.     android:gravity="center" 
  15.     /> 
    可以看到getView和ImageView是重点影响图片的显示效果。而且发现列数是不确定的取决于每个ImageView的宽度和屏幕的宽度。接下来看看ImageView。
 
     ImageViewDisplays an arbitrary image, such as an icon. The ImageView class can load images from various sources (such as resources or content providers), takes care of computing its measurement from the image so that it can be used in any layout manager, and provides various display options such as scaling and tinting。 ImageView就是用来显示Imageicon的。
    这里我们重点理解ImageView的属性android:scaleType即ImageView.setScaleType(ImageView.ScaleType)。android:scaleType是控制图片如何resized/moved来匹对ImageView的size。ImageView.ScaleType / android:scaleType值的意义区别
 
CENTER /center  按图片的原来size居中显示当图片长/宽超过View的长/宽则截取图片的居中部分显示
 
CENTER_CROP / centerCrop  按比例扩大图片的size居中显示使得图片长(宽)等于或大于View的长(宽)
 
CENTER_INSIDE / centerInside  将图片的内容完整居中显示通过按比例缩小或原来的size使得图片长/宽等于或小于View的长/宽
 
FIT_CENTER / fitCenter  把图片按比例扩大/缩小到View的宽度居中显示
 
FIT_END / fitEnd    把图片按比例扩大/缩小到View的宽度显示在View的下部分位置
 
FIT_START / fitStart   把图片按比例扩大/缩小到View的宽度显示在View的上部分位置
 
FIT_XY / fitXY  把图片 不按比例扩大/缩小到View的大小显示
 
MATRIX / matrix 用矩阵来绘制
 
    一开始我不明白MATRIX矩阵网上搜索后发现原来MATRIX矩阵可以动态缩小放大图片来显示这里不展开深入的了解只是贴出相关语句缩小图片
 
 
  1. //获得Bitmap的高和宽 
  2. int bmpWidth=bmp.getWidth(); 
  3. int bmpHeight=bmp.getHeight(); 
  4.  
  5. //设置缩小比例 
  6. double scale=0.8
  7. //计算出这次要缩小的比例 
  8. scaleWidth=(float)(scaleWidth*scale); 
  9. scaleHeight=(float)(scaleHeight*scale); 
  10.  
  11. //产生resize后的Bitmap对象 
  12. Matrix matrix=new Matrix(); 
  13. matrix.postScale(scaleWidth, scaleHeight); 
  14. Bitmap resizeBmp=Bitmap.createBitmap(bmp, 00, bmpWidth, bmpHeight, matrix, true); 
 
    应用ImageView的例子很多看看上次FrameLayout里面的
 
 
  1. <ImageView 
  2.     android:id="@+id/image" 
  3.     android:layout_width="fill_parent"  
  4.     android:layout_height="fill_parent" 
  5.     android:scaleType="center" 
  6.     android:src="@drawable/candle" 
  7.     /> 
 
    ** 要注意一点我发现Drawable文件夹里面的图片命名是不能大写的。

 


本文转自 Icansoft 51CTO博客原文链接 http://blog.51cto.com/android/316255

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值