Tuesday, June 23, 2015

List View - Custom Adapter

9:16 PM By No comments

Ở bài tập này mình chia sẽ với các bạn 1 cách sử dụng Listview với Custom Adapter do chính các bạn tạo ra, không sử dụng adapter có sẵn trong android.

+ Kết thúc bài tập này các bạn sẽ hiểu được nguyên lý của Custom Adapter
Minh họa kết quả của bài tập này :

+ Mô hình bài tập :

+ Source code bên dưới:

Các bạn xem Video tại đây:



1. Tạo project mới và kéo control listview vào layout . Mình đặt id cho Listview của mình là listView_phuongtien, các bạn muốn đặt id là gì cũng được


2. Tạo 1 class mới tên là "PhuongTien"


3. Trong class "PhuongTien" này sẽ có :
     + Hình : hình ảnh có kiểu dữ liệu là integer, nên khi khai báo biến sử dụng kiểu dữ liệu là int
     + Tên  : kiểu String.
     + Giá Tiền : kiểu int.
     + Click chuột phải vào khoảng trắng bên dưới, chọn Generate --> Constructor


    + Chọn tất cả phần tử bên trong rồi click Ok

  
  + Sau khi click Ok, mình sẽ có hàm như hình bên dưới
    
 4. Right Click lên "app" chọn "blank activity" như hình :


+ Đặt tên cho activity này là "DongPhuongTien" ,các tùy chỉnh còn lại các bạn cứ để mặc định nhé, chọn Finish .


+ Sau đó android studio sẽ tạo cho mình 2 file :
   1 là DongPhuongTien.java : file này các bạn tắt đi vì chưa sử dụng tới trong bài này.
   2 là activity_dong_phuong_tien.xml : file này dùng để hiện thị dữ liệu. Khi vừa tạo xong file này mà không hiện ra hình cái điện thoại chỉ có màn hình trắng như hình bên dưới


+ Thì các bạn click vào App theme và chọn một trong những theme có sẵn click Ok sẽ hiện ra hình cái điện thoại, sau đó mình sẽ tiến hành thiết kế giao diện cho từng dòng sẽ xuất hiện trên listview


5. Ở layout activity_dong_phuong_tien.xml mình sẽ thiết kế giao diện để hiện thị trên listview như sau :
  + Kéo thả các control : Image_View và textView vào layout. Bên dưới là giao diện của mình

  + Các bạn nhớ đặt Id lại cho để quản lý
  + Các id của mình trong  layout activity_dong_phuong_tien.xml: 
       + imageView_hinh
       + textView_ten
       + textView_giatien
Lưu ý: Các id trên sẽ không khai báo và sử dụng trong file DongPhuongTien.java

6. Tạo Class mới có tên là "PhuongTienAdapter" và extends từ ArrayAdapter có kiểu dữ liệu là PhuongTien. 


+ Xong các bạn vẫn thấy báo lổi như hình do thiếu hàm tạo . Các bạn click chuột vào "PhuongTienAdapter" và nhấn tổ hợp phím " ATL+ENTER". Chọn dòng " Create constructor matching super ". Xuất hiện hình

+ Chọn tiếp 2 dòng đầu tiên Click OK


+ Các bạn gõ tiếp đoạn code bên dưới vào 



+ Như vậy đã tạo xong Custom Adapter cho bài này, bây giờ quay về MainActivity.java

7. Kéo thả hình vào folder Drawable .


+ Thêm code vào như hình bên dưới :


+ Run và kiểm tra kết quả :


+ Source code :
https://www.fshare.vn/file/7VM8Z1V3I1B7



0 comments:

Post a Comment