Xamarin.Android GridView

项目
02/06/2018

GridView 是一个 ViewGroup，它在二维可滚动网格中显示项。使用 ListAdapter 将网格项自动插入到布局中。

在本教程中，你将创建图像缩略图网格。选择项后，toast 消息将显示图像的位置。

启动一个名为 HelloGridView 的新项目。

找到一些想要使用的照片，或下载这些示例图像。将图像文件添加到项目的 Resources/Drawable 目录。在“属性”窗口中，将每个文件的“生成操作”设置为“AndroidResource”。

打开 Resources/Layout/Main.axml 文件并插入以下内容：

<?xml version="1.0" encoding="utf-8"?>
<GridView xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/gridview"
    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 将填充整个屏幕。这些属性的含义不言自明。有关有效属性的详细信息，请参阅 GridView 参考。

打开 HelloGridView.cs 并为 OnCreate() 方法插入以下代码：

protected override void OnCreate (Bundle bundle)
{
    base.OnCreate (bundle);

    SetContentView (Resource.Layout.Main);

    var gridview = FindViewById<GridView> (Resource.Id.gridview);
    gridview.Adapter = new ImageAdapter (this);

    gridview.ItemClick += delegate (object sender, AdapterView.ItemClickEventArgs args) {
        Toast.MakeText (this, args.Position.ToString (), ToastLength.Short).Show ();
    };
}

为内容视图设置 Main.axml 布局后，使用 FindViewById 从布局中捕获 GridView。此然后，使用 Adapter 属性将自定义适配器 (ImageAdapter) 设置为要在网格中显示的所有项的源。将在下一步骤中创建 ImageAdapter。

要在单击网格中的项时执行某些操作，需要匿名委托订阅 ItemClick 事件。它显示 Toast，其中显示选定项的索引位置（从零开始）（在实际方案中，该位置可用于获取其他任务的全尺寸图像）。请注意，可以使用 Java 样式侦听器类，而不是 .NET 事件。

创建一个名为 ImageAdapter 的新类，该类对 BaseAdapter 进行子类化：

public class ImageAdapter : BaseAdapter
{
    Context context;

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

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

    public override Java.Lang.Object GetItem (int position)
    {
        return null;
    }

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

    // create a new ImageView for each item referenced by the Adapter
    public override View GetView (int position, View convertView, ViewGroup parent)
    {
        ImageView imageView;

        if (convertView == null) {  // if it's not recycled, initialize some attributes
            imageView = new ImageView (context);
            imageView.LayoutParameters = new GridView.LayoutParams (85, 85);
            imageView.SetScaleType (ImageView.ScaleType.CenterCrop);
            imageView.SetPadding (8, 8, 8, 8);
        } else {
            imageView = (ImageView)convertView;
        }

        imageView.SetImageResource (thumbIds[position]);
        return imageView;
    }

    // references to our images
    int[] thumbIds = {
        Resource.Drawable.sample_2, Resource.Drawable.sample_3,
        Resource.Drawable.sample_4, Resource.Drawable.sample_5,
        Resource.Drawable.sample_6, Resource.Drawable.sample_7,
        Resource.Drawable.sample_0, Resource.Drawable.sample_1,
        Resource.Drawable.sample_2, Resource.Drawable.sample_3,
        Resource.Drawable.sample_4, Resource.Drawable.sample_5,
        Resource.Drawable.sample_6, Resource.Drawable.sample_7,
        Resource.Drawable.sample_0, Resource.Drawable.sample_1,
        Resource.Drawable.sample_2, Resource.Drawable.sample_3,
        Resource.Drawable.sample_4, Resource.Drawable.sample_5,
        Resource.Drawable.sample_6, Resource.Drawable.sample_7
    };
}

首先，这会实现一些从 BaseAdapter 继承的必需方法。构造函数和 Count 属性的含义不言自明。通常，GetItem(int) 应返回适配器中指定位置处的实际对象，但本示例中忽略了该对象。同样，GetItemId(int) 应返回项的行 ID，但此处不是必需的。

第一种必需的方法是 GetView()。此方法为添加到 ImageAdapter 的每个图像创建一个新 View。调用它时，将传入 View，该对象通常是一个回收对象（至少在调用一次之后），因此需要检查该对象是否为 null。如果为 null，则 ImageView 已实例化并配置有图像呈现所需的属性：

LayoutParams 设置视图的高度和宽度，这确保了无论可绘制对象的大小如何，每个图像都会根据需要调整大小并进行裁剪，以适合这些尺寸。
SetScaleType() 声明图像应向中心裁剪（如有必要）。
SetPadding(int, int, int, int) 定义所有边的填充。（请注意，如果图像具有不同的长宽比，则如果图像与提供给 ImageView 的尺寸不匹配，则较少的填充将导致图像的更多裁剪。）

如果传递给 GetView() 的 View 不是 null，则本地ImageView 使用回收的 View 对象初始化。

在 GetView() 方法的最后，传入该方法的 position 整数用于从 thumbIds 数组中选择一个图像，该图像被设置为 ImageView 的图像资源。

剩下的就是定义可绘制资源的 thumbIds 数组。

运行该应用程序。网格布局应如下所示：

尝试通过调整 GridView 和 ImageView 元素的属性来试验其行为。例如，不要使用 LayoutParams，而是尝试使用 SetAdjustViewBounds()。

参考

本页的部分内容是根据 Android 开放源代码项目创建和共享的工作进行的修改，并根据知识共享署名 2.5 通用许可协议中的条款进行使用。

通过

Xamarin.Android GridView

参考

其他资源