How to use GridView layout in android
So, lately I've been relearning android development and as I expected there were already a lot of changes since I last code in it (eclai...
https://www.czetsuyatech.com/2013/01/android-gridview-layout.html
So, lately I've been relearning android development and as I expected there were already a lot of changes since I last code in it (eclair). Like the concept of Fragment (which I love), unfortunately statistics show that most of the users are still using API 10 (Gingerbread), so I'm sticking with it :-).
What I would like to achieve right now is a menu using grid view, and here's how I code it.
1.) We need a MainActivity where we will load the GridView:
2.) The MenuAdapter, that will serve as the interface between the data (string array, db) and the view:
3.) The layouts/views: MainActivity
4.) And the resource: strings
What I would like to achieve right now is a menu using grid view, and here's how I code it.
1.) We need a MainActivity where we will load the GridView:
@Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); GridView menuGrid = (GridView) findViewById(R.id.menu); menuGrid.setAdapter(new MenuAdapter(this)); menuGrid.setOnItemClickListener(new OnItemClickListener() { public void onItemClick(AdapterView parent, View v, int position, long id) { Toast.makeText(MainActivity.this, "" + position, Toast.LENGTH_SHORT).show(); } }); }
2.) The MenuAdapter, that will serve as the interface between the data (string array, db) and the view:
public class MenuAdapter extends BaseAdapter { private Context context; private String[] labels; private int[] images = { R.drawable.menu_1, R.drawable.menu_2, R.drawable.menu_3, R.drawable.menu_4 }; public MenuAdapter(Context context) { this.context = context; this.labels = context.getResources().getStringArray(R.array.menu_items); } @Override public int getCount() { return this.labels.length; } @Override public Object getItem(int arg0) { return null; } @Override public long getItemId(int position) { return 0; } @Override public View getView(int position, View convertView, ViewGroup parent) { TextView textView = (TextView) convertView; if (textView == null) { textView = (TextView) View.inflate(context, R.layout.menu_item, null); } textView.setText(this.labels[position]); textView.setCompoundDrawablesWithIntrinsicBounds(0, images[position], 0, 0); return textView; } }
3.) The layouts/views: MainActivity
<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" tools:context=".MainActivity" > <include android:layout_width="fill_parent" android:layout_height="wrap_content" layout="@layout/menu" /> </RelativeLayout>Menu (Note that we use compound view (icon/text))
<?xml version="1.0" encoding="utf-8"?> <GridView xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/menu" android:layout_width="match_parent" android:layout_height="match_parent" android:layout_marginLeft="25dp" android:horizontalSpacing="5dp" android:numColumns="2" android:verticalSpacing="20dp" />MenuItem
<?xml version="1.0" encoding="utf-8"?> <TextView xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/menuItem" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center_horizontal" android:drawableTop="@drawable/icon" android:gravity="center_horizontal" android:text="@string/common_label" android:textColor="@color/menu_item" />
4.) And the resource: strings
<string-array name="menu_items"> <item>Menu 1</item> <item>Menu 2</item> <item>Menu 3</item> <item>Menu 4</item> </string-array>
1 comment
Thanks for taking time for sharing this article, it was excellent.
android application development
Post a Comment