【Android】10.3 网格视图(GridView)

分类:C#、Android、VS2015;

创建日期:2016-02-19

一、简介

网格视图(GridView)是在GridLayout的基础上添加了滚动功能的视图,即:GridView用于在可滚动的2D网格空间中显示包含大量单元格的项(每项都是一个视图),例如每个单元格显示一个图片,当图片较多时,还可以上下滚动查看。

要使用GridView,需要先编写一个视图适配器(一般用继承自BaseAdapter<T>的适配器类来实现),再利用它来依次填充每个单元格,例如,将图片按先行后列(或者先列后行)依次插入到每个单元格中。

二、示例1-GridView基本用法

本例演示如何用GridView创建一个用缩略图组成的网格。当某一项被选中时,弹出显示该图像位置的Toast消息提示框。如果图像较多,还可以上下滚动查看。

1、运行截图

2、设计步骤

(1)添加ch1001_GridViewDemo.axml文件

在Resources/layout文件夹下添加该文件。

<?xml version="1.0" encoding="utf-8"?>
<GridView xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/gridview1"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:columnWidth="90dp"
    android:numColumns="auto_fit"
    android:verticalSpacing="10dp"
    android:horizontalSpacing="10dp"
    android:stretchMode="columnWidth"
    android:gravity="center" />

创建的GridView将自动填满整个屏幕。

(2)添加ch1001MyImageAdapter.cs文件

在SrcDemos文件夹下添加该文件。

这里再重复一遍,键入下面的代码后,单击小灯泡右侧的三角符号,然后单击“实现接口”,它就会自动添加对应的方法,而不是你自己一点一点敲进去的。凡是需要实现接口的地方都是这样做的。

class ch1001MyImageAdapte : BaseAdapter<int>

{

}

该文件的完整代码如下:

using Android.Content;
using Android.Views;
using Android.Widget;

namespace MyDemos.SrcDemos
{
    class ch1001MyImageAdapte : BaseAdapter<int>
    {
        Context context;
        int[] thumbIds =
        {
            Resource.Drawable.ch05sample_2, Resource.Drawable.ch05sample_3,
            Resource.Drawable.ch05sample_4, Resource.Drawable.ch05sample_5,
            Resource.Drawable.ch05sample_6, Resource.Drawable.ch05sample_7,
            Resource.Drawable.ch05sample_0, Resource.Drawable.ch05sample_1,
            Resource.Drawable.ch05sample_2, Resource.Drawable.ch05sample_3,
            Resource.Drawable.ch05sample_4, Resource.Drawable.ch05sample_5,
            Resource.Drawable.ch05sample_6, Resource.Drawable.ch05sample_7,
            Resource.Drawable.ch05sample_0, Resource.Drawable.ch05sample_1,
            Resource.Drawable.ch05sample_2, Resource.Drawable.ch05sample_3,
            Resource.Drawable.ch05sample_4, Resource.Drawable.ch05sample_5,
            Resource.Drawable.ch05sample_6, Resource.Drawable.ch05sample_7
        };

        public ch1001MyImageAdapte(Context c)
        {
            context = c;
        }

        public override int this[int position]
        {
            get { return 0; }
        }

        public override int Count
        {
            get { return thumbIds.Length; }
        }

        public override long GetItemId(int position)
        {
            return 0;
        }

        public override View GetView(int position, View convertView, ViewGroup parent)
        {
            ImageView imageView;
            if (convertView == null)
            {
                imageView = new ImageView(context);
                imageView.LayoutParameters = new GridView.LayoutParams(200, 200);
                imageView.SetScaleType(ImageView.ScaleType.CenterCrop);
                imageView.SetPadding(8, 8, 8, 8);
            }
            else
            {
                imageView = (ImageView)convertView;
            }
            imageView.SetImageResource(thumbIds[position]);
            return imageView;
        }
    }
}

代码说明:

通常情况下,GetItem(int)应该返回一个适配器中指定位置的真实对象,GetItemId(int)应该返回组件的真实编号,但是在本例中都用不到,所以返回什么值都无所谓。

SetLayoutParams(ViewGroup.LayoutParams) 设置视图的高度和宽度,这样可确保不论原图像的大小如何都能适当的调整大小和裁减。

SetScaleType(ImageView.ScaleType) 声明了图像将依照中心进行裁减(如果需要的话)。

SetPadding(int, int, int, int)定义了如何填充内边距。(注意,如果图像有不同的纵横比,当图像不匹配ImageView给定的尺寸时,内边距较小会导致图像有更多的裁减)。

如果传给GetView()的视图不为空,则ImageView会由可重复使用的View初始化。

在GetView()方法的最后,传入的position参数用于从被作为ImageView资源的mThumbIds数组中选择图像。

剩下的就是定义drawable资源的thumbIds数组。

也可以使用imageView.SetAdjustViewBounds(boolean)让其自动适应图像的大小,用法很简单,直接用该语句替换掉SetLayoutParams()方法即可。

(3)添加ch1001GridViewDemo.cs文件

在SrcDemos文件夹下添加该文件。

using Android.App;
using Android.OS;
using Android.Widget;

namespace MyDemos.SrcDemos
{
    [Activity(Label = "【例10-1】网格视图基本用法")]
    public class ch1001GridViewDemo : Activity
    {
        protected override void OnCreate(Bundle savedInstanceState)
        {
            base.OnCreate(savedInstanceState);
            SetContentView(Resource.Layout.ch1001_GridViewDemo);
            var gridview = FindViewById<GridView>(Resource.Id.gridview1);
            gridview.Adapter = new ch1001MyImageAdapte(this);
            gridview.ItemClick += (s, e) =>
            {
                Toast.MakeText(this, e.Position.ToString(), ToastLength.Short).Show();
            };
        }
    }
}

当单击网格中的某项时,这里仅用Toast消息框显示所选中的网格的位置索引号(从零开始计算)。在实际程序中,可以通过位置索引号获取其全尺寸图像以备其他用途。

时间: 2024-10-12 05:24:35

【Android】10.3 网格视图(GridView)的相关文章

android学习之--网格视图(GridView)和图像切换器(ImageSwitcher)

         GridView用于在界面上按行.列分布显示多个组件.GridView和ListView有共同父类:AbsListView.GridView与ListView的区别在于:ListView只在一个方向上分布,GridView在两个方向上分布.所以使用GridView时一般都指定numColumns大于1,否则该属性默认值为1,就意味着改GridView只有一列,那就变成了ListView GridView的xml属性 android:strtchMode 的值为:      Im

Android学习笔记27:网格视图GridView的使用

网格视图GridView的排列方式与矩阵类似,当屏幕上有很多元素(文字.图片或其他元素)需要按矩阵格式进行显示时,就可以使用GridView控件来实现. 本文将以一个具体的实例来说明如何使用GridView控件实现手机屏幕上各个应用软件图标的摆放,以及应用软件名称的显示. 完成后的程序运行效果如图1所示. 图1 主界面显示效果 1.界面布局 通过查看GridView的API帮助文档(http://developer.android.com/reference/android/widget/Gri

Android 网格视图GridView的使用

网格视图GridView的排列方式与矩阵类似,当屏幕上有很多元素(文字.图片或其他元素)需要按矩阵格式进行显示时,就可以使用GridView控件来实现. 本文将以一个具体的实例来说明如何使用GridView控件实现手机屏幕上各个应用软件图标的摆放,以及应用软件名称的显示. 完成后的程序运行效果如图1所示. 图1 主界面显示效果 1.界面布局 通过查看GridView的API帮助文档(http://developer.android.com/reference/android/widget/Gri

Android 自学之网格试图(GridView)和图片切换器(ImageSwitcher)功能和用法

网格试图(GridView)用于在界面上按行,列分布的方式来显示多个组件. GridView和ListView有共同的父类:AbsListView,因此GridView和ListView具有一定的相似性.GridView和ListView的主要区别在于:ListView只是一个方向上的分布:而GridView则会在两个方向上分布. 与ListView相似的是,GridView也需要通过Adapter来提供显示数据:可以通过SimpleAdapter来为GridView提供数据,也可以通过开发Ba

网格视图GridView的使用

网格视图GridView的排列方式与矩阵类似,当屏幕上有很多元素(文字.图片或其他元素)需要按矩阵格式进行显示时,就可以使用GridView控件来实现. 本文将以一个具体的实例来说明如何使用GridView控件实现手机屏幕上各个应用软件图标的摆放,以及应用软件名称的显示. 完成后的程序运行效果如图1所示. 1.界面布局 通过查看GridView的API帮助文档(http://developer.android.com/reference/android/widget/GridView.html)

Android学习-网格视图GridView

一.简介: GridView是一个以表格形式显示多张图片等组件.它是按照行列的方式来显示内容的,比如实现九宫格图,用GridView是首选. 二.代码块: 看过我上一篇博客的同学应该知道,一步一步全部步骤写出来是很费时间的,大概流程就那样,所以这次网格视图就直接上代码块了,步骤差不多. 在activity_main.xml中添加一个按钮: <Button android:id="@+id/btn_gridview" android:layout_width="match

[转]Android网格视图(GridView)

GridView的一些属性: 1.android:numColumns=”auto_fit”   //GridView的列数设置为自动,也可以设置成2.3.4…… 2.android:columnWidth=”90dp "       //每列的宽度,也就是Item的宽度 3.android:stretchMode=”columnWidth"//缩放与列宽大小同步 4.android:verticalSpacing=”10dp”          //两行之间的边距 5.android

网格视图GridView

1.常用属性 2.Adapter接口 3.Demo演示 今天观看了GridView的相关视频,并且根据案例,进行了代码的编写和实例 新建GridViewActivity.java继承AppCompatActivity.java: package com.example.revrse.gridview; import android.os.Bundle; import android.os.PersistableBundle; import android.widget.GridView; imp

Android基础入门教程——2.4.9 GridView(网格视图)的基本使用

Android基础入门教程--2.4.9 GridView(网格视图)的基本使用 标签(空格分隔): Android基础入门教程 本节引言: 本节给大家介绍的是第二个Adapter类的控件--GridView(网格视图),见名知义,ListView是列表, GridView就是显示网格!他和ListView一样是AbsListView的子类!很多东西和ListView都是相通的, 本节我们就来学习他的基本用法~ 1.相关属性: 下面是GridView中的一些属性: android:columnW