Đang tải... (xem toàn văn)
Trong các bài tập trước các bạn đã được làm quen với nhiều control cơ bản, bài tập này bạn sẽ được làm quen với control nâng cao, cụ thể là ListView. Trong ứng dụng cần lưu trữ và hiển thị danh sách các thông tin đa phần chúng ta sài control ListView. Hiện tại bạn chỉ cần biết sử dụng ListView có sẵn của Android là được rồi, trong các bài tập tiếp theo Tôi sẽ hướng dẫn các bạn Custom Layout lại ListView (tự làm mới ListView theo ý mình). Bài tập này Tôi sẽ cung cấp nhiều cách hành xử với ListView, ứng với mỗi cách là có các ví dụ mẫu khác nhau, vì vậy các bạn nên cố gắng theo dõi và thực hành lại những ví dụ. Bạn hãy thực hành tốt 5 trường hợp Tôi trình bày dưới đây: 1) Trường hợp 1: Sử dụng ListView control với mảng dữ liệu định sẵn. Trường hợp này Tôi đưa ra một ví dụ đơn giản là cho phép hiển thị mảng dữ liệu lên trên ListView, bạn xem hình minh họa: Giao diện trên có 2 control: +ListView : dùng để hiển thị mảng dữ liệu +TextView có màu xanh lục: Dùng để hiển thị vị trí và giá trị của phần tử được chọn trong ListView Bạn tạo một Android Project tên là : Vidu_ListView_HardCode_Array, chọn layout phù hợp và kéo thả các control vào giao diện: Dưới đây là nội dung của activity_main.xml: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 Đặt id cho Listview là lvperson (nhìn dòng lệnh 15 ở trên), bạn có thể định dạng thêm một số đặc tính khác nhưng trong bài tập này thì chưa cần thiết, chỉ cần hiển thị được dữ liệu lên giao diện là đã đạt yêu cầu. Bây giờ bạn mở MainActivity.java lên để viết code: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 packagetranduythanh.com; importandroid.os.Bundle; importandroid.app.Activity; importandroid.view.View; importandroid.widget.AdapterView; importandroid.widget.ArrayAdapter; importandroid.widget.ListView; importandroid.widget.TextView; publicclassMainActivity extendsActivity { protectedvoidonCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); 1. Khởi tạo dữ liệu cho mảng arr (còn gọi là data source) final String arr={Teo,Ty,Bin,Bo}; 2. Lấy đối tượng Listview dựa vào id ListView lv=(ListView) findViewById(R.id.lvperson); 3. Gán Data source vào ArrayAdapter ArrayAdapteradapter=newArrayAdapter (this, android.R.layout.simple_list_item_1, arr); 4. Đưa Data source vào ListView lv.setAdapter(adapter); finalTextView txt=(TextView) findViewById(R.id.txtselection); 5. Thiết lập sự kiện cho Listview, khi chọn phần tử nào thì hiển thị lên TextView lv.setOnItemClickListener( newAdapterView.OnItemClickListener() { public void onItemClick(AdapterView arg0, View arg1, intarg2, longarg3) { đối số arg2 là vị trí phần tử trong Data Source (arr) txt.setText(position :+arg2+ ; value =+arrarg2); } }); } } Tôi đã giải thích từng dòng lệnh ở bên trong code, giờ Tôi giải thích thêm về ArrayAdapter, bạn nhìn vào dòng lệnh 21.
Bài tập 13: Thực hành ListView Android Trong tập trước bạn làm quen với nhiều control bản, tập bạn làm quen với control nâng cao, cụ thể ListView Trong ứng dụng cần lưu trữ hiển thị danh sách thông tin đa phần sài control ListView Hiện bạn cần biết sử dụng ListView có sẵn Android rồi, tập Tôi hướng dẫn bạn Custom Layout lại ListView (tự làm ListView theo ý mình) - Bài tập Tôi cung cấp nhiều cách hành xử với ListView, ứng với cách có ví dụ mẫu khác nhau, bạn nên cố gắng theo dõi thực hành lại ví dụ - Bạn thực hành tốt trường hợp Tôi trình bày đây: 1) Trường hợp 1:- Sử dụng ListView control với mảng liệu định sẵn -Trường hợp Tôi đưa ví dụ đơn giản cho phép hiển thị mảng liệu lên ListView, bạn xem hình minh họa: - Giao diện có control: +ListView : dùng để hiển thị mảng liệu +TextView có màu xanh lục: Dùng để hiển thị vị trí giá trị phần tử chọn ListView - Bạn tạo Android Project tên : Vidu_ListView_HardCode_Array, chọn layout phù hợp kéo thả control vào giao diện: Dưới nội dung activity_main.xml: -Đặt id cho Listview lvperson (nhìn dòng lệnh 15 trên), bạn định dạng thêm số đặc tính khác tập chưa cần thiết, cần hiển thị liệu lên giao diện đạt yêu cầu - Bây bạn mở MainActivity.java lên để viết code: packagetranduythanh.com; importandroid.os.Bundle; importandroid.app.Activity; importandroid.view.View; importandroid.widget.AdapterView; importandroid.widget.ArrayAdapter; importandroid.widget.ListView; importandroid.widget.TextView; publicclassMainActivity extendsActivity { protectedvoidonCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); //1 Khởi tạo liệu cho mảng arr (còn gọi data source) 11 final String arr[]={"Teo","Ty","Bin","Bo"}; //2 Lấy đối tượng Listview dựa vào id ListView lv=(ListView) findViewById(R.id.lvperson); //3 Gán Data source vào ArrayAdapter ArrayAdapteradapter=newArrayAdapter (this, android.R.layout.simple_list_item_1, arr); //4 Đưa Data source vào ListView lv.setAdapter(adapter); finalTextView txt=(TextView) findViewById(R.id.txtselection); //5 Thiết lập kiện cho Listview, chọn phần tử hiển thị lên TextView lv.setOnItemClickListener( newAdapterView.OnItemClickListener() { public void onItemClick(AdapterView arg0, View arg1, intarg2, longarg3) { //đối số arg2 vị trí phần tử Data Source (arr) txt.setText("position :"+arg2+" ; value ="+arr[arg2]); } }); } } - Tôi giải thích dòng lệnh bên code, Tôi giải thích thêm ArrayAdapter, bạn nhìn vào dòng lệnh 21 ArrayAdapteradapter=newArrayAdapter(this, android.R.layout.simple_list_item_1, arr); - Dữ liệu từ Data source (arr) gắn vào ArrayAdapter, ArrayAdapter gắn vào ListView - Bạn nhìn vào đối số constructor ArrayAdapter : this, context Activity tại, bạn viết MainActivity.this (nếu bạn viết vị trí hiểu context MainActivity, bạn nên viết để bạn copy paste tới vị trí hiểu) - Đối số thứ android.R.layout.simple_list_item_1 : bạn để ý android Tôi tô màu xanh, layout Listview mà Android xây dựng sẵn, tập ta tự xây dựng mà không sử dụng có sẵn Như simple_list_item_1 lưu đâu? bên nào? Nó lưu SDK/platforms/android-api (x)/data/res/layout/simple_list_item_1.xml Bạn xem nội dung vị trí layout cách nhanh chóng đè phím Ctrl + click chuột vào dòng lệnh này, bạn thấy bên dưới: - Đối số thứ 3: arr (data source), bạn truyền vào ArrayList hay mảng - Nhìn vào dòng lệnh 27 chỗ gán kiện cho ListView (bạn nhớ cần gõ vài ký tự đầu nhấn Ctrl+ Space Bar lệnh đằng sau tự động xuất cho bạn): + Ta có interface AdapterView.OnItemClickListener, dùng để thiết lập kiện cho ListView, interface có phương thức trừu tượng onItemClick nên ta override xử lý Bạn nhớ chỗ gõ tay mà cần nhấn tổ hợp phím Ctrl + chọn add unimplement method tự xuất Ngoài nhiều kiện khác bạn tự tìm hiểu thêm 3) Trường hợp 3: Sử dụng ArrayList Listview control: - Trường hợp Tôi muốn hướng dẫn bạn cách sử dụng ArrayList để lưu trữ liệu đổ lên ListView nào, bạn xem giao diện chương trình: - Mô tả: + Nhập liệu nhấn nút “Nhập” đưa vào ArrayList hiển thị lên ListView + Nhấn vào phần tử hiển thị vị trí giá trị phần tử lên TextView + Nhấn thật lâu (long click ) vào phần tử ListView xóa phần tử * Tạo Android Project tên: Vidu_ListView_ArrayList, Xem Layout XML ứng dụng (activity_main.xml): 4 Xem MainActivity.java: packagetranduythanh.com; importjava.util.ArrayList; importandroid.os.Bundle; importandroid.app.Activity; importandroid.view.View; importandroid.widget.AdapterView; importandroid.widget.ArrayAdapter; importandroid.widget.Button; importandroid.widget.EditText; importandroid.widget.ListView; importandroid.widget.TextView; 11 public class MainActivity extends Activity { EditText txtten; TextView txtchon; Button btn; ListView lv; ArrayListarrList=null; ArrayAdapter adapter=null; @Override Protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); txtten=(EditText) findViewById(R.id.txtTen); txtchon=(TextView) findViewById(R.id.txtselection); lv=(ListView) findViewById(R.id.lvperson); //1 Tạo ArrayList object arrList=newArrayList(); //2 Gán Data Source (ArrayList object) vào ArrayAdapter adapter=newArrayAdapter (this, android.R.layout.simple_list_item_1, arrList); //3 gán Adapter vào ListView lv.setAdapter(adapter); btn=(Button) findViewById(R.id.btnNhap); //4 Xử lý kiện nhấn nút Nhập btn.setOnClickListener(newView.OnClickListener() { publicvoidonClick(View arg0) { arrList.add(txtten.getText()+""); adapter.notifyDataSetChanged(); } }); //5 Xử lý kiện chọn phần tử ListView lv.setOnItemClickListener(new AdapterView.OnItemClickListener() { public void onItemClick( AdapterView arg0,View arg1, intarg2,longarg3) { txtchon.setText("position : "+ arg2+ "; value ="+arrList.get(arg2)); } }); //6 xử lý kiện Long click lv.setOnItemLongClickListener(new AdapterView.OnItemLongClickListener() { @Override Public boolean onItemLongClick(AdapterView arg0, View arg1, intarg2, longarg3) { arrList.remove(arg2);//xóa phần tử thứ arg2 adapter.notifyDataSetChanged(); return false; } }); } } 3 4 4 4 5 5 Tôi giải thích thêm coding: ArrayList bạn học môn Java Ở Tôi nói : - Hàm adapter.notifyDataSetChanged(); Bạn ý ArrayList gán vào adapter nên thay đổi ArrayList adapter nhận biết Khi có thay đổi ArrayList bạn cần gọi notifyDataSetChanged ListView cập nhật (bởi Adapter gắn vào ListView) - Sự kiện setOnItemLongClickListener, gắn cho ListView Item, nhấn lâu từ 2.5 tới giây kiện sảy Tương tự setOnItemClickListener , đối số có tên arg2được dùng để xác định vị trí phần tử nằm ArrayList 4) Trường hợp 4: Sử dụng ArrayList ListView phần tử ArrayList Object bất kỳ: - Tôi có ví dụ hiển thị danh sách nhân viên theo mô hình sau: - Có loại nhân viên : Nhân viên thức (EmployeeFullTime ) nhân viên thời vụ (EmployeePartime) - Mỗi nhân viên có cách tính lương khác (tên phương thức tính lương giống nhau) - Mỗi nhân viên có phương thức toString để xuất thông tin, Nội dung xuất khác Thêm FullTime đằng sau Id Name nhân viên thức Thêm Partime đằng sau Id Name nhân viên thời vụ - Xem giao diện chương trình: -Tạo Android Project tên: Vidu_ListView_ArrayList_Object, cấu trúc bên dưới: - Layout XML (activity_main.xml): 15 16 19 20 24 80 81 82 83 84 85 86 87 91 96 97 98 99 10 10 10 10 - Xem nội dung class: - Abstract class Employee: packagetranduythanh.com; public abstract class Employee { private String id; private String name; public String getId() { returnid; } public void setId(String id) { 10 this.id = id; 11 } 12 13 public String getName() { returnname; 14 } 15 16 public void setName(String name) { 17 this.name = name; 18 } 19 20 21 22 23 24 public abstract double TinhLuong(); @Override publicString toString() { // TODO Auto-generated method stub returnthis.id+" - "+this.name; } } - class EmployeeFullTime: packagetranduythanh.com; publicclassEmployeeFullTime extendsEmployee { @Override publicdoubleTinhLuong() { return500; } @Override publicString toString() { return super.toString() +" >FullTime="+TinhLuong(); } } - Class EmployeePartTime: public class EmployeePartTime extends Employee { @Override publicdoubleTinhLuong() { return150; } @Override publicString toString() { return super.toString() +" >PartTime="+TinhLuong(); } 10 11 } 12 - Bạn thấy class dẫn xuất từ Employee Tôi làm đơn giản cách tính lương khác Đối với FullTime lương 500, Partime lương 150 hàm Xuất toString() khác xí - Ở ta áp dụng tính đa hình thông qua thừa kế, cần dùng biến có kiểu Employee, hiểu FullTime Partime xuất thông tin mong đợi - Xem class MainActivity.java: packagetranduythanh.com; importjava.util.ArrayList; importandroid.os.Bundle; importandroid.app.Activity; importandroid.view.View; importandroid.view.View.OnClickListener; importandroid.widget.ArrayAdapter; importandroid.widget.Button; importandroid.widget.EditText; importandroid.widget.ListView; 10 importandroid.widget.RadioGroup; 11 12 publicclassMainActivity extendsActivity { 13 EditText editId,editName; 14 Button btnNhap; 15 RadioGroup radgroup; 16 ListView lvNhanvien; ArrayListarrEmployee=newArrayList(); 17 ArrayAdapteradapter=null; 18 //Khai báo employee object 19 Employee employee=null; 20 21 @Override Protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); editId=(EditText) findViewById(R.id.editMa); editName=(EditText) findViewById(R.id.editTen); btnNhap=(Button) findViewById(R.id.btnnhap); radgroup=(RadioGroup) findViewById(R.id.radiogroud1); lvNhanvien=(ListView) findViewById(R.id.lvnhanvien); //đưa Data Source employee vào Adapter adapter=newArrayAdapter(this, android.R.layout.simple_list_item_1, arrEmployee); //đưa adapter vào ListView lvNhanvien.setAdapter(adapter); 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 btnNhap.setOnClickListener(newOnClickListener() { @Override publicvoidonClick(View arg0) { processNhap(); } }); } //Xử lý kiện nhập Public void processNhap() { //Lấy id Radio Button checked intradId=radgroup.getCheckedRadioButtonId(); String id=editId.getText()+""; String name=editName.getText()+""; if(radId==R.id.radChinhthuc) { //tạo instance FullTime Employee =new EmployeeFullTime(); } else { //Tạo instance Partime employee=new EmployeePartTime(); } //FullTime hay Partime Employee //nên có hàm hiển nhiên employee.setId(id); employee.setName(name); //Đưa employee vào ArrayList arrEmployee.add(employee); //Cập nhập giao diện adapter.notifyDataSetChanged(); } } - Chương trình tự động hiển thị loại Employee mà ta chọn lựa giao diện, bạn lại ôn tập thêm tính đa hình java Ứng với loại Employee tự động gọi hàm toString loại Ví dụ: Nếu Employee FullTime gọi toString FullTime ngược lại với PartTime lấy toString PartTime [...]... 78 79 android: id="@+id/textView2" android: layout_width="wrap_content" android: layout_height="wrap_content" android: text="Mã NV:"/> ... android: layout_height="wrap_content"> ... 80 81 82 83 84 85 86 87 91 96 97 98 99 10 10 2 < /ListView> 4 10... MainActivity.java: 1 packagetranduythanh.com; 2 3 importjava.util.ArrayList; importandroid.os.Bundle; 4 importandroid.app.Activity; 5 importandroid.view.View; 6 importandroid.view.View.OnClickListener; 7 importandroid.widget.ArrayAdapter; importandroid.widget.Button; 8 importandroid.widget.EditText; 9 importandroid.widget .ListView; 10 importandroid.widget.RadioGroup; 11 12 publicclassMainActivity extendsActivity... btnNhap=(Button) findViewById(R.id.btnnhap); radgroup=(RadioGroup) findViewById(R.id.radiogroud1); lvNhanvien= (ListView) findViewById(R.id.lvnhanvien); //đưa Data Source là các employee vào Adapter adapter=newArrayAdapter(this, android. R.layout.simple_list_item_1, arrEmployee); //đưa adapter vào ListView lvNhanvien.setAdapter(adapter); 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42... arrEmployee.add(employee); //Cập nhập giao diện adapter.notifyDataSetChanged(); } } - Chương trình sẽ tự động hiển thị đúng loại Employee mà ta chọn lựa trên giao diện, ở đây bạn lại được ôn tập thêm về tính đa hình trong java Ứng với mỗi loại Employee nó sẽ tự động gọi hàm toString của loại đó Ví dụ: Nếu Employee đó là FullTime thì nó gọi toString của FullTime và ngược lại với PartTime cũng vậy nó sẽ... importandroid.widget.EditText; 9 importandroid.widget .ListView; 10 importandroid.widget.RadioGroup; 11 12 publicclassMainActivity extendsActivity { 13 EditText editId,editName; 14 Button btnNhap; 15 RadioGroup radgroup; 16 ListView lvNhanvien; ArrayListarrEmployee=newArrayList(); 17 ArrayAdapteradapter=null; 18 //Khai báo 1 employee object 19 Employee employee=null; 20 21 @Override Protected