android基础入门GridView视图(12)
一.GridView（网格视图）:
我们可以将GridView和一个ImageView配合使用来显示一系列的图像。
GridView属性介绍：
android:columnWidth 设置列的宽度。
android:verticalSpacing 设置两行之间的间距。
android:horizontalSpacing 设置两列之间的间距。
android:stretchMode 设置缩放模式。
android:numColumns 设置显示的列数。
android:gravity 设置此组件中的内容在组件中的位置。可选的值有：top、bottom、left、right、center_vertical、fill_vertical、center_horizontal、fill_horizontal、center、fill、clip_vertical可以多选，用“|”分开。
实例演示：
布局文件：
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<GridView
android:id="@+id/gridView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:verticalSpacing="10dp"
android:horizontalSpacing="10dp"
android:stretchMode="columnWidth"
android:gravity="center"
android:numColumns="3" >
</GridView>
<ImageView
android:id="@+id/img"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
</LinearLayout>
实现代码：
public class MainActivity extends Activity {
//可以自己设置图片，图片大小不宜过大。
Integer[] img = {
R.drawable.img1,
R.drawable.img2,R.drawable.img3,
R.drawable.img4,R.drawable.img5,
R.drawable.img8,R.drawable.img9,
};
private ImageView imgView;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
imgView = (ImageView)findViewById(R.id.img);
GridView gird = (GridView)findViewById(R.id.gridView1);
gird.setAdapter(new ImageAdapter(this));
gird.setOnItemClickListener(new OnItemClickListener() {
@Override
public void onItemClick(AdapterView<?> arg0, View arg1, int arg2,
long arg3) {
imgView.setBackgroundResource(img[arg2]);
Toast.makeText(getApplicationContext(), "点击了"+arg2, Toast.LENGTH_SHORT).show();
}
});
}
public class ImageAdapter extends BaseAdapter{
public Context context;
public ImageAdapter(Context context){
this.context = context;
}
@Override
public int getCount() {
// TODO Auto-generated method stub
return img.length;
}
@Override
public Object getItem(int position) {
// TODO Auto-generated method stub
return position;
}
@Override
public long getItemId(int position) {
// TODO Auto-generated method stub
return position;
}
@Override
public View getView(int position, View convertView, ViewGroup parent) {
// TODO Auto-generated method stub
ImageView imageView;
if(convertView == null){
imageView = new ImageView(context);
imageView.setLayoutParams(new GridView.LayoutParams(85,85));
imageView.setScaleType(ImageView.ScaleType.CENTER_CROP);
imageView.setPadding(5, 5, 5, 5);
}else{
imageView = (ImageView)convertView;
}
imageView.setImageResource(img[position]);
return imageView;
}
}
@Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
getMenuInflater().inflate(R.menu.main, menu);
return true;
}
}
运行效果：
第二种实现方式：
主界面布局(activity_main.xml)：
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
>
<GridView
android:id="@+id/gridView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:verticalSpacing="10dp"
android:horizontalSpacing="10dp"
android:stretchMode="columnWidth"
android:gravity="center"
android:numColumns="3" >
</GridView>
</LinearLayout>
显示布局(main.xml)：
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/RelativeLayout1"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:paddingBottom="6dip"
>
<ImageView
android:id="@+id/image_item"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
/>
<TextView
android:id="@+id/text_item"
android:layout_below="@+id/image_item"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_centerHorizontal="true"
/>
</RelativeLayout>
主要代码：
public class MainActivity extends Activity {
private GridView gv;
@Override
protected void onCreate(Bundle savedInstanceState) {
// TODO Auto-generated method stub
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
//准备要添加的数据条目
List<Map<String, Object>> items = new ArrayList<Map<String,Object>>();
for (int i = 0; i < 9; i++) {
Map<String, Object> item = new HashMap<String, Object>();
item.put("imageItem", R.drawable.ic_launcher);//使用系统默认图标
item.put("textItem", "icon" + i);//按序号添加ItemText
items.add(item);
}
//实例化一个适配器，第二个参数是需要绑定的数据，第三个参数是实现的布局方式，第四和第五个参数是实现组件与数据的绑定。
SimpleAdapter adapter = new SimpleAdapter(this,
items,
R.layout.main,
new String[]{"imageItem", "textItem"},
new int[]{R.id.image_item, R.id.text_item});
//获得GridView实例
gv = (GridView)findViewById(R.id.gridView1);
//为GridView设置适配器
gv.setAdapter(adapter);
}
@Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
getMenuInflater().inflate(R.menu.main, menu);
return true;
}
}
运行图片：
