In Android programming, GridView and ListView are both commonly used multi-control layouts, and GridView is the first choice to implement the Nine Palaces Diagram! This article introduces how to use GridView to implement the Nine Palaces Diagram. GridView has many uses. The most commonly introduced method on the Internet is to implement an ImageAdapter to inherit BaseAdapter and then use it for GridView. Methods like this will not be repeated in this article. The usage of GridView introduced in this article is very similar to the ListView introduced before.
Let’s first take a look at the results of running this article’s code:
This article needs to add/modify 3 files: main.xml, night_item.xml, and JAVA source code.
The main.xml source code is as follows, it is a GirdView, used to load Items:
<?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"/>
Here is a brief introduction to some of the properties:
android:numColumns="auto_fit", the number of columns of GridView is set to automatic
android:columnWidth="90dp", the width of each column, which is the width of the Item
android:stretchMode="columnWidth", scaling is synchronized with column width size
android:verticalSpacing="10dp", the margin between two rows, for example: the spacing between row one (NO.0~NO.2) and row two (NO.3~NO.5) is 10dp
android:horizontalSpacing="10dp", the margin between two columns.
Next, we introduce night_item.xml. This XML is very similar to the ImageItem.xml of the previous ListView:
<?xml version="1.0" encoding="utf-8"?><RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_height="wrap_content" android:paddingBottom ="4dip" android:layout_width="fill_parent"> <ImageView android:layout_height="wrap_content" android:id="@+id/ItemImage" android:layout_width="wrap_content" android:layout_centerHorizontal="true"> </ImageView> <TextView android:layout_width="wrap_content" android:layout_below="@+id/ItemImage" android:layout_height="wrap_content" android:text="TextView01" android:layout_centerHorizontal="true" android:id="@+id/ItemText"> </TextView></RelativeLayout>
Finally, there is the JAVA source code, which is very similar to the previous ListView JAVA source code, but with more "selected" event handling:
public void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.main);GridView gridview = (GridView) findViewById(R.id.gridview);//Generate a dynamic array and transfer it to the data ArrayList <HashMap<String, Object>> lstImageItem = new ArrayList<HashMap<String, Object>>();for(int i=0;i<10;i++){ HashMap<String, Object> map = new HashMap<String, Object>(); map.put("ItemImage", R.drawable. icon);//Add the ID of the image resource map.put("ItemText", "NO."+String.valueOf(i));//Make ItemText according to the serial number lstImageItem.add(map);}//Generate the adapter's ImageItem <====> elements of the dynamic array, the two correspond one-to-one SimpleAdapter saImageItems = new SimpleAdapter(this, //No explanation lstImageItem,//Data source R. layout.night_item,//XML implementation of night_item//Dynamic array and sub-item corresponding to ImageItem new String[] {"ItemImage","ItemText"}, //One ImageView and two TextView IDs in the ImageItem XML file new int[] {R.id.ItemImage,R.id.ItemText});//Add and display the gridview .setAdapter(saImageItems);//Add message processing gridview.setOnItemClickListener(new ItemClickListener());}//When the AdapterView is clicked (touch screen or keyboard), the returned Item click event class ItemClickListener implements OnItemClickListener{ public void onItemClick(AdapterView<?> arg0,//The AdapterView where the click happened View arg1,//The view within the AdapterView that was clicked int arg2,//The position of the view in the adapter long arg3//The row id of the item that was clicked ) { //In this case arg2=arg3 HashMap<String, Object> item=(HashMap<String, Object>) arg0.getItemAtPosition(arg2); //Display all Select Item's ItemText setTitle((String)item.get("ItemText")); }}