안드로이드 Action Bar에 메뉴 추가하기

안드로이드의 액션바 (Action Bar)에 메뉴를 추가하기 위해서는 다음과 같은 절차가 필요합니다

1) 메뉴들이 정의된 xml 정의

2) onCreateOptionsMenu() 메소드를 통한 메뉴 inflate

3) onOptionsItemSelected() 메소드를 통해 사용자가 메뉴를 클릭했을 때 처리

이 예제에서는 하나의 메뉴를 추가한 후 그 메뉴를 클릭하면 다른 메뉴로 변경되고 다시 클릭하면 원래 메뉴로 돌아오도록 해서 액션바에 메뉴를 설정하고 Activity에서 메뉴를 제어할 수 있는 방법까지 살펴보도록 하겠습니다.

 

이제 각각의 절차에 대해 자세히 살펴보도록 하겠습니다.

1. 메뉴들이 정의된 xml 정의

각 Activity에서 사용될 메뉴들의 정의는 res\menu 디렉토리 아래에 xml로 정의 합니다. 처음 프로젝트를 시작하면 menu 디렉토리는 없으니 생성을 해야 합니다. 생성 후 마우스 오른쪽 버튼을 눌러서 Menu resource file을 선택 후 원하는 이름(대개 menu_로 시작하는 이름)으로 생성합니다. 이 예제에서는 menu_sample.xml 로 가정합니다.

파일 이름만 결정 후 아무것도 하지 않고 바로 생성한 xml 파일을 Text 형태로 보면 다음과 같습니다.

1 2 3 4

<?xml version="1.0" encoding="utf-8"?> <menu xmlns:android="http://schemas.android.com/apk/res/android"> </menu>

이제 원하는 메뉴를 <item> 태그를 이용하여 <menu>와 </menu> 사이에 추가를 합니다. 이 예제에서는 하나의 메뉴만 추가하고 그 메뉴는 단순 텍스트 보다는 이미지 아이콘으로 추가하도록 합니다. 이를 위한 <item>의 내용은 다음과 같습니다.

1 : Activity 내에서 제어하기 위해 android:id를 설정합니다.

2 : 이 title은 만약 아래 icon이 없다면 화면에 보이게 됩니다.

3 : icon 생성은 Image Asset Manager (File > New > Image Asset)의 Icon Type을 Action Bar and Tab Icons로 설정 후 만들면 좋습니다.

4 : app:showAsAction을 always로 설정해서 항상 액센바에 보일 수 있도록 합니다. 다른 옵션들에 대해서는 https://developer.android.com/guide/topics/resources/menu-resource.html 를 참조하세요.

1 2 3 4

<item android:id="@+id/menu_select" android:title="메뉴1" android:icon="@drawable/menu_1" app:showAsAction="always" />

이를 추가하면 app:showAsAction의 xmlns (xml namespace)는 android가 아니고 app이기 때문에 에러가 발생하게 됩니다. Alt + Enter를 클릭하여 해결하거나 xmlns:app="http://schemas.android.com/apk/res-auto" 를 직접 추가하여 해결하세요. 완성된 menu_sample.xml은 다음과 같습니다.

1 2 3 4 5 6 7 8

<?xml version="1.0" encoding="utf-8"?> <menu xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto"> <item android:id="@+id/menu_select" android:title="메뉴1" android:icon="@drawable/menu_1" app:showAsAction="always" /> </menu>

 

2. onCreateOptionsMenu() 메소드를 통한 메뉴 inflate

Action Bar에 메뉴를 추가하고 싶은 Activity의 onCreateOptionsMenu() 메소드를 다음과 같이 overriding 하도록 합니다. Activity에서 화면을 그리기 전에 아래 메소드는 호출이 되며 MenuInflater를 얻어서 위에서 생성한 메뉴를 inflate 하는 역할을 수행합니다.

1 2 3 4 5 6

@Override public boolean onCreateOptionsMenu(Menu menu) { getMenuInflater().inflate(R.menu.menu_sample, menu); return true; }

3. onOptionsItemSelected() 메소드를 통해 사용자가 메뉴를 클릭했을 때 처리

사용자가 메뉴를 클릭하면 onOptionsItemSelected() 메소드가 호출되며 인수로는 클릭한 MenuItem (위 menu_sample.xml에서 <item>으로 정의한 내용)이 전달됩니다.

5 : 사용자가 클릭한 메뉴의 id가 R.id.menu_select 라면

6 : 그리고, 현재 메뉴의 title이 메뉴1 이었다면

7~8 : title을 메뉴2로 바꾸고, icon도 menu_2로 변경합니다. (icon이 화면에 보이기 때문에 title은 보이지는 않습니다.) 

9~11 : 그렇지 않다면 (즉, title이 메뉴1이 아닌 메뉴2 였다면), 다시 메뉴1으로 돌아갑니다.

15 : 안드로이드 플랫폼에서 추가 작업을 할 수 있도록 super.onOptionsItemSelected()를 호출해 줍니다.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16

@Override public boolean onOptionsItemSelected(MenuItem menuItem) { int id = menuItem.getItemId(); if (id == R.id.menu_select) { if (menuItem.getTitle().equals("메뉴1")) { menuItem.setTitle("메뉴2"); menuItem.setIcon(R.drawable.menu_2); } else { menuItem.setTitle("메뉴1"); menuItem.setIcon(R.drawable.menu_1); } } return super.onOptionsItemSelected(menuItem); }

액션바도 하나의 View로 타이틀 자체에 다양한 작업들을 진행할 수 있습니다. 예를 들어 액션바 자체의 타이틀 (메뉴의 타이틀이 아닌) 을 수정하려면 getSupportAcctionBar().setTitle() 메소드를 사용하면 됩니다. 추가적인 사항들은 다음에 도 기회가 되면 살펴보도록 하겠습니다.

이상으로 액션바에 메뉴를 설정하는 것을 알아봤습니다.