GridView UI設計

原文:http://blog.csdn.net/xyz_lmn/article/details/6906255

GridView UI設計

一、實現步驟

(1)       完成佈局操作,在佈局的XML文件中,聲明兩個控件,一個ImageView和一個GridView控件,同時設置控件的屬性。

(2)       設置GridViewlistSelector屬性,該屬性文件在drawable實現listSelectorXM
L
文件,對控件的不同行爲使用Item選項進行處理。

(3)       在onCreate文件中創建ArrayList<HashMap<String,Object>>對象,使用該List對象創建SimpleAdapter對象。

(4)       把SimpleAdapter對象通過GridView.setAdapter()方法添加到GridView對象中

(5)       爲GridView設置監聽器,通過GridView.setOnItemClickListener()實現。

二、注意細節

(1)       R.string.xx 表示的該資源的索引,要是使用該String對象,要通過getResource().getString(R.string.xx)獲取。

(2)       this.requestWindowFeature(Window.FEATURE_NO_TITLE);去掉窗口的標題欄,在setContentView之前執行

(3)       this.getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN, WindowManager.LayoutParams.FLAG_FULLSCREEN); 在setContentView之前執行,設置標誌位,第一個參數是窗口的新標籤,第二個參數是設置那一個標籤修改實現全屏的功能,去掉提示欄 

主界面: 

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@drawable/bg" >

    <ImageView
        android:id="@+id/imageView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true"
        android:contentDescription="@string/top"
        android:src="@drawable/top" />

    <GridView
        android:id="@+id/gridView1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_below="@+id/imageView1"
        android:columnWidth="90dp"
        android:gravity="center"
        android:horizontalSpacing="10dp"
        android:listSelector="@drawable/grid_selector_background"
        android:numColumns="3"
        android:stretchMode="columnWidth"
        android:verticalSpacing="30dp" >

    </GridView>

</RelativeLayout>

List_item界面:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="90dp"
    android:layout_height="wrap_content"
    android:orientation="vertical" >
	
    <ImageView 
        android:id="@+id/itemImage"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        />
    <TextView 
        android:id="@+id/itemText"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center_horizontal"
        />
</LinearLayout>


主程序:

 

public class NineBoxDemo extends Activity {
	
	private GridView gridView;
	private ArrayList<HashMap<String, Object>> listItem;
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        //去掉窗口的標題欄,在setContentView之前執行
        this.requestWindowFeature(Window.FEATURE_NO_TITLE);
        //在setContentView之前執行,設置標誌位,第一個參數是窗口的新標籤,第二個參數是設置那一個標籤修改
        //實現全屏的功能,去掉提示欄
        this.getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN, WindowManager.LayoutParams.FLAG_FULLSCREEN);
        setContentView(R.layout.nineboxdemo);
        gridView = (GridView)findViewById(R.id.gridView1);
        listItem = new ArrayList<HashMap<String,Object>>();
        for (int i = 1; i < 10; i++) {
			HashMap<String, Object> map = new HashMap<String, Object>();
			if (i==1) {
				map.put("itemImage", R.drawable.g11);
				map.put("itemText", getResources().getString(R.string.gridView1));
			}
			if (i==2) {
				map.put("itemImage", R.drawable.g12);
				map.put("itemText", getResources().getString(R.string.gridView2));
			}
			if (i==3) {
				map.put("itemImage", R.drawable.g13);
				map.put("itemText", getResources().getString(R.string.gridView3));
			}
			if (i==4) {
				map.put("itemImage", R.drawable.g14);
				map.put("itemText", getResources().getString(R.string.gridView4));
			}
			if (i==5) {
				map.put("itemImage", R.drawable.g15);
				map.put("itemText", getResources().getString(R.string.gridView5));
			}
			if (i==6) {
				map.put("itemImage", R.drawable.g16);
				map.put("itemText", getResources().getString(R.string.gridView6));
			}
			if (i==7) {
				map.put("itemImage", R.drawable.g17);
				map.put("itemText", getResources().getString(R.string.gridView7));
			}
			if (i==8) {
				map.put("itemImage", R.drawable.g18);
				map.put("itemText", getResources().getString(R.string.gridView8));
			}
			if (i==9) {
				map.put("itemImage", R.drawable.g19);
				map.put("itemText", getResources().getString(R.string.gridView9));
			}
			listItem.add(map);
		}
        SimpleAdapter simpleAdapter = new SimpleAdapter(NineBoxDemo.this,
        								listItem, R.layout.list_item, new String[]{"itemImage","itemText"},
        								new int[]{R.id.itemImage,R.id.itemText});
        gridView.setAdapter(simpleAdapter);
        gridView.setOnItemClickListener(new ItemListener());
    }

    class ItemListener implements OnItemClickListener{

		@Override
		public void onItemClick(AdapterView<?> arg0, View arg1, int arg2,
				long arg3) {
			// TODO Auto-generated method stub
			@SuppressWarnings("unchecked")
			HashMap<String, Object> item = (HashMap<String, Object>)arg0.getItemAtPosition(arg2);
			String temp = (String) item.get("itemText");
			if (temp.equals(getResources().getString(R.string.gridView1))) {
				Toast.makeText(NineBoxDemo.this, temp, Toast.LENGTH_SHORT).show();
			}
			if (temp.equals(getResources().getString(R.string.gridView2))) {
				Toast.makeText(NineBoxDemo.this, temp, Toast.LENGTH_SHORT).show();
			}
			if (temp.equals(getResources().getString(R.string.gridView3))) {
				Toast.makeText(NineBoxDemo.this, temp, Toast.LENGTH_SHORT).show();
			}
			if (temp.equals(getResources().getString(R.string.gridView4))) {
				Toast.makeText(NineBoxDemo.this, temp, Toast.LENGTH_SHORT).show();
			}
			if (temp.equals(getResources().getString(R.string.gridView5))) {
				Toast.makeText(NineBoxDemo.this, temp, Toast.LENGTH_SHORT).show();
			}
			if (temp.equals(getResources().getString(R.string.gridView6))) {
				Toast.makeText(NineBoxDemo.this, temp, Toast.LENGTH_SHORT).show();
			}
			if (temp.equals(getResources().getString(R.string.gridView7))) {
				Toast.makeText(NineBoxDemo.this, temp, Toast.LENGTH_SHORT).show();
			}
			if (temp.equals(getResources().getString(R.string.gridView8))) {
				Toast.makeText(NineBoxDemo.this, temp, Toast.LENGTH_SHORT).show();
			}
			if (temp.equals(getResources().getString(R.string.gridView9))) {
				Toast.makeText(NineBoxDemo.this, temp, Toast.LENGTH_SHORT).show();
			}
		}
    	
    }
    
    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        getMenuInflater().inflate(R.menu.nineboxdemo, menu);
        return true;
    }

    
}



 

    

 工程文件:http://download.csdn.net/detail/zhaoshiqing7/4483846

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章