Bài tập 22: Thực hành về Menu trong Android

– Menu và Context menu là những control rất hữu dụng và nó rất được ưa chuộng, do đó chúng ta phải biết về nó để làm cho ứng dụng của Ta đạt hiệu suất cao hơn.

– Trước tiên Tôi sẽ trình bày về Menu:

+ Tùy vào từng phiên bản Android hay sản phẩm của hãng sản xuất mà chức năng hiển thị menu có khác nhau chút xíu.

+ Ở đây Tôi nói máy ảo thôi, để hiển thị Menu thì ta làm như sau:

– Nếu ứng dụng của bạn có sử dụng Menu thì chỉ cần click vào nút có chữ “Menu” là sẽ hiển thị ra.

0) Menu tự động phát sinh khi chúng ta tạo một Android Project:

– Bạn để ý là mỗi lần tạo một Android Project, nó sẽ tự tạo cho ta XML menu Resource đồng thời trong MainActivity cũng gọi sẵn hàm cho chúng ta để load Menu:

– Như bạn thấy thì xml resource menu (kiến trúc bên trong nó ta sẽ tính sau) của ứng dụng được lưu trong thư mục menu, và mặc nhiên nó cùng tên với Layout.

– Bạn mở MainActivity lên: Thấy nó override phương thức onCreateOptionsMenu, dòng lệnh 18, 19 của Hàm này được dùng để tải Menu vào ứng dụng khi người dùng click vào nút “Menu”.

1) Cách tạo Menu:

a) Tạo Menu bằng XML resource:

– Giờ tôi sẽ cố tình hướng dẫn bạn tạo 1 XML menu resource khác đồng thời giúp bạn tải Menu Resource mới này vào ứng dụng khi nhấn nút “Menu” cũng như viết sự kiện cho các Menu Item:

+ Bấm chuột phải vào thư mục menu/ chọn New / chọn Android XML File:

+Màn hình New Android XML hiện lên, ta chọn Resource type là Menu giống hình dưới đây, đặt tên cho nó là “mymenu” rồi nhấn finish:

+ Sau khi nhấn Finish, bạn quan sát lại thư mục menu của ứng dụng sẽ xuất hiện mymenu.xml:

+ Để tạo các Menu Item, bạn double click vào mymenu.xml:

+ Màn hình trên bạn để ý có 2 Tab: Layout và mymenu.xml, Tab Layout cho phép bạn tạo menu bằng giao diện, tab mymenu.xml cho phép bạn tạo menu bằng source code xml.

+ Bây giờ ta sẽ làm menu bằng giao diện, bạn nhấn vào nút “Add” ở phía bên trên :

+ Ở màn hình này bạn chọn Item, rồi nhấn OK:

+ Khi tạo một Menu Item thì có 2 phần tử chính đó là Id và Title (Bạn xem phần Tôi tô màu vàng). Ta dựa vào Id để xử lý coding, bạn nên đặt Id nó cho khoa học, mang tính gợi nhớ. Như bạn thấy đó, Tôi đặt id cho Menu Item này là item_xemdssv thì id này sẽ được tự động cập nhập vào màn hình phía bên trái.

+ Các thuộc tính khác bạn tự nghiên cứu trên mạng, hoặc khi nào gặp vấn đề về nó Tôi sẽ trình bày sau.

+ Cứ như vậy bạn tuần tự tạo cho đầy đủ các Menu Item mà bạn mong muốn.

*** Trường hợp bạn muốn tạo Sub Menu Item (Menu Item chứa các Menu Item khác):

+ Tôi có tạo thêm 1 Menu Item là “Xem danh sách lớp“, bây giờ Tôi muốn tạo thêm 3 Sub Menu Item cho nó, bao gồm “Lớp DHTH1A”, “Lớp DHTH1B” và “Lớp DHTH1C”:

*Theo Hình trên thì bạn chọn Menu bạn muốn tạo Sub Menu cho nó trước, ở đây là item_xemlop (số 1 Tôi đánh dấu)

*Sau đó bạn chọn nút “Add” :

– Mục “Create a new element at the top level, in Menu” để tạo Menu cùng cấp

– Mục Tôi tô màu vàng “Create a element in the selected element…” để tạo Sub Menu.

* Bấm OK để tiến hành tạo Sub Menu, màn hình sau sẽ xuất hiện:

+ Tiếp tục để tạo Menu Item cho Sub – Menu ta chọn nút “Add“, mọi thứ sẽ lại y xì như tạo Menu Item cha của nó vậy. Muốn xóa thì chọn nút “Remove“. Khi bạn nhấn nút “Add” thì bạn sẽ thấy màn hình quen thuộc sau:

+ Bạn chọn lựa như trên và nhấn OK, cứ lặp lại như vậy, mỗi lần tạo Menu Item thì bạn đặt Id và Title cho nó là xong:

+ Muốn thay đổi thứ tự xuất hiện của các Menu Item bạn chọn nút “Down”, “Up”.

* Nếu muốn xem XML resource của nó như thế nào thì bạn chọn vào tab “mymenu.xml“:

*** Bây giờ bạn xem cách gắn Menu vừa tạo vào ứng dụng như thế nào:

– Bạn mở MainActivity.java lên:

Dòng lệnh 13, 14: getMenuInflater().inflate(R.menu.mymenu, menu); dùng để gắn Menu XML Resource vào ứng dụng, bạn chạy máy ảo lên và nhấn vào nút Menu, bạn sẽ thấy được kết quả:

+ Bây giờ ta viết Coding để xử lý sự kiện cho các Menu Item:

– Để viết sự kiện cho các Menu Item bạn cần Override phương thức onOptionsItemSelected, Trong phương thức này ta dựa và Id của các Menu Item để xử lý:

package tranduythanh.com;
import android.os.Bundle;
import android.app.Activity;
import android.view.Menu;
import android.view.MenuItem;
public class MainActivity extends Activity {
 @Override
 protected void onCreate(Bundle savedInstanceState) {
 super.onCreate(savedInstanceState);
 setContentView(R.layout.activity_main);
 }
 @Override
 public boolean onCreateOptionsMenu(Menu menu) {
 getMenuInflater()
 .inflate(R.menu.mymenu, menu);
 return true;
 }
 @Override
 public boolean onOptionsItemSelected(MenuItem item) {
 switch(item.getItemId())
 {
 case R.id.item_xemdssv:
 //Xử lý xem danh sách sinh viên
 break;
 case R.id.item_lopdhth1a:
 //xử lý xem thông tin lớp DHTH1A
 break;
 case R.id.item_lopdhth1b:
 break;
 case R.id.item_lopdhth1c:
 break;
 }
 return super.onOptionsItemSelected(item);
 }
}

– Bạn nhìn vào dòng lệnh 19 trở xuống, Ở đây Tôi dùng switch case để xử lý theo đúng Id mà người sử dụng chọn lựa. Tùy vào yêu cầu của bài toán mà chúng ta xử lý trong này. Tôi khuyên bạn nên viết từng hàm riêng theo nghiệp vụ rồi cứ thế mà gọi hàm theo đúng Menu Item.

– Bạn tải code mẫu ở đây: http://www.mediafire.com/?zawcff1ha6ap3ic

b) Tạo Menu bằng Coding (Runtime):

– Chúng ta có thể tạo Menu lúc Runtime (không cần dùng XML Resource):

public boolean onCreateOptionsMenu(Menu menu) {
 menu.add("Menu 1");
 menu.add("Menu 2");
 SubMenu sub3= menu.addSubMenu("Menu 3");
 sub3.add("File 1 Menu 3");
 sub3.add("File 2 Menu 3");
 sub3.add("File 3 Menu 3");
 return true;
 }

– Bạn nhìn thấy đấy, việc tạo Menu lúc Runtime rất dễ dàng. Nhưng nếu như bạn viết code tạo Menu như vậy thì việc xử lý gặp chút khó khăn vì bạn không biết Id của mỗi Menu Item.

– Do đó bạn nên viết lại theo cách sau:

package tranduythanh.com;

import android.os.Bundle;
import android.app.Activity;
import android.view.Menu;
import android.view.MenuItem;
import android.view.SubMenu;

public class MainActivity extends Activity {

@Override
 protected void onCreate(Bundle savedInstanceState) {
 super.onCreate(savedInstanceState);
 setContentView(R.layout.activity_main);
 }

@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=113;
 menu.add(0, itemId, 0, "Menu 1");
 itemId=114;
 menu.add(0,itemId,1,"Menu 2");
 SubMenu sub3= menu.addSubMenu("Menu 3");
 itemId=115;
 sub3.add(0,itemId,0,"File 1 Menu 3");
 itemId=116;
 sub3.add(0,itemId,1,"File 2 Menu 3");
 itemId=117;
 sub3.add(0,itemId,2,"File 3 Menu 3");
 return true;
 }
 @Override
 public boolean onOptionsItemSelected(MenuItem item) {
 switch(item.getItemId())
 {
 case 113:
 //Xử lý Menu 1
 break;
 case 114:
 //Xử lý Menu 2
 break;
 case 115:
 //Xử lý File 1 của Menu 3
 break;
 case 116:
 //Xử lý File 2 của Menu 3
 break;
 case 117:
 //Xử lý File 3 của Menu 3
 break;
 }
 return super.onOptionsItemSelected(item);
 }
}

– Như vậy mỗi lần tạo Menu Item bạn nên gán Id cho nó và xử lý theo Id này ở trong hàm onOptionsItemSelected.

– Bạn tải code mẫu ở đây: http://www.mediafire.com/?em82rb51dduvnou

– Bài tập này Tôi sẽ không làm ví dụ mẫu lớn, Tôi để dành khi học xong Context Menu Tôi Demo luôn.

– Bài tập sau Tôi sẽ hướng dẫn cách làm Context Menu.

– Chúc các bạn thành công.