android九宫格实现,开始以为很复杂,其实只要知道了如何布局就很简单了。
先分析一下原理:
1:我们需要先定义一个主布局文件,宽度和列数用自适应的
android:numColumns="auto_fit"
android:stretchMode="columnWidth"
2:在定义一个子布局,子布局主要是控制九宫格每格的布局,例子是图文垂直布局。
3:在代码里面用SimpleAdapter将数据复制给布局文件,循环布局,就实现了九宫格
直接上代码:android九宫格主布局文件main.xml
Java代码
<?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:numColumns="auto_fit"
android:stretchMode="columnWidth"
android:columnWidth="75dp"
android:gravity="center"
android:layout_height="fill_parent">
</GridView>
<?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:numColumns="auto_fit"
android:stretchMode="columnWidth"
android:columnWidth="75dp"
android:gravity="center"
android:layout_height="fill_parent">
</GridView>
android九宫格子布局文件layout_gridview_item.xml
Java代码
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout android:id="@+id/relativeLayout1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
xmlns:android="http://schemas.android.com/apk/res/android">
<ImageView android:id="@+id/imageView_ItemImage"
android:layout_width="wrap_content"
android:src="@drawable/icon"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
>
</ImageView>
<TextView android:id="@+id/textView_ItemText"
android:text="TextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/imageView_ItemImage"
android:layout_centerHorizontal="true"
>
</TextView>
</RelativeLayout>
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout android:id="@+id/relativeLayout1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
xmlns:android="http://schemas.android.com/apk/res/android">
<ImageView android:id="@+id/imageView_ItemImage"
android:layout_width="wrap_content"
android:src="@drawable/icon"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
>
</ImageView>
<TextView android:id="@+id/textView_ItemText"
android:text="TextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/imageView_ItemImage"
android:layout_centerHorizontal="true"
>
</TextView>
</RelativeLayout>
android九宫格代码文件:
Java代码
package com.mixian.activity;
import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.widget.AdapterView;
import android.widget.AdapterView.OnItemClickListener;
import android.widget.GridView;
import android.widget.SimpleAdapter;
import android.widget.Toast;
public class GridLayoutActivity extends Activity {
/** Called when the activity is first created. */
private GridView _gridView1;
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
_gridView1 = (GridView) findViewById(R.id.gridView1);
List<HashMap<String, Object>> lst = new ArrayList<HashMap<String, Object>>();
for (int i = 0; i < 12; i++) {
HashMap<String, Object> map = new HashMap<String, Object>();
map.put("itemImage", R.drawable.icon);
map.put("itemText", "item" + i);
lst.add(map);
}
SimpleAdapter adpter = new SimpleAdapter(this, lst,
R.layout.layout_gridview_item, // 指定 子项的布局文件的ID
new String[] { "itemImage", "itemText" }, // 指定 数据的列
new int[] { R.id.imageView_ItemImage, R.id.textView_ItemText });// 指定数据的列对应到的
// 绑定的目标控件
_gridView1.setAdapter(adpter);
_gridView1.setOnItemClickListener(onclickcistener);
}
private OnItemClickListener onclickcistener = new OnItemClickListener() {
public void onItemClick(AdapterView<?> arg0, View arg1, int arg2,
long arg3) {
Object obj = _gridView1.getAdapter().getItem(arg2);
HashMap<String, Object> map = (HashMap<String, Object>) obj;
String str = (String) map.get("itemText");
Toast.makeText(getApplicationContext(), "" + str, 0).show();
}
};
}
先分析一下原理:
1:我们需要先定义一个主布局文件,宽度和列数用自适应的
android:numColumns="auto_fit"
android:stretchMode="columnWidth"
2:在定义一个子布局,子布局主要是控制九宫格每格的布局,例子是图文垂直布局。
3:在代码里面用SimpleAdapter将数据复制给布局文件,循环布局,就实现了九宫格
直接上代码:android九宫格主布局文件main.xml
Java代码
<?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:numColumns="auto_fit"
android:stretchMode="columnWidth"
android:columnWidth="75dp"
android:gravity="center"
android:layout_height="fill_parent">
</GridView>
<?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:numColumns="auto_fit"
android:stretchMode="columnWidth"
android:columnWidth="75dp"
android:gravity="center"
android:layout_height="fill_parent">
</GridView>
android九宫格子布局文件layout_gridview_item.xml
Java代码
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout android:id="@+id/relativeLayout1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
xmlns:android="http://schemas.android.com/apk/res/android">
<ImageView android:id="@+id/imageView_ItemImage"
android:layout_width="wrap_content"
android:src="@drawable/icon"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
>
</ImageView>
<TextView android:id="@+id/textView_ItemText"
android:text="TextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/imageView_ItemImage"
android:layout_centerHorizontal="true"
>
</TextView>
</RelativeLayout>
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout android:id="@+id/relativeLayout1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
xmlns:android="http://schemas.android.com/apk/res/android">
<ImageView android:id="@+id/imageView_ItemImage"
android:layout_width="wrap_content"
android:src="@drawable/icon"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
>
</ImageView>
<TextView android:id="@+id/textView_ItemText"
android:text="TextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/imageView_ItemImage"
android:layout_centerHorizontal="true"
>
</TextView>
</RelativeLayout>
android九宫格代码文件:
Java代码
package com.mixian.activity;
import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.widget.AdapterView;
import android.widget.AdapterView.OnItemClickListener;
import android.widget.GridView;
import android.widget.SimpleAdapter;
import android.widget.Toast;
public class GridLayoutActivity extends Activity {
/** Called when the activity is first created. */
private GridView _gridView1;
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
_gridView1 = (GridView) findViewById(R.id.gridView1);
List<HashMap<String, Object>> lst = new ArrayList<HashMap<String, Object>>();
for (int i = 0; i < 12; i++) {
HashMap<String, Object> map = new HashMap<String, Object>();
map.put("itemImage", R.drawable.icon);
map.put("itemText", "item" + i);
lst.add(map);
}
SimpleAdapter adpter = new SimpleAdapter(this, lst,
R.layout.layout_gridview_item, // 指定 子项的布局文件的ID
new String[] { "itemImage", "itemText" }, // 指定 数据的列
new int[] { R.id.imageView_ItemImage, R.id.textView_ItemText });// 指定数据的列对应到的
// 绑定的目标控件
_gridView1.setAdapter(adpter);
_gridView1.setOnItemClickListener(onclickcistener);
}
private OnItemClickListener onclickcistener = new OnItemClickListener() {
public void onItemClick(AdapterView<?> arg0, View arg1, int arg2,
long arg3) {
Object obj = _gridView1.getAdapter().getItem(arg2);
HashMap<String, Object> map = (HashMap<String, Object>) obj;
String str = (String) map.get("itemText");
Toast.makeText(getApplicationContext(), "" + str, 0).show();
}
};
}