Tùy biến (Custom) lại ArrayAdapter
Thông thường ở chế độ mặc định các item (hay các dòng) trong ListView chỉ hiển thị các dòng text. Để tùy biến các item của ListView trông đẹp hơn, lập trình viên có thể thêm các biểu tượng (icon), checkbox hoặc bất cứ cái gì vào item. Đơn giản chỉ là cung cấp dữ liệu cho adapter để tạo ra tập các đối tượng hiển thị (view objects) cho mỗi item.
Tùy biến ArrayAdapter
Ví dụ sau chúng ta có lớp MyAdapter kế thừa lớp ArrayAdapter
public class MyAdapter extends ArrayAdapter { public MyAdapter(Context context, int resource, int textViewResourceId, List objects) { super(context, resource, textViewResourceId, objects); } @Override public int getCount() { return super.getCount(); } @Override public View getView(int position, View convertView, ViewGroup parent) { return super.getView(position, convertView, parent); } } Trong ví dụ trên chúng ta ghi đè (override) các phương thức BaseAdapter thường được sử dụng trong ListView, GridView, Spinner
1. getCount(): Phương thức này trả về số dòng của List
@Override public int getCount() { int count=arrayList.size(); //counts the total number of elements from the arrayList. return count;//returns the total count to adapter } 2. getView(int i, View view, ViewGroup viewGroup): Phương thức này được gọi tự động các mục danh sách để sẵn sàng hiển thị. Trong phương thức chúng ta thiết lập layout cho danh sách các mục bằng cách sử dụng lớp LayoutInflater và sau đó thêm dữ liệu cho các view: ImageView, TextView .v.v.
@Override public View getView(int i, View view, ViewGroup viewGroup) { view = inflter.inflate(R.layout.activity_list_view, null);//set layout for displaying items ImageView icon = (ImageView) view.findViewById(R.id.icon);//get id for image view icon.setImageResource(countryFlags[i]);//set image of the item's return view; } Ví dụ: Trong ví dụ này chúng ta sẽ làm ứng dụng gồm có một ListView. Tiếp theo, chúng ta tạo đối tượng dữ liệu và kết nối ListView thông qua đối tượng MyAdapter. Tiến hành tạo project, vào thư mục res /layout -> activity_main.xml thiết kế giao diện sau:
Bước 1: Tạo một project tên là CustomArrayAdapter: File->New->Android Application Project điền các thông tin ->Next ->Finish
Bước 2: Mở res -> layout -> xml (hoặc) activity_main.xml và thêm code trong Relaytive Layout.
<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:paddingBottom="@dimen/activity_vertical_margin" android:paddingLeft="@dimen/activity_horizontal_margin" android:paddingRight="@dimen/activity_horizontal_margin" android:paddingTop="@dimen/activity_vertical_margin" tools:context="com.example.customarrayadapter.MainActivity" > <ListView android:id="@+id/simpleListView" android:layout_width="match_parent" android:layout_height="wrap_content" android:divider="#000" android:dividerHeight="2dp"/> </RelativeLayout> Bước 3: Tạo Layout mới trong thư mục res-> layout và đặt tên list_view_items.xml. Thêm vào 2 widget ImageView, TextView sẽ được hiển thị từng dòng trong ListView:
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="horizontal"> <ImageView android:id="@+id/imageView" android:layout_width="50dp" android:layout_height="50dp" android:padding="5dp" android:src="@drawable/ic_launcher" /> <TextView android:id="@+id/textView" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_gravity="center" android:padding="@dimen/activity_horizontal_margin" android:text="Demo" android:textColor="#000" /> </LinearLayout> Bước 4: Tạo một lớp mới trong thư mục app -> java ->package->MyAdapter.java và thêm code sau.
package com.example.customarrayadapter; import java.util.ArrayList; import java.util.List; import android.content.Context; import android.view.LayoutInflater; import android.view.View; import android.view.ViewGroup; import android.widget.ArrayAdapter; import android.widget.ImageView; import android.widget.TextView; public class MyAdapter extends ArrayAdapter<Item>{ ArrayList<Item> animalList = new ArrayList<Item>(); public MyAdapter(Context context, int resource, ArrayList<Item> objects) { super(context, resource, objects); // TODO Auto-generated constructor stub animalList = objects; } @Override public int getCount() { // TODO Auto-generated method stub return super.getCount(); } @Override public View getView(int position, View convertView, ViewGroup parent) { // TODO Auto-generated method stub View v = convertView; LayoutInflater inflater = (LayoutInflater) getContext().getSystemService(Context.LAYOUT_INFLATER_SERVICE); v = inflater.inflate(R.layout.list_view_items, null); TextView textView = (TextView) v.findViewById(R.id.textView); ImageView imageView = (ImageView) v.findViewById(R.id.imageView); textView.setText(animalList.get(position).getAnimalName()); imageView.setImageResource(animalList.get(position).getAnimalImage()); return v; } } Bước 4: Tạo một lớp mới trong thư mục app -> java ->package->Item.java và thêm code sau.
package com.example.customarrayadapter; public class Item { String animalName; int animalImage; public Item(String animalName, int animalImage) { super(); this.animalName = animalName; this.animalImage = animalImage; } public String getAnimalName() { return animalName; } public void setAnimalName(String animalName) { this.animalName = animalName; } public int getAnimalImage() { return animalImage; } public void setAnimalImage(int animalImage) { this.animalImage = animalImage; } } Bước 5: Mở src -> package -> MainActivity.java
Trong bước này chúng ta khởi tạo ListView. Tiếp theo, chúng ta tạo đối tượng dữ liệu và kết nối ListView thông qua đối tượng MyAdapter.
package com.example.customarrayadapter; import java.util.ArrayList; import android.app.Activity; import android.os.Bundle; import android.view.Menu; import android.view.MenuItem; import android.widget.ListView; public class MainActivity extends Activity { ListView simpleList; ArrayList<Item> animalList=new ArrayList<Item>(); @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); simpleList = (ListView) findViewById(R.id.simpleListView); animalList.add(new Item("Lion",R.drawable.lion)); animalList.add(new Item("Tiger",R.drawable.tiger)); animalList.add(new Item("Monkey",R.drawable.monkey)); animalList.add(new Item("Elephant",R.drawable.elephant)); animalList.add(new Item("Dog",R.drawable.dog)); animalList.add(new Item("Cat",R.drawable.cat)); MyAdapter myAdapter=new MyAdapter(this,R.layout.list_view_items,animalList); simpleList.setAdapter(myAdapter); } } Ứng dụng này được phát triển bởi adt bundle, android 4.2 sử dụng minimum sdk 11 and target sdk 21.
Kết quả khi chạy ứng dụng
Cập nhật công nghệ từ Youtube tại link: https://www.youtube.com/channel/UCOxeYcvZPGf-mGLYSl_1LuA/videos
Để tham gia khóa học công nghệ truy cập link: http://thuvien.hocviendaotao.com
Mọi hỗ trợ về công nghệ email: dinhanhtuan68@gmail.com
