Android layout - GridView

Android UI 的布局可用网格的方式, 采用 GridView 控件, 首先定义它的 xml 文件:

 

AndroidManifest.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:numColumns="auto_fit" android:verticalSpacing="10dp" android:horizontalSpacing="10dp" android:columnWidth="90dp" android:stretchMode="columnWidth" android:gravity="center" />  

 

以 GridView 当作 tag 头, 以下实现一段小程序: 在主画面呈现 10 个项目选单, 当点击则进入项目执行的页面, 可点击 "Return" Button, 回到主页面, 此时 主页面可跟据子页面的返回值对主页面相对应的项目作背景色的描绘.

 

GridView 下属物件的填充, 需用到 Adapter, Adapter 有好几种, 常用的有 SimpleAdapter, ArrayAdapter, 但如果要自定义下属物件, 则需使用 BaseAdapter, 我们直接使用 BaseAdapter 来创建. 为了方便起见, 将 TextView 当作 GridView 的每一个下属物件, 既 GridView 为这些 TextView 的集合.

 

private class MyAdapter extends BaseAdapter { private Context mContext; private String arrStrings[] = getResources().getStringArray(R.array.itemlist); public MyAdapter(Context c) { mContext = c; } public int getCount() { return arrStrings.length; } public Object getItem(int position) { return position; } @Override public long getItemId(int position) { return position; } @Override public View getView(int position, View convertView, ViewGroup parent) { if (convertView == null) { TextView tv = new TextView(mContext); tv.setText(arrStrings[position]); return tv; } else { return convertView; } } } 

 

使用 xml 来定义项目的名称(strings.xml)及要变化的颜色(color.xml)

 

strings.xml

 

<?xml version="1.0" encoding="utf-8"?> <resources> <string name="hello">Hello World, HelloGrid!</string> <string name="app_name">HelloGrid</string> <string-array name="itemlist"> <item>01)项目一</item> <item>02)项目二</item> <item>03)项目三</item> <item>04)项目四</item> <item>05)项目五</item> <item>06)项目六</item> <item>07)项目七</item> <item>08)项目八</item> <item>09)项目九</item> <item>10)项目十</item> </string-array> </resources>  

 

color.xml

 

<?xml version="1.0" encoding="utf-8"?> <resources> <drawable name="blue" >#0000FF</drawable> <drawable name="green">#00FF00</drawable> <drawable name="red" >#FF0000</drawable> </resources> 

 

子页面的 layout : item.xml

 

<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="fill_parent" android:layout_height="fill_parent" > <TextView android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="@string/hello" /> <TextView android:id="@+id/txt" android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="" /> <Button android:id="@+id/btn" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text=""> <requestFocus /> </Button> </LinearLayout> 

 

子页面的代码 SubItem.java

 

package sdt.grid.test; import android.app.Activity; import android.content.Intent; import android.os.Bundle; import android.view.View; import android.widget.Button; import android.widget.TextView; public class SubItem extends Activity { Intent intent; @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); this.setContentView(R.layout.item); intent = this.getIntent(); //Bundle bundle = intent.getExtras(); TextView txt = (TextView) this.findViewById(R.id.txt); txt.setText("Activity A/n"); Button btn = (Button) this.findViewById(R.id.btn); btn.setText("Return"); btn.setOnClickListener(new Button.OnClickListener() { public void onClick(View v) { SubItem.this.setResult(Activity.RESULT_OK, intent); SubItem.this.finish(); } }); } } 

 

主页面取得被点击的 item 并作相对应的背景色变化(蓝色)

 

class ItemClickListener implements OnItemClickListener { public void onItemClick(AdapterView<?> arg0, View arg1, int arg2, long arg3) { clickeditem = arg2; Resources res = getBaseContext().getResources(); Drawable dw = res.getDrawable(R.drawable.blue); arg1.setBackgroundDrawable(dw); Intent intent = new Intent(); switch (arg2) { case 0: setTitle("Activity A/n"); intent.setClass(HelloGrid.this, SubItem.class); break; case 1: setTitle("Activity B/n"); intent.setClass(HelloGrid.this, SubItem.class); break; } startActivity(intent); } } 

 

以及从子页面再回到主画面相应的背景色呈现(绿色)

 

public void onResume() { super.onResume(); if (oncreated == 1) { Resources res = getBaseContext().getResources(); Drawable dw = res.getDrawable(R.drawable.green); try { gridview.getChildAt(clickeditem).setBackgroundDrawable(dw); } catch (Exception e) { Log.e("Exception", "onResume", e); } } } 

 

HelloGrid 的完整代码: HelloGrid.java

 

package sdt.grid.test; import android.app.Activity; import android.content.res.Resources; import android.os.Bundle; import android.widget.GridView; import android.widget.BaseAdapter; import android.widget.SimpleAdapter; import android.widget.AdapterView.OnItemClickListener; import android.widget.AdapterView; import android.view.View; import android.graphics.drawable.Drawable; import android.content.Intent; import android.view.ViewGroup; import android.widget.TextView; import android.util.Log; import android.content.Context; public class HelloGrid extends Activity { /** Called when the activity is first created. */ protected GridView gridview; protected SimpleAdapter saImageItem; protected MyAdapter adapter; protected int clickeditem = 0; protected int oncreated = 0; @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.main); gridview = (GridView) findViewById(R.id.gridview); gridview.setAdapter(new MyAdapter(this)); gridview.setOnItemClickListener(new ItemClickListener()); oncreated = 1; } private class MyAdapter extends BaseAdapter { private Context mContext; private String arrStrings[] = getResources().getStringArray(R.array.itemlist); public MyAdapter(Context c) { mContext = c; } public int getCount() { return arrStrings.length; } public Object getItem(int position) { return position; } @Override public long getItemId(int position) { return position; } @Override public View getView(int position, View convertView, ViewGroup parent) { if (convertView == null) { TextView tv = new TextView(mContext); tv.setText(arrStrings[position]); return tv; } else { return convertView; } } } class ItemClickListener implements OnItemClickListener { public void onItemClick(AdapterView<?> arg0, View arg1, int arg2, long arg3) { clickeditem = arg2; Resources res = getBaseContext().getResources(); Drawable dw = res.getDrawable(R.drawable.blue); arg1.setBackgroundDrawable(dw); Intent intent = new Intent(); switch (arg2) { case 0: setTitle("Activity A/n"); intent.setClass(HelloGrid.this, SubItem.class); break; case 1: setTitle("Activity B/n"); intent.setClass(HelloGrid.this, SubItem.class); break; } startActivity(intent); } } @Override public void onResume() { super.onResume(); if (oncreated == 1) { Resources res = getBaseContext().getResources(); Drawable dw = res.getDrawable(R.drawable.green); try { gridview.getChildAt(clickeditem).setBackgroundDrawable(dw); } catch (Exception e) { Log.e("Exception", "onResume", e); } } } } 

 

呈现效果:

 

1. 主页面

 

 

2. 点击后的变化:

 

 

3. 跳转到子页面

 

 

4. 点击 "Return" 回到主页面