`
lufengdie
  • 浏览: 247871 次
  • 性别: Icon_minigender_1
  • 来自: 西安
社区版块
存档分类
最新评论

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的代码:
@Override public void onCreate(Bundle savedInstanceState) {     super.onCreate(savedInstanceState);      setContentView(R.layout.grid_2);      GridView g = (GridView) findViewById(R.id.myGrid);     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++地getItem,getView得到要显示的view,这样子逐一地显示出来!

下面是官方sample里面的Photo Grid的例子,本人省略了某些代码:
public class ImageAdapter extends BaseAdapter {     public ImageAdapter(Context c) {         mContext = c;     }      public int getCount() {         return mThumbIds.length;     }      public Object getItem(int position) {         return position;     }      public long getItemId(int position) {         return position;     }      public View getView(int position, View convertView, ViewGroup parent) {         ImageView imageView;         if (convertView == null) {             imageView = new ImageView(mContext);             imageView.setLayoutParams(new GridView.LayoutParams(45, 45));//设置ImageView宽高             imageView.setAdjustViewBounds(false);             imageView.setScaleType(ImageView.ScaleType.CENTER_CROP);             imageView.setPadding(8, 8, 8,;         } else {             imageView = (ImageView) convertView;         }          imageView.setImageResource(mThumbIds[position]);          return imageView;     }      private Context mContext;      private Integer[] mThumbIds = {             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    }; } 留意getView里面的代码,要判断convertView是否为null,以便重用,减少对象的创建,减少内存占用。

XML布局文件内容,原来就只是指明GridView:
<?xml version="1.0" encoding="utf-8"?> <GridView xmlns:android="http://schemas.android.com/apk/res/android"      android:id="@+id/myGrid"     android:layout_width="fill_parent"      android:layout_height="fill_parent"     android:padding="10dp"     android:verticalSpacing="10dp"          android:horizontalSpacing="10dp"     android:numColumns="auto_fit"     android:columnWidth="60dp"     android:stretchMode="columnWidth"          android:gravity="center"     />     可以看到getView,和ImageView是重点,影响图片的显示效果。而且发现列数是不确定的,取决于每个ImageView的宽度和屏幕的宽度。接下来看看ImageView。

    ImageView:Displays 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就是用来显示Image,icon的。
    这里我们重点理解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矩阵可以动态缩小放大图片来显示,这里不展开深入的了解,只是贴出相关语句,缩小图片:
//获得Bitmap的高和宽 int bmpWidth=bmp.getWidth(); int bmpHeight=bmp.getHeight();  //设置缩小比例 double scale=0.8; //计算出这次要缩小的比例 scaleWidth=(float)(scaleWidth*scale); scaleHeight=(float)(scaleHeight*scale);  //产生resize后的Bitmap对象 Matrix matrix=new Matrix(); matrix.postScale(scaleWidth, scaleHeight); Bitmap resizeBmp=Bitmap.createBitmap(bmp, 0, 0, bmpWidth, bmpHeight, matrix, true); 
    应用ImageView的例子很多,看看上次FrameLayout里面的:
<ImageView     android:id="@+id/image"     android:layout_width="fill_parent"      android:layout_height="fill_parent"     android:scaleType="center"     android:src="@drawable/candle"     /> 
    ** 要注意一点,我发现Drawable文件夹里面的图片命名是不能大写的


本文转载自: http://android.blog.51cto.com/268543/316255

http://android.blog.51cto.com/268543/316255


分享到:
评论

相关推荐

    android-GridView显示图片点击放大.zip

    1. Android GridView的基本使用,包括Adapter的实现和数据绑定。 2. 图片的加载策略,如异步加载和缓存。 3. GridView中的点击事件处理和图片放大效果实现。 4. 自定义适配器的设计和使用。 5. UI布局的优化,如设置...

    030_Android UI组件之 GridView组件

    本教程“030_Android UI组件之 GridView组件”深入讲解了GridView这一重要的布局管理器,它允许我们以网格形式展示数据,通常用于创建照片墙、应用快捷方式列表等。 GridView是一个基于Adapter的视图,它会将数据集...

    Android-UI-design.rar_android_android ui

    让我们深入探讨这个主题,了解如何使用Java编程语言和GridView组件来创建高效的Android应用UI。 首先,Android UI设计遵循Material Design指导原则,这是一种由Google提出的统一的设计语言,旨在提供清晰、直观和...

    Android编程UI设计之GridView和ImageView的用法

    在Android开发中,UI设计是至关重要的一环,而GridView和ImageView是两个常用且重要的组件。这篇文章将深入探讨这两个组件的用法以及它们在实际应用中的实现。 首先,GridView是一个二维滚动网格视图,用于展示一...

    Android_UI_GridView

    本教程将深入探讨Android UI中的GridView及其简单操作。 1. GridView简介: GridView是LinearLayout和ListView的组合体,它沿两个轴(水平和垂直)对齐其子视图,形成一个可滚动的网格。每个单元格可以包含不同的...

    Android-UI-master.zip

    【Android-UI-master.zip】是一个专门针对Android用户界面(UI)设计的资源包,它包含了各种特效的示例项目,每个特效都有独立的项目结构,方便开发者深入学习和实践。这个压缩包是针对Android开发者的教程配套代码...

    android Gridview 异步加载网络图片

    综上所述,"android Gridview 异步加载网络图片"是一个涉及Android UI设计、多线程编程、图片处理、缓存策略以及第三方库使用的综合主题。通过学习这个示例,开发者可以提升应用性能,提供更优质的用户体验。

    android GridView 添加图片

    在这个场景下,"android GridView 添加图片"的主题涉及了如何在GridView中加载和操作图片,包括从图库选择图片、通过相机拍摄图片以及对图片进行剪切等操作。下面将详细介绍这些知识点。 1. **GridView的基本使用**...

    Android下GridView的使用

    在Android开发中,GridView是一种非常常见的布局控件,它允许我们以网格的形式展示数据,通常用于...实践是学习的最佳途径,建议你亲自尝试创建一个自己的GridView项目,不断探索和优化,以提升你的Android开发能力。

    Android高级应用源码-Listview,Gridview空数据处理.zip

    在Android开发中,ListView和GridView是两种常用的列表控件,...通过这个源码学习,开发者不仅可以了解如何处理ListView和GridView的空数据状态,还能掌握自定义布局和Adapter的使用,进一步提升Android应用的专业性。

    Android学习新手笔记

    - TextView、ImageView、EditText等基础UI组件的使用和属性设置。 - Button、Checkbox、Radio等交互组件的使用。 - Spinner、ListView、ArrayAdapter、BaseAdapter、SimpleAdapter等列表展示组件和适配器模式的...

    Android书架(自定义GridView)

    在Android开发中,"Android书架(自定义GridView)"是一个常见的应用场景,通常用于实现类似电子书库或图书展示的功能。...通过这个项目,开发者不仅可以掌握GridView的使用,还能提升对Android UI设计和优化的理解。

    Android UI 大全 里面包含所以特效大全的项目,都是每个特效一个项目的结构

    1. **Android UI组件**:Android系统提供了多种UI组件,如按钮(Button)、文本输入框(EditText)、列表(ListView)、网格视图(GridView)、滑动选择器(Spinner)、图片视图(ImageView)等。每个特效项目可能都会涉及到这些...

    安卓开发-gridview分页效果.zip.zip

    在Android开发中,GridView是一种非常常见的布局控件,它允许我们以网格的形式展示数据,通常用于创建类似相册、应用列表等场景。本教程将详细讲解如何在Android中实现GridView的分页效果,以提高用户体验并优化性能...

    老罗Android开发视频教程 (android常用UI编程) 26-33集源码

    2. **控件使用**:Android SDK提供了丰富的UI控件,如按钮(Button)、文本视图(TextView)、输入框(EditText)、图像视图(ImageView)等。学习者会学习如何创建、设置属性和监听事件。 3. **事件处理**:理解...

    android ui组件大全

    这些标签进一步强调了这个资源主要关注的是Android UI控件的实践和学习,适合开发者进行动手练习和提高。 文件名:“AndroidAllControl-master” 这个文件名暗示着这是一个开源项目,可能是GitHub上的一个仓库,名...

    Android-Universal-Image-Loader-master

    UIL不仅限于简单的ImageView,它还能很好地支持ListView、GridView和Gallery等组件。对于这些视图,UIL能实现智能地复用图片,减少内存消耗,同时确保在滚动过程中图片的平滑过渡。 5. **丰富的配置选项** 开发者...

    Android-UI.rar_Android经典界面_android_android ui

    在Android应用开发中,UI(用户界面)设计是至关重要的,因为它直接影响到用户的体验和对应用的接受程度。本资源“Android-UI.rar”提供了一系列经典的Android界面设计实例,非常适合初学者参考学习,以理解并掌握...

    Android-API.zip_DWinterTab ImageView_android

    DWinterTab ImageView_android"包含了Android API的中文文档,这对于Android开发者来说是一份极其宝贵的资源,特别是对于初学者或者不熟悉英文文档的开发者,中文版的API文档能够帮助他们更高效地理解和学习。...

Global site tag (gtag.js) - Google Analytics