[2] Action Bar 추가하기 [2] 액션 버튼 추가하기

이번 시간에 배울 것

  1. XML 파일에 액션을 명시하기
  2. 액션 바에 액션을 추가하기
  3. 액션 버튼이 동작하게 만들기
  4. 하단 액티비티를 위해서 Up 버튼 추가하기

함께 봐야 할 것 – YOU SHOULD ALSO READ

Providing Up Navigation

 

Why 액션버튼 추가?

왜 액션 버튼을 추가해야 할까요?
윈도우OS에서 작업표시줄에 바로가기 버튼들이 있지요? 그 버튼들을 누르면 원하는 동작을 수행할 수 있습니다. 안드로이드에서도 마찬가지로 그런 버튼들을 제공합니다. 또한, 속성이나 찾기 등등을 수행할 수 있지요.
그러한 역할을 하는 것이 액션 버튼입니다. 그래서 우리는 액션 버튼을 배우는 것이지요.

액션 버튼이 하늘에서 뚝 떨어지는 것이 아니니까, 추가하는 과정을 살펴봅니다.

액션 바에 직접 아이콘이나 텍스트를 넣을 수 있는데요, 이걸 보고 액션 버튼 이라 합니다.
액션 바에 모든 액션 버튼을 넣을 수는 없으니 일부 액션 버튼은 “액션 오버플로우” 영역으로 숨겨지게 할 수 있습니다.

그림 1. “검색 ‘” 및 “액션 오버플로우” 액션 버튼 을 가지고 있는 액션 바

XML 파일에 액션을 명시하기 <item>


고칠 곳

res/menu/menu_*.xml
res/value/strings.xml

액션 아이템 정의 위치 : XML menu resource
액션 버튼 및 액션 오버플로우 안에서 사용 가능한 모든 액션 아이템들은 메뉴 리소스들을 정의한 xml 파일에서 다룹니다.

새 파일 추가하기
– 추가 위치 : res/menu/
– 추가 파일 : *.xml
– 추가 엘리먼트 : <item>

액션 바에 넣고 싶은 아이템을 <item> 엘리먼트를 사용해 추가합니다. 예를 들어 :

res/menu/main_activity_actions.xml
(공식문서에서는 위의 파일 이름이라고 하는데 저는 menu_main.xml입니다)

<menu xmlns:android="http://schemas.android.com/apk/res/android" >

    <!-- 액션 버튼으로써 나타나는 "서치" 아이템  -->
    <item android:id="@+id/action_search"
          android:icon="@drawable/ic_action_search"
          android:title="@string/action_search"
          android:showAsAction="ifRoom" />

    <!-- 오버플로우 공간 안에 있는 "셋팅" 액션 아이템 -->
    <item android:id="@+id/action_settings"
          android:title="@string/action_settings"
          android:showAsAction="never" />

</menu>

실제 적용 상태 (빨간색 폰트로 으로 표시되는 것을 볼 수 있습니다. 경로를 못찾고 있어요. 빨간 밑줄도 있습니다. 아래에서 자세히 나옵니다)
ActionBar06

 

@string/action_search 가 빨간 폰트로 표시되는 이유

그러한 값이 없으니 빨간 색으로 나옵니다. 예전 시간에 배운 것 처럼 res/values/strings.xml에 다음과 같이 추가해 줘야 합니다.

ActionBar07

액션 바에서 여유 공간이 있다면 (ifRoom) 검색 버튼을 나타나게 한다는 것입니다.
액션을 셋팅하면 기본적으로 오버플로우에 나타나게 됩니다.
(기본적으로, 모든 액션은 오버플로우에 나타나게 되지만, 명시적으로 각각의 액션에 선언해 주는 것이 좋습니다)

icon 속성은 이미지를 표시하기 위해서 리소스 ID를 필요로 합니다. (오호. 이미지를 표시할 땐 resource ID가 필요하군요?)

@drawable/ 뒤에 붙는 이름은 반드시 여러분이 프로젝트 내
res/drawable/ 폴더에 저장한 비트맵 이미지의 이름이어야 합니다.
예를 들어 “@drawable/ic_action_search” 는 ic_action_search.png 을 가리킵니다.

이 것과 비슷하게도, title 속성은 string 리소스를 사용합니다.
이 스트링 리소스는 여러분의 프로젝트의 res/values/ 폴더에 있는 XML 파일이지요.
앞 수업이었던 Building a Simple User Interface 에서 나온 것 처럼 사용합니다.

주의 : 아이콘과 비트맵 이미지를 앱에서 사용하기 위해 생성할 때, 여러 버전을 제공해야 하는 것은 중요합니다. 각각의 버전은 각각 다른 스크린 해상도에 최적화 최적화 되어 있습니다.
좀 더 자세하게 Supporting Different Screens 에서 다뤄집니다.

만약 여러분의 앱이  안드로이드 2.1 이상의 버전에서  호환가능하도록  “서포트 라이브러리”에서 동작한다면,
showAsAction
속성은 android: namespace을 사용할 수 없습니다. (위의 빨간 및줄의 원인입니다)
대신 이 속성은 서포트 라이브러리에서 제공됩니다.
여러분은 반드시 XML namespace 를 따로 정의해야만 하고,
그 네임스페이스를 속성의 접두어로써 사용해야 합니다.
(사용자 XML namespace 는 앱 이름에 기반해야만 합니다.
그러나 아무 이름이나 될 수 있고, 오로지 여러분이 정의해 놓은 파일 내에서만 접근 가능합니다.)

예를 들면 다음과 같습니다. :

res/menu/main_activity_actions.xml
(공식문서에서는 위의 파일 이름이라고 하는데 저는 menu_main.xml입니다)

<menu xmlns:android="http://schemas.android.com/apk/res/android"
      xmlns:yourapp="http://schemas.android.com/apk/res-auto" >
    <!-- Search, should appear as action button -->
    <item android:id="@+id/action_search"
          android:icon="@drawable/ic_action_search"
          android:title="@string/action_search"
          yourapp:showAsAction="ifRoom"  />
    ...
</menu>

위와 같이 고치면 다음처럼 깔끔하게 XML이 완성됩니다.

 

 

ActionBar08
여기까지 완성된 내용을 한 번 에뮬레이터에 돌려보겠습니다.

ActionBar09

 

참고로 안드로이드 디바이스 (갤2) 에서 실험하니까 잘 안되네요…오호! 메뉴 버튼을 누르니 되네요!

액션을 액션 바에 추가하기 – onCreateOptionsMenu()


고칠 곳

onCreateOptionMenu()

Action Bar 에 메뉴 아이템들을 넣어보도록 하겠습니다.
메뉴 아이템들을 Action Bar에 넣기 위해서, onCreateOptionsMenu() 콜백 메서드를 액티비티에 구현해야 합니다.
이걸 통해서 메뉴 리소스를 Menu object에 인플레이트 할 수 있습니다. 예를 들어볼까요
(사실, 이게 무슨 열할을 하는지는 잘 모르겠지만 그냥 하라는대로 하겠습니다.)

@Override
public boolean onCreateOptionsMenu(Menu menu) {
    // Inflate the menu items for use in the action bar
    MenuInflater inflater = getMenuInflater();
    inflater.inflate(R.menu.main_activity_actions, menu);
    return super.onCreateOptionsMenu(menu);
}

(Menu 형 menu 가 갑툭튀 되었습니다. 이게 왜 갑자기 나온것인지 모르겠지만 일단 모참인(모르는 것을 참는 인내)를 발휘하겠습니다)

오호, 이게 각각의 액티비티에 있군요. 각각의 액티비티에 onCreateOptionMenu 가 있습니다! 그 곳에서 해 줘야 액션바가 제대로 나옵니다!

 

액션 버튼이 동작하게 만들기 – onOptionsItemSelected()


고칠 곳

onOptionsItemSelected()

유저가 액션 버튼이나 액션 오버플로우의 아이템액션을 클릭하면, 액티비티의 onOptionsItemSelected() 콜백 메서드를 호출합니다. 이 메서드의 구현에서, 주어진 MenuItem 에서 어떤 ID가 눌렸는지 확인하기 위해 getItemID()를 호출합니다. getItemID() 리턴 값과 우리가 정의했던 값 ( <item> 엘레먼트의 android:id 속성 값) 은 switch case 문을 통해서 비교하게 됩니다.

(기억나시나요? 위에서 XML 파일에 아이템 2개를 추가했지요. action_searchaction_setting입니다.
그 것들을 switch case 를 통해서 동작들을 맺어주는 것입니다.)

@Override
public boolean onOptionsItemSelected(MenuItem item) {
    // Handle presses on the action bar items
    switch (item.getItemId()) {
        case R.id.action_search:
            openSearch();
            return true;
        case R.id.action_settings:
            openSettings();
            return true;
        default:
            return super.onOptionsItemSelected(item);
    }
}

위의 소스에서 openSearch()와 openSettings()는 에러가 나옵니다 (메서드를 아직 안만들었지요).

 

하위 액티비티를 위해서 Up 버튼 추가하기


고칠 곳

Manifest, Activity

그림 4. Gmail의 Up 버튼.

앱 실행 첫 진입 화면이 아닌 모든 화면 (홈 스크린이 아닌 액티비티들)은 / 유저에게 / 논리적인 상위 스크린을 찾아가는 방법을 제공해야 합니다.
액션바에서 Up 버튼을 클릭해서 할 수 있습니다
(Up 버튼을 누르면 어디로 갈까요? 자신을 불렀던 액티비티로 가야겠지요? 부모 액티비티라고 부르겠습니다.
그렇다면, 그 관계를 누가 알 수 있을까요? 아무도 알 수 없겠지요. 그것을 정해놓아야 하는데, 매니패스트파일에서 그것을 정합니다. 액티비티끼리의 관계를 매니패스트에 등록해 주겠습니다. )

안드로이드 4.1 (API 16) 이상이든 (우리는 10입니다) ActionBarActivity 를 서포트 라이브러리를 통해서 쓸 때든 관계 없이 (우리가 지금 서포트라이브러리를 쓰고 있는 것이지요),  Up navigation 을 구현하려면, 우리는 “부모 액티비티”를 “매니페스트 파일”에서 지정해 줘야합니다. 그리고 Up 버튼을 enable 시켜야 합니다.

매니페스트 파일에서  액티비티의 부모를 정하기 위해서 어떻게 하는지 볼까요?

<application ... >
    ...
    <!-- The main/home activity (it has no parent activity) -->
    <activity
        android:name="com.example.myfirstapp.MainActivity" ...>
        ...
    </activity>
    <!-- A child of the main activity -->
    <activity
        android:name="com.example.myfirstapp.DisplayMessageActivity"
        android:label="@string/title_activity_display_message"
        android:parentActivityName="com.example.myfirstapp.MainActivity" >
        <!-- Parent activity meta-data to support 4.0 and lower -->
        <meta-data
            android:name="android.support.PARENT_ACTIVITY"
            android:value="com.example.myfirstapp.MainActivity" />
    </activity>
</application>

그리고 나서 앱 아이콘을 enable 시킵니다. setDisplayHomeAsUpEnabled() 을 호출하면 됩니다.
Then enable the app icon as the Up button by calling setDisplayHomeAsUpEnabled():

DisplayMessageActivity 에서 파일 수정

@Override
public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_displaymessage);

    getSupportActionBar().setDisplayHomeAsUpEnabled(true);
    // If your minSdkVersion is 11 or higher, instead use:
    // getActionBar().setDisplayHomeAsUpEnabled(true);
}

이제는 시스템이 MainActivity 가 DisplayMessageActivity 의 부모 액티비티라는 것을 알기 때문에,
사용자가 Up 버튼을 누를 때, 시스템은 부모의 액티비티로 가게 됩니다.  – 우리는 Up 버튼의 핸들 만들 필요조차 없어요.

더 자세한 정보는 Providing Up Navigation 를 참고하세요

 

영어 원본 출처 : http://developer.android.com/intl/ko/training/basics/actionbar/adding-buttons.html


One thought on “[2] Action Bar 추가하기 [2] 액션 버튼 추가하기

    채병훈 said:
    2016년 9월 21일 9:27 오후

    안녕하세요 안드로이드 어플 공부하고있는 대학생입니다. 액션바 때문에 한참헤맸는데 드디어 답을 찾았네요 정말 감사드립니다.

    좋아하기

답글 남기기

아래 항목을 채우거나 오른쪽 아이콘 중 하나를 클릭하여 로그 인 하세요:

WordPress.com 로고

WordPress.com의 계정을 사용하여 댓글을 남깁니다. 로그아웃 / 변경 )

Twitter 사진

Twitter의 계정을 사용하여 댓글을 남깁니다. 로그아웃 / 변경 )

Facebook 사진

Facebook의 계정을 사용하여 댓글을 남깁니다. 로그아웃 / 변경 )

Google+ photo

Google+의 계정을 사용하여 댓글을 남깁니다. 로그아웃 / 변경 )

%s에 연결하는 중