Lập trình di động - Lab05: Menu

Ver 1.0 – 2016, FIT - HCMUP Lab 05: MENU Ths. Lương Trần Hy Hiến, KHOA CNTT – TRƯỜNG ĐH SƯ PHẠM TP. HCM 1 Tham khảo: developer.android.com/guide/topics/ui/menus.html 1 Tạo menu bằng XML resource Gõ nội dung menu: Ver 1.0 – 2016, FIT - HCMUP Lab 05: MENU Ths. Lương Trần Hy Hiến, KHOA CNTT – TRƯỜNG ĐH SƯ PHẠM TP. HCM 2 Viết code gọi menu trong MainActivity: Ver 1.0 – 2016, FIT - HCMUP Lab 05: MENU Ths. Lương Trần Hy Hiến, KHOA CNTT – TRƯỜNG ĐH SƯ PHẠM TP. HCM 3 @Override public boolean onCreateOptionsMenu(Menu menu) { return super.onCreateOptionsMenu(menu); } Sửa lại thành: Xử lý sự kiện click lên Menu Item: Override phương thức onOptionsItemSelected @Override public boolean onOptionsItemSelected(MenuItem item) { //dựa theo id menuitem đang chọn switch(item.getItemId()) { case R.id.item_xemdssv: Toast.makeText(MainActivity.this, "Bạn chọn Xem Danh sách Sinh viên", Toast.LENGTH_LONG).show(); break; Ver 1.0 – 2016, FIT - HCMUP Lab 05: MENU Ths. Lương Trần Hy Hiến, KHOA CNTT – TRƯỜNG ĐH SƯ PHẠM TP. HCM 4 //vâng vâng cho những menuitem khác } return super.onOptionsItemSelected(item); } 2 Tạo menu bằng code Sử dụng code lúc Runtime để tạo Menu thay vì dùng XML Resource. @Override public boolean onCreateOptionsMenu(Menu menu) { menu.add("Menu 1"); menu.add("Menu 2"); SubMenu submenu3= menu.addSubMenu("Menu 3"); submenu3.add("SubMenu 1.3"); submenu3.add("SubMenu 2.3); submenu3.add("SubMenu 3.3"); return true; } Với cách làm như trên sẽ gặp khó khăn khi xác định ID của MenuItem. @Override public boolean onCreateOptionsMenu(Menu menu) { //Đối số 1 là nhóm //Đối số 2 là Id cho Menu Item //Đối số 3 là thứ tự xuất hiện của Menu Item //Đối số 4 là tiêu đề cho Menu Item int itemId = 1000; menu.add(0, itemId, 0, "Thể thao"); itemId = 1001; menu.add(0,itemId, 1, "Tin tức"); SubMenu sub3= menu.addSubMenu(0, itemId, 2, "Danh mục Tin tức"); itemId = 1002; sub3.add(0, itemId, 0,"VNExpress"); itemId = 1003; sub3.add(0, itemId, 1,"ZING"); itemId = 1004; sub3.add(0, itemId, 2,"Tuổi trẻ"); return true; } Và xử lý sự kiện click lên Menu Item: @Override public boolean onOptionsItemSelected(MenuItem item) { Ver 1.0 – 2016, FIT - HCMUP Lab 05: MENU Ths. Lương Trần Hy Hiến, KHOA CNTT – TRƯỜNG ĐH SƯ PHẠM TP. HCM 5 //dựa theo id menuitem đang chọn switch(item.getItemId()) { case 1004://TuoiTre startActivity(new Intent(Intent.ACTION_VIEW, Uri.parse(""))); break; //vâng vâng } return super.onOptionsItemSelected(item); } 3 Popup Menu 3.1 Xây dựng Menu Resource 3.2 Thiết kế giao diện 3.3 Source xử lý btnShowPopUp = (Button)findViewById(R.id.btnShowPopUp); btnShowPopUp.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { PopupMenu popupMenu = new PopupMenu(MainActivity.this, Ver 1.0 – 2016, FIT - HCMUP Lab 05: MENU Ths. Lương Trần Hy Hiến, KHOA CNTT – TRƯỜNG ĐH SƯ PHẠM TP. HCM 6 v); popupMenu.setOnMenuItemClickListener(new PopupMenu.OnMenuItemClickListener() { @Override public boolean onMenuItemClick(MenuItem item) { switch (item.getItemId()) { case R.id.item_comedy: Toast.makeText(MainActivity.this, "Comedy Clicked", Toast.LENGTH_SHORT).show(); return true; case R.id.item_movies: Toast.makeText(MainActivity.this, "Movies Clicked", Toast.LENGTH_SHORT).show(); return true; case R.id.item_music: Toast.makeText(MainActivity.this, "Music Clicked", Toast.LENGTH_SHORT).show(); return true; } return false; } }); popupMenu.inflate(R.menu.popup_menu); popupMenu.show(); } }); 3.4 Kết quả chạy chương trình Sau khi click lên button: Ver 1.0 – 2016, FIT - HCMUP Lab 05: MENU Ths. Lương Trần Hy Hiến, KHOA CNTT – TRƯỜNG ĐH SƯ PHẠM TP. HCM 7 4 Menu ngữ cảnh Xuất hiện khi người dùng nhấp lâu vào đối tượng. 4.1 Mô tả Ví dụ: Menu ngữ cảnh trên Button, đổi màu nền Button. 4.2 Thiết kế Menu (my_context_menu.xml) <menu xmlns:android=""> <item android:id="@+id/itemYellow" android:title="Yellow"> <item android:id="@+id/itemGreen" android:title="Green"> <item android:id="@+id/itemMagenta" android:title="Magenta"> <item android:id="@+id/itemBlue" android:title="Blue"> Ver 1.0 – 2016, FIT - HCMUP Lab 05: MENU Ths. Lương Trần Hy Hiến, KHOA CNTT – TRƯỜNG ĐH SƯ PHẠM TP. HCM 8 4.3 Định nghĩa một số màu trong strings.xml 4.4 Viết code xử lý Viết code cho 2 sự kiện CreateContextMenu và ContextItemSelected @Override public void onCreateContextMenu(ContextMenu menu, View v, ContextMenu.ContextMenuInfo menuInfo) { super.onCreateContextMenu(menu, v, menuInfo); getMenuInflater().inflate(R.menu.my_context_menu, menu); } @Override public boolean onContextItemSelected(MenuItem item) { //return super.onContextItemSelected(item); switch(item.getItemId()) { case R.id.itemBlue: btnShowPopUp.setBackgroundColor( getResources().getColor(R.color.clrBlue)); break; case R.id.itemGreen: btnShowPopUp.setBackgroundColor( getResources().getColor(R.color.clrGreen)); break; case R.id.itemMagenta: btnShowPopUp.setBackgroundColor( getResources().getColor(R.color.clrMagenta)); break; case R.id.itemYellow: btnShowPopUp.setBackgroundColor( getResources().getColor(R.color.clrYellow)); break; } Ver 1.0 – 2016, FIT - HCMUP Lab 05: MENU Ths. Lương Trần Hy Hiến, KHOA CNTT – TRƯỜNG ĐH SƯ PHẠM TP. HCM 9 return super.onContextItemSelected(item); } Đồng thời thiết lập control nhận MenuContext. btnShowPopUp = (Button)findViewById(R.id.btnShowPopUp); registerForContextMenu(btnShowPopUp); 5 Bài tập Custom Layout ListView 5.1 Xây dựng lớp SinhVien public class SinhVien { public boolean isGioiTinh() { return GioiTinh; } @Override public String toString() { return getMaSV() + " : " + getHoTen(); } public void setGioiTinh(boolean gioiTinh) { GioiTinh = gioiTinh; } public String getHoTen() { return HoTen; } public void setHoTen(String hoTen) { HoTen = hoTen; } public String getMaSV() { return MaSV; } public void setMaSV(String maSV) { MaSV = maSV; } private String MaSV; private String HoTen; private boolean GioiTinh; } Ver 1.0 – 2016, FIT - HCMUP Lab 05: MENU Ths. Lương Trần Hy Hiến, KHOA CNTT – TRƯỜNG ĐH SƯ PHẠM TP. HCM 10 5.2 Thiết kế Layout riêng cho một item <LinearLayout xmlns:android="" android:orientation="horizontal" android:layout_width="match_parent" android:layout_height="match_parent"> <ImageView android:id="@+id/imgitem" android:layout_width="30dip" android:layout_height="30dip" android:paddingLeft="2dp" android:paddingRight="2dp" android:paddingTop="2dp" android:layout_marginTop="4dp" android:contentDescription="here" android:src="@drawable/icon_male" /> <TextView android:id="@+id/txtitem" android:layout_height="wrap_content" android:layout_width="0dip" android:layout_weight="2" android:layout_marginTop="4dp" android:paddingLeft="2dp" android:paddingRight="2dp" android:paddingTop="2dp" android:textSize="20sp" /> <CheckBox android:id="@+id/chkitem" android:layout_width="wrap_content" android:layout_height="wrap_content" /> 5.3 Tạo lớp CustomAdapter kế thừa từ ArrayAdapter Xâu dựng lớp CustomAdapter kế thừa để quản lý dữ liệu. Ver 1.0 – 2016, FIT - HCMUP Lab 05: MENU Ths. Lương Trần Hy Hiến, KHOA CNTT – TRƯỜNG ĐH SƯ PHẠM TP. HCM 11 public class MyArrayAdapter extends ArrayAdapter { Activity context = null; ArrayList myArray = null; int layoutId; /** * Constructor này dùng để khởi tạo các giá trị * từ MainActivity truyền vào * @param context : là Activity từ Main * @param layoutId: Là layout custom do ta tạo (my_item_layout.xml) * @param arr : Danh sách sinh viên truyền từ MainActivity */ public MyArrayAdapter(Activity context, int layoutId, ArrayListarr) { super(context, layoutId, arr); this.context = context; this.layoutId = layoutId; this.myArray = arr; } /** * hàm dùng để custom layout, ta phải override lại hàm này * từ MainActivity truyền vào * @param position : là vị trí của phần tử trong danh sách nhân viên * @param convertView: convertView, dùng nó để xử lý Item * @param parent : Danh sách sinh viên truyền từ Main * @return View: trả về chính convertView */ public View getView(int position, View convertView, ViewGroup parent) { LayoutInflater inflater = context.getLayoutInflater(); convertView = inflater.inflate(layoutId, null); //chỉ là test thôi, bạn có thể bỏ If đi if(myArray.size() > 0 && position >= 0) { //dòng lệnh lấy TextView ra để hiển thị Mã và tên lên final TextView txtdisplay = (TextView) convertView.findViewById(R.id.txtitem); //lấy sinh viên thứ position final SinhVien emp = myArray.get(position); //đưa thông tin lên TextView //emp.toString() sẽ trả về Id và Name txtdisplay.setText(emp.toString()); Ver 1.0 – 2016, FIT - HCMUP Lab 05: MENU Ths. Lương Trần Hy Hiến, KHOA CNTT – TRƯỜNG ĐH SƯ PHẠM TP. HCM 12 //lấy ImageView ra để thiết lập hình ảnh cho đúng final ImageView imgitem = (ImageView)convertView.findViewById(R.id.imgitem); //nếu là Nữ thì lấy hình con gái if(emp.isGioiTinh()) imgitem.setImageResource(R.drawable.icon_female); else//nếu là Nam thì lấy hình con trai imgitem.setImageResource(R.drawable.icon_male ); } //Vì View là Object là dạng tham chiếu đối tượng, nên //mọi sự thay đổi của các object bên trong convertView //thì nó cũng biết sự thay đổi đó return convertView;//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 } } 5.4 Xây dựng giao diện hiển thị Ver 1.0 – 2016, FIT - HCMUP Lab 05: MENU Ths. Lương Trần Hy Hiến, KHOA CNTT – TRƯỜNG ĐH SƯ PHẠM TP. HCM 13 5.5 Code xử lý trong OnCreate() lvSinhVien = (ListView) findViewById(R.id.lvnhanvien); arrSinhVien = new ArrayList(); //Khởi tạo đối tượng adapter và gán Data source adapter=new MyArrayAdapter( this, R.layout.my_item_layout,// lấy custom layout arrSinhVien/*thiết lập data source*/); lvSinhVien.setAdapter(adapter);//gán Adapter vào Lisview btnNhap.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { String ma = editMa.getText() + ""; String ten = editTen.getText() + ""; boolean gioitinh = false;//Nam =false if (genderGroup.getCheckedRadioButtonId() == R.id.radNu) gioitinh = true; //Tạo một employee SinhVien emp = new SinhVien(); emp.setMaSV(ma); emp.setHoTen(ten); emp.setGioiTinh(gioitinh); //Đưa vào danh sách arrSinhVien.add(emp); //gọi hàm cập nhật giao diện adapter.notifyDataSetChanged(); //Sau khi update thì xóa trắng dữ liệu và cho editma focus editMa.setText(""); editTen.setText(""); editMa.requestFocus(); } }); btnRemoveAll.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { //ta nên đi ngược danh sách, kiểm tra phần tử nào checked //thì xóa đúng vị trí đó ra khỏi arrEmployee for(int i = lvSinhVien.getChildCount() - 1; i >=0; i--) { //lấy ra dòng thứ i trong ListView //Dòng thứ i sẽ có 3 phần tử: ImageView, TextView, Checkbox v = lvSinhVien.getChildAt(i); //Ta chỉ lấy CheckBox ra kiểm tra Ver 1.0 – 2016, FIT - HCMUP Lab 05: MENU Ths. Lương Trần Hy Hiến, KHOA CNTT – TRƯỜNG ĐH SƯ PHẠM TP. HCM 14 CheckBox chk = (CheckBox) v.findViewById(R.id.chkitem); //Nếu nó Checked thì xóa ra khỏi arrEmployee if(chk.isChecked()) { //xóa phần tử thứ i ra khỏi danh sách arrSinhVien.remove(i); } } adapter.notifyDataSetChanged(); } }); 5.6 Kết quả chương trình Ver 1.0 – 2016, FIT - HCMUP Lab 05: MENU Ths. Lương Trần Hy Hiến, KHOA CNTT – TRƯỜNG ĐH SƯ PHẠM TP. HCM 15 Check chọn các sinh viên và bấm nút (X) để xóa.