반응형

 안드로이드 앱을 사용하면서 여러 개의 선택지 중에서 원하는 하나를 고르거나 또는 여러 개를 골라야할 때가 있다. 

이럴 때 사용하는 것이 '메뉴(Menu)' 인데, 메뉴는 평소에 아주 많이 쓰이는 UI 요소이고, 모든 기능들을 계층적으로 

표시할 수 있다.  이렇게 안드로이드 메뉴에는 옵션 메뉴, 컨텍스트 메뉴, 팝업 메뉴와 같은 여러 가지의 종류의 메뉴가 있는데, 이번 시간에는 액티비티의 주된 메뉴라고 할 수 있는 '옵션 메뉴(Option Menu)' 를 알아볼 것이다. 

 

 먼저, '옵션 메뉴(Option Menu)' 를 만드려면 xml로 메뉴를 정의해야한다. 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<?xml version="1.0" encoding="utf-8"?>
 
    <item
        android:id="@+id/two"
        android:title="2x2x2"
        app:showAsAction="never" />
    <item
        android:id="@+id/three"
        android:title="3x3x3"
        app:showAsAction="never" />
    <item
        android:id="@+id/onehand"
        android:title="3x3x3 One-Handed"
        app:showAsAction="never" />
</menu>
cs

위의 xml 코드에서 보면, app:showAsAction이라는 속성이 보일 것이다. 

이 속성은 메뉴 아이템들이 어떻게 보일 것인가에 대해 설정하는 것으로써 다음과 같은 속성들이 있다. 

showAsAction 속성 값 비고
ifRoom 앱 바에 표시할 여유 공간이 있을 때만 아이템을 표시한다.
always 항상 앱 바에 메뉴 아이템을 추가하여 표시한다.
never 앱 바에 아이템을 추가하여 표시하지 않는다. (디폴트, 더보기를 누르면 리스트 형식으로
표시됨)
withText android:title 속성에 정의한 제목을 표시한다.
collapseActionView 아이템에 설정한 뷰의 아이콘만 표시한다. 

메뉴를 위한 xml파일

 

xml 파일을 만들고 나면 이것을 액티비티에다가 '팽창(Inflate)' 시켜줘야한다. 

 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
 @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        MenuInflater inflater = getMenuInflater();
        inflater.inflate(R.menu.event_list, menu);
        return true;
    }
 
    @Override
    public boolean onOptionsItemSelected(@NonNull MenuItem item) {
        switch (item.getItemId()) {
            case R.id.two:
                Toast.makeText(getApplicationContext(), "2x2x2 종목이 선택되었습니다. ", Toast.LENGTH_SHORT).show();
                break;
 
            case R.id.three:
                Toast.makeText(getApplicationContext(), "3x3x3 종목이 선택되었습니다. ", Toast.LENGTH_SHORT).show();
                break;
 
            case R.id.onehand:
                Toast.makeText(getApplicationContext(), "3x3x3한손 종목이 선택되었습니다. ", Toast.LENGTH_SHORT).show();
                break;
        }
        return super.onOptionsItemSelected(item);
    }
cs

 

이렇게 간단한 코드를 작성해주면 메뉴 xml이 액티비티에 팽창이 되어서

앱 바의 더보기 아이콘을 누르면 옵션 메뉴들이 리스트 형식으로 나타나게 된다. 

 

 

피드백은 언제나 환영입니다. 

반응형

+ Recent posts