您的位置:首页 > 产品设计 > UI/UE

5.1 Android Basic QuickStart Layouts Grid View

2011-03-25 16:16 429 查看
[b]GridView Layhout [/b]

GridView是一个ViewGroup子试图。用于二维、滚动网格。GridView自动添加了一个ListAdapter布局

新建项目HelloGridView

将一些图片放到res/drawable/目录

打开res/layout/main.xml文件,按一下修改。
<?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" />

4. 打开HelloGridView.java 将如下代码写入onCreate方法

package com.helloview.layout;

import android.app.Activity;

import android.os.Bundle;

import android.widget.AdapterView;

import android.widget.GridView;

import android.widget.Toast;

import android.widget.AdapterView.OnItemClickListener;

import android.view.View;

public class HelloGridView extends Activity {

/** Called when the activity is first created. */

@Override

public void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.main);

GridView gridview = (GridView)findViewById(R.id.gridview);

gridview.setAdapter(new ImageAdapter(this));

gridview.setOnItemClickListener(new OnItemClickListener(){

public void onItemClick(AdapterView<?> parent,View v,int position,long id){

Toast.makeText(HelloGridView.this,""+position,Toast.LENGTH_SHORT).show();

}

});

}

}

在代码中获取 GridView 使用 findViewById方法。setAdapter()方法设置自定义的Adapter(ImageAdapter)来将内容显示在grid中。ImageAdapter类将在下一步创建。

当grid被单击的时候,setOnItemClickListener()方法传递一个新的AdapterView.OnItemClickListener. 这个匿名的实例定义了一个onItemClick() callback方法用于显示当前单击的索引(在实际的项目中我们可以利用这个功能来显示完整尺寸的图像或其他一些任务)。

5. 创建 ImageAdapter类,继承自BaseAdapter

package com.helloview.layout;

import android.view.View;

import android.view.ViewGroup;

import android.widget.BaseAdapter;

import android.widget.GridView;

import android.widget.ImageView;

import android.content.Context;

public class ImageAdapter extends BaseAdapter {

private Context mContext;

public ImageAdapter(Context c) {

mContext = c;

}

public int getCount() {

return mThumbIds.length;

}

public Object getItem(int position) {

return null;

}

public long getItemId(int position) {

return 0;

}

//Get a View that displays the data at the specified position in the data set

public View getView(int position, View convertView, ViewGroup parent) {

ImageView imageView;

if (convertView == null) {

imageView = new ImageView(mContext);

imageView.setLayoutParams(new GridView.LayoutParams(85, 85));

imageView.setScaleType(ImageView.ScaleType.CENTER_CROP);

imageView.setPadding(6, 6, 6, 6);

} else {

imageView = (ImageView) convertView;

}

imageView.setImageResource(mThumbIds[position]);

return imageView;

}

// references to our images

private Integer[] mThumbIds = { R.drawable.sample_2, R.drawable.sample_3,

R.drawable.sample_4, R.drawable.sample_5, R.drawable.sample_1,

R.drawable.sample_1, R.drawable.sample_0, R.drawable.sample_1,

R.drawable.sample_2, R.drawable.sample_3, R.drawable.sample_4,

R.drawable.sample_5, R.drawable.sample_3, R.drawable.sample_5,

R.drawable.sample_0, R.drawable.sample_1, R.drawable.sample_2,

R.drawable.sample_3, R.drawable.sample_4, R.drawable.sample_5,

R.drawable.sample_2, R.drawable.sample_3 };

}

getView()方法为每张图片创建一个View并添加到ImageAdapter。当他被调用的时候,应为View是一个回收的对象所以要检测是否为空。

setLayoutParams(ViewGroup.LayoutParams) 设置高度和宽度

setScaleType(ImageView.ScaleType) 设置图像的比例

setPadding(int, int, int, int) 定义边界的空白大小。

setImageResource 方法设置当前的图像,图像数据在数组 mThumbIds中。

6. 运行应用程序

内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: