Trường ĐH Khoa Học Tự Nhiên Tp. Hồ Chí Minh
TRUNG TÂM TIN HỌC
Lập trình Android
Bài 3: ListView. Tạo Custom Layout cho ListView
Ngành Mạng & Thiết bị di động
www.t3h.vn
2015
Nội dung
I.
ListView
1. ListView là gì?
2. Các bước thực hiện để sử dụng một ListView
3. Các xử lý trên ListView
II.
Tạo Custom Layout cho ListView
Lập trình Android
2
1. ListView là gì?
ListView là một dạng điều
khiển nâng cao có chức
năng hỗ trợ hiển thị dữ
liệu theo dạng từng dịng.
Lập trình Android
3
2. Các bước thực hiện để sử dụng ListView
Bước 1: Đưa dữ liệu cần hiển thị lên ListView vào một mảng
hoặc danh sách (ArrayList, mảng thông thường, mảng đối
tượng,…).
Bước 2: Tạo một ListView trên giao diện.
Bước 3: Tạo một đối tượng ArrayAdapter để liên kết giữ
ListView và mảng hoặc danh sách dữ liệu.
ArrayAdapter là gì?
ArrayAdapter được hiểu như cái modem mạng. Nó giúp
ListView có thể “đọc và hiểu” dữ liệu từ mảng dữ liệu để
hiện lên giao diện.
Lập trình Android
4
3. Các xử lý trên ListView
Lấy ListView thông qua Id của ListView
ListView lvTenLV = (ListView) findViewById(R.id.idcuaListView);
Tạo ArrayAdapter
ArrayAdapter<[Kiểu mảng]>[Tên mảng adapter];
Đưa dữ liệu từ mảng vào ArrayAdapter
[Tên mảng adapter] = new ArrayAdapter<Kiểu mảng>
(this,android.R.layout.simple_list_item_1,[tenMangDuLieu]);
Cách đổ dữ liệu lên ListView
lvTenLV.setAdapter(tenMangAdapter);
Lập trình Android
5
Nội dung
I.
ListView
II. Tạo Custom Layout cho ListView
1. Custom Layout là gì? Tại sao phải tạo Custom Layout?
2. Cách sử dụng ImageView
3. Các bước thực hiện để tạo Custom Layout cho ListView
4. Hướng dẫn tạo lớp ArrayAdapter
Lập trình Android
6
2. Tại sao phải tạo Custom Layout?
Custom Layout là layout được tạo và tùy biến lại cho phù
hợp với yêu cầu sử dụng.
Minh họa sự khác nhau giữa ListView sử dụng layout bình
thường và ListView có layout đã được tùy biến:
Lập trình Android – Module 1
7
2. Cách sử dụng ImageView
Tạo giao diện sử dụng ImageView:
Chọn biểu tượng ImageView trong Palette → Images & Media →
ImageView.
Lấy ImageView đã tạo thơng qua Id của nó:
ImageView tenImageView=(ImageView)findViewById(R.id.idImageView);
Đưa hình ảnh vào ImageView:
tenImageView.setImageDrawable(R.drawable.tenHinh);
Chú ý: Ở đây, hình nằm trong thư mục res/drawable. Tên hình phải
viết liền và chữ đầu tiên phải là chữ thường.
Lập trình Android
8
3. Các bước tạo và sử dụng Custom Layout
Sau khi đã có ListView trên giao diện, chúng ta có thể tạo
Custom Layout cho ListView như sau:
Bước 1: Tạo thêm một layout cho một item của ListView.
Bước
2:
Tạo
lớp
Custom Adapter
kế
thừa
từ
lớp
ArrayAdapter.
Bước 3: Tạo một lớp dùng để quản lý dữ liệu.
Bước 4: Hiển thị dữ liệu lên ListView.
Lập trình Android
9
4. Lớp Custom ArrayAdapter
Lớp Custom ArrayAdapter kế thừa từ lớp ArrayAdapter
public class CustomAdapter extends ArrayAdapter<[Kiểu mảng]>{
public CustomAdapter(Context context, int resource,
ArrayList<[Kiểu mảng]> objects) {
super(context, resource, objects);
}
}
Lập trình Android
10
4. Lớp Custom ArrayAdapter
Phương thức getView()
@Override
public View getView(int position, View convertView, ViewGroup parent){
View view = null;
LayoutInflater inflater = (LayoutInflater) context.getSystemService
(Context.LAYOUT_INFLATER_SERVICE);
view = inflater.inflate(resId, null);
//Lấy các điều khiển
...........
//Lấy nội dung cần hiển thị ở vị trí thứ position
[Kiểu mảng] c = tenMang.get(position);
if (c != null) {
//Đưa thông tin lên TextView và hình lên ImageView
textView.setText(c.getThongTin());
imageView.setImageResource(c.getImg_id());
}
return view;
}
Lập trình Android
11
4. Lớp Custom ArrayAdapter
Với các tham sớ:
position: là vị trí của phần tư trong danh sách.
convertView: dùng để lấy về các control của mỗi item.
parent: chính là datasource được truyền vào từ MainActivity.
Chú ý:
View là dạng tham chiếu đối tượng, nên mọi sự thay đổi của
các đối tượng bên trong View thì nó cũng biết sự thay đổi đó
trả về view này, tức là trả luôn về các thông số mới mà ta vừa
thay đổi.
Lập trình Android
12
Lập trình Android – Module 1
13