[Android] ActionBar, Menu

leeeha·2022년 9월 10일
0
post-thumbnail

출처: https://sesac.seoul.kr/ (JetPack과 Kotlin을 활용한 Android App 개발 강의)

액션바 소개

  • 화면 상단에 타이틀 문자열이 출력되는 영역
  • 액티비티의 구성요소로, appcompat 라이브러리에서 제공함.


액션바의 테마

res/values/themes.xml 파일에 아래와 같이 기본 색상이 설정되어 있다.

<resources xmlns:tools="http://schemas.android.com/tools">
    <!-- Base application theme. -->
    <style name="Theme.AndroidLab" parent="Theme.MaterialComponents.DayNight.DarkActionBar">
        <!-- Primary brand color. -->
        <item name="colorPrimary">@color/purple_500</item>
        <item name="colorPrimaryVariant">@color/purple_700</item>
        <item name="colorOnPrimary">@color/white</item>
        <!-- Secondary brand color. -->
        <item name="colorSecondary">@color/teal_200</item>
        <item name="colorSecondaryVariant">@color/teal_700</item>
        <item name="colorOnSecondary">@color/black</item>
        <!-- Status bar color. -->
        <item name="android:statusBarColor" tools:targetApi="l">?attr/colorPrimaryVariant</item>
        <!-- Customize your theme here. -->
    </style>
</resources>

테마 색상 변경

AndroidManifest.xml 파일을 보면, theme에 기본적으로 "@style/Theme.AndroidLab"이 적용되어 있다는 걸 확인할 수 있다.

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

    <application
        android:allowBackup="true"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:roundIcon="@mipmap/ic_launcher_round"
        android:supportsRtl="true"
        android:theme="@style/Theme.AndroidLab">
        <activity
            android:name=".MainActivity"
            android:exported="true">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />

                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
    </application>

</manifest>

res/values/themes.xml 파일에서 colorPrimary, colorSecondary 색상을 바꿔보았다.

<resources xmlns:tools="http://schemas.android.com/tools">
    <!-- Base application theme. -->
    <style name="Theme.AndroidLab" parent="Theme.MaterialComponents.DayNight.DarkActionBar">
        <!-- Primary brand color. -->
        <item name="colorPrimary">#FF0000</item>
        <item name="colorPrimaryVariant">@color/purple_700</item>
        <item name="colorOnPrimary">@color/white</item>
        <!-- Secondary brand color. -->
        <item name="colorSecondary">#00FF00</item>
        <item name="colorSecondaryVariant">@color/teal_700</item>
        <item name="colorOnSecondary">@color/black</item>
        <!-- Status bar color. -->
        <item name="android:statusBarColor" tools:targetApi="l">?attr/colorPrimaryVariant</item>
        <!-- Customize your theme here. -->
    </style>
</resources>

그리고 res/values/themes.xml 파일에서 style 태그의 parent 속성을 "Theme.MaterialComponents.DayNight.NoActionBar"로 바꾸면 액션바를 아예 안 보이게 할 수도 있다.


Menu

  • onCreateOptionsMenu() 메서드를 오버라이드 해서 메뉴 구성
  • onOptionsItemSelected() 메서드에서 메뉴 이벤트 처리
package com.tutorial.c37

import android.os.Bundle
import android.view.Menu
import android.view.MenuItem
import android.widget.Toast
import androidx.appcompat.app.AppCompatActivity

class MainActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
    }

    override fun onCreateOptionsMenu(menu: Menu?): Boolean {
        menu?.add(0, 0, 0, "menu1")
        menu?.add(0, 1, 0, "menu2")
        return super.onCreateOptionsMenu(menu)
    }

    override fun onOptionsItemSelected(item: MenuItem): Boolean = when(item.itemId){
        0 -> {
            Toast.makeText(this, "menu1 click", Toast.LENGTH_SHORT).show()
            true
        }
        1 -> {
            Toast.makeText(this, "menu2 click", Toast.LENGTH_SHORT).show()
            true
        }
        else -> super.onOptionsItemSelected(item)
    }
}


MenuInflater

  • 메뉴를 리소스 XML로 정의

  • MenuInflater로 메뉴 XML 파일 적용

Action Item

  • 액션바에 아이콘으로 표시되는 메뉴
  • showAsAction 속성에 따라 조정
    • never (디폴트): 항상 오버플로우 메뉴로 표시
    • ifRoom: 액션바에 공간이 있다면 액션 아이템으로, 없다면 오버플로우 메뉴로 표시
    • always: 항상 액션 아이템으로 표시

ActionView

  • 액션바의 내장 뷰
  • 메뉴 기법으로 이용
  • actionViewClass 속성으로 지정

예제

<?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/menu1"
        android:title="menu1"/>
    <item
        android:id="@+id/menu2"
        android:title="menu2"
        android:icon="@android:drawable/ic_menu_add"
        app:showAsAction="always"/>
    <item
        android:id="@+id/menu3"
        android:title="menu3"
        android:icon="@android:drawable/ic_menu_search"
        app:showAsAction="always"
        app:actionViewClass="androidx.appcompat.widget.SearchView" />
</menu>
package com.tutorial.c37

import android.os.Bundle
import android.view.Menu
import androidx.appcompat.app.AppCompatActivity

class MainActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
    }

    override fun onCreateOptionsMenu(menu: Menu?): Boolean {
        menuInflater.inflate(R.menu.menu_main, menu) // xml 파일 인플레이트 시키기 
        return super.onCreateOptionsMenu(menu)
    }
}

profile
습관이 될 때까지 📝

0개의 댓글