웹사이트 검색

Android ActionBar 예제 자습서


오늘은 Android ActionBar에 대해 알아보겠습니다. 작업 표시줄은 웹 애플리케이션이든 모바일 앱이든 모든 애플리케이션의 중요한 부분 중 하나입니다. 오늘은 ActionBar 컴포넌트를 이용하여 안드로이드 앱에서 액션바를 구현하는 방법에 대해 알아보겠습니다.

안드로이드 액션바

  • 앱 아이콘: 앱 브랜드 로고 또는 아이콘이 여기에 표시됩니다.
  • View Control: 애플리케이션 제목을 표시하기 위한 전용 공간입니다. 스피너 또는 탭 탐색을 추가하여 보기 사이를 전환하는 옵션도 제공합니다.
  • 액션 버튼: 앱의 몇 가지 중요한 동작을 여기에 추가할 수 있습니다.
  • 작업 오버플로: 중요하지 않은 모든 작업이 메뉴로 표시됩니다.

Android ActionBar 설정

테마 Theme.Holo 또는 Theme.Holo에서 파생된 테마를 사용하는 모든 활동에는 자동으로 ActionBar가 포함됩니다.

안드로이드 액션바 메뉴

도구 모음 아이콘과 작업 오버플로 항목을 작업 표시줄로 가져오는 가장 간단한 방법은 res/menu 폴더에 있는 메뉴 XML 리소스 파일을 만드는 것입니다. 다음과 같이 폴더에 있는 원시 xml 파일에 메뉴 항목을 추가할 수 있습니다. menu_main.xml

<menu xmlns:android="https://schemas.android.com/apk/res/android"
    xmlns:app="https://schemas.android.com/apk/res-auto"
    xmlns:tools="https://schemas.android.com/tools" tools:context=".MainActivity">
    
    <item
        android:id="@+id/add" android:icon="@android:drawable/ic_menu_add" app:showAsAction="always"   android:title="@string/add"/>
    <item
        android:id="@+id/reset" android:icon="@android:drawable/ic_menu_revert" app:showAsAction="always|withText" android:title="@string/reset"/>
    <item
        android:id="@+id/about" android:icon="@android:drawable/ic_dialog_info" app:showAsAction="never" android:title="@string/about">
    </item>
    <item
        android:id="@+id/exit"  app:showAsAction="never" android:title="@string/exit">
    </item>
</menu>

모든 메뉴 항목에 대해 구성해야 하는 네 가지 항목이 있습니다.

  1. android:id: 속성은 메뉴 항목의 ID를 지정합니다. 이것은 Android 앱의 다른 곳에서 ID처럼 작동합니다. @+id/로 시작하는 android:id 값은 R.menu 상수 컬렉션에 상수를 생성합니다.
  2. android:title: 메뉴 항목의 제목을 포함하는 속성 값
  3. android:icon: 속성은 드로어블 디렉토리의 아이콘을 참조합니다.
  4. android:showAsAction: 이 속성은 지정된 항목이 작업 표시줄에 표시되는 방식을 나타냅니다. 아래에 언급된 플래그 중에서 선택할 수 있습니다.\n
    • 항상 ActionBar에 유지
    • ifRoom은 공간이 있는 경우에만 유지
    • 이것은 메뉴 항목이 아이콘으로 ActionBar에 배치되지 않는다는 것을 의미하지 않습니다. 팝업되는 메뉴에서 메뉴 버튼을 클릭했을 때만 보입니다.
    • |withText : 툴바 버튼이 단순한 아이콘이 아니라 아이콘이자 제목임을 나타내기 위해 이것을 always 또는 ifRoom에 추가할 수 있습니다.

항상 도구 모음 버튼이 되는 것은 아닙니다. 100개의 항상 항목을 요청하면 모든 항목을 위한 공간이 없을 것입니다. 그러나 항상 항목은 작업 표시줄의 공간에서 ifRoom 항목보다 우선 순위를 갖습니다.

메뉴를 Android ActionBar로 확장

메뉴 XML 파일에 정의된 메뉴 항목을 표시하려면 메뉴 파일을 확장해야 합니다. ActionBar를 추가하려는 활동의 onCreateOptionsMenu() 메서드 내에서 작업을 수행합니다. 다음은 코드 스니펫입니다.

@Override
public boolean onCreateOptionsMenu(Menu menu) {
    // Inflate the menu; this adds items to the action bar if it is present.
    getMenuInflater().inflate(R.menu.menu_main, menu);
    return true;
}

R.menu.menu_main 매개변수는 메뉴 XML 파일을 참조하는 상수입니다. 메뉴 매개변수는 메뉴 항목을 확장하려는 메뉴입니다.

Android 작업 표시줄 이벤트에 응답

사용자가 이러한 항목 중 하나를 탭할 때 확인하려면 아래와 같이 MainActivity에서 onOptionsItemSelected()를 재정의해야 합니다.

@Override
public boolean onOptionsItemSelected(MenuItem item) { switch(item.getItemId()) {
    case R.id.add:
        //add the function to perform here
        return(true);
    case R.id.reset:
        //add the function to perform here
        return(true);
    case R.id.about:
        //add the function to perform here
        return(true);
    case R.id.exit:
        //add the function to perform here
        return(true);
}
    return(super.onOptionsItemSelected(item));
}

이제 프로젝트의 각 메뉴 항목에 몇 가지 기본 기능을 할당해 보겠습니다.

프로젝트 구조

Android ActionBar 예제 코드

아래 스니펫에 표시된 대로 MainActivity에 4개의 메뉴 항목을 구현했습니다. MainActivity.java

package com.journaldev.actionbar;

import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.Menu;
import android.view.MenuItem;
import android.widget.TextView;
import android.widget.Toast;

public class MainActivity extends AppCompatActivity {

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

    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        // Inflate the menu; this adds items to the action bar if it is present.
        getMenuInflater().inflate(R.menu.menu_main, menu);
        return true;
    }

    @Override
    public boolean onOptionsItemSelected(MenuItem item) { switch(item.getItemId()) {
        case R.id.add:
            count=(TextView)findViewById(R.id.textView);
            count.setText("Add is clicked");
            return(true);
        case R.id.reset:
            count=(TextView)findViewById(R.id.textView);
            count.setText("Nothing is selected");
            return(true);
        case R.id.about:
            Toast.makeText(this, R.string.about_toast, Toast.LENGTH_LONG).show();
            return(true);
        case R.id.exit:
            finish();
            return(true);

    }
        return(super.onOptionsItemSelected(item));
    }
}

항목에는 각각의 기능이 할당됩니다. 선택한 항목은 menu_main.xml 파일에 정의된 해당 ID에서 결정됩니다. 여기서는 처음 두 항목의 TextView 내용을 변경하고 세 번째 항목에 토스트를 표시하고 네 번째 항목에서 응용 프로그램을 종료합니다. AppCompatActivity는 사용되지 않는 버전의 ActionBarActivity를 대체합니다. styles.xml 파일은 다음과 같이 정의됩니다.

<resources>

    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
        <!-- Customize your theme here. -->
    </style>

</resources>

보시다시피 부모 테마는 기본적으로 ActionBar를 보유하는 Theme.AppCompat의 파생물을 사용합니다(Theme.AppCompat.Light.NoActionBar 클래스를 사용하지 않는 한). 따라서 여기에서 명시적으로 정의할 필요가 없습니다.

Android 액션바 백포팅

  1. ActionBar는 Android Honeycomb 3.0 이후에 도입되었으므로 minSdkVersion이 11 이하일 때 ActionBar를 구현하려면 여기서 이전 버전과의 호환성을 활성화하기 위해 수행한 것처럼 app-compat-v7 jar를 Gradle로 가져와야 합니다.
  2. 또 다른 방법은 액션 바 백포트와 독립적인 ActionBarSherlock을 사용하여 MainActivity를 가져오고 확장하는 것입니다. 이 클래스는 Android 3.0 이후에 도입되었기 때문입니다.

Android ActionBar 예제 프로젝트 다운로드