Front-End/Kotlin

[Kotlin] 제트팩 라이브러리, Action Bar 메뉴

psy_er 2024. 4. 23. 21:39
728x90

[Kotlin] 제트팩 라이브러리, Action Bar 메뉴

 

< 제트팩 라이브러리 >

 사용자가 자주 사용할만한 기능들을 별도로 묶어 제공해 주는 라이브러리이다.

 

 

< 제트팩 >

제트팩은 구글에서 안드로이드 앱 개발용으로 제공하는 다양한 라이브러리 모음

androidx로 시작하는 패키지명을 사용

앱을 개발하는데 필요한 권장 아키텍처를 제공한다.

API 레벨의 호환성 문제를 해결합니다.

플랫폼 API에서 제공하지 않는 다양한 기능을 제공합니다.

 

 

< androidx 라이브러리 >

화면 구성과 관련된 라이브러리

androidx.appcompat : 앱의 API 레벨 호환성을 해결합니다.

androidx.recyclerview : 목록 화면을 구성합니다.

androidx.viewpager2 : 스와이프로 넘기는 화면을 구성합니다.

androidx.fragment : 액티비티처럼 동작하는 뷰를 제공합니다.

androidx.drawerlayout :옆에서 서랍처럼 열리는 화면을 구성합니다.

 

< appcompat 라이브러리 >

appcompat 라이브러리는 안드로이드 앱의 화면을 구성하는 액티비티를 만들며 API 레벨의 호환성 문제를 해결한다.

import androidx.appcompat.app.AppCompatActivity

class MainActivity : AppCompatActivity(){}

 

< 액션바 >

화면 위쪽에 타이틀 문자열이 출력되는 영역

내비게이션 아이콘, 액션 아이템, 오버플로 메뉴 등 다양한 요소를 액션바에 출력할 수 있다.

 

 

< 액션바 메뉴 >

화면 위쪽에 타이틀 문자열이 출력되는 영역

내비게이션 아이콘, 액션 아이템, 오버플로 메뉴 등 다양한 요소를 액션바에 출력할 수 있습니다.

 

values/themes.xml 파일에서 액션바 삭제!

Theme.MaterialComponents.DayNight.NoActionBar를 상속받으면 액션바가 나오지 않습니다.

<resources xmlns:tools="http://schemas.android.com/tools">
    <!-- Base application theme. -->
    <!-- default가 NoActionBar인 부분을 삭제하면 액션바가 나온다 -->
    <style name="Base.Theme.EventApplication" parent="Theme.Material3.DayNight">
        <!-- Customize your light theme here. -->
        <!-- <item name="colorPrimary">@color/my_light_primary</item> -->
    </style>

    <style name="Theme.EventApplication" parent="Base.Theme.EventApplication" />
</resources>

 

 

< 옵션 메뉴 >

 

메뉴는 액션바의 중요한 구성 요소로 액티비티 화면에서 사용자 이벤트를 사용할 수 있도록 합니다.

액티비티에 메뉴를 추가하고 싶다면 onCreateOptionsMenu()와 onPrepareOptionsMenu() 오버라이드 함수를 이용한다.

onCreateOptionsMenu() 함수는 액티비티가 실행되면서 처음에 한 번만 호출

onPrepareOptionsMenu() 함수는 액티비티가 실행되면서 한 번 호출된 후 오버플로 메뉴가 나타날 때마다 반복해서 호출

 

 

< 리소스로 메뉴 구현 >

메뉴를 구성하는 XML 파일은 res 폴더 아래 menu 디렉터리에 만듭니다.

액션바에 아이콘으로 나타나게 하려면 showAsAction 속성을 이용

never(기본) : 항상 오버플로 메뉴로 출력합니다.

ifRoom : 만약 액션바에 공간이 있다면 액션 아이템으로, 없다면 오버플로 메뉴로 출력합니다.

always : 항상 액션 아이템으로 출력합니다, 항상 화면에 보이도록 메뉴를 보이게 합니다.

 

액티비티 코드에 메뉴 XML 적용

overrid fun onCreateOptionsMenu(menu: Menu?): Boolean {
   menuInflater.inflate(R.menu.menu_main, menu)
   return super.onCreateOptionsMenu(menu)
}

 

메뉴 선택 시 이벤트 처리

override fun onOptionsItemsSelected(item: MenuItem): Boolean = when (item.itemId){
   R.id.menu1 -> {
      Log.d("kkang", "menu1 click")
      true
   }
   R.id.menu2 -> {
      Log.d("kkang", "menu2 click")
      true
   }
   else -> super.onOptionsItemSelected(item)
}

 

메뉴 XML

<?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_search"
        android:title="search"
        app:actionViewClass="androidx.appcompat.widget.SearchView"
        app:showAsAction="always"/>
    <item
        android:id="@+id/item1"
        android:title="아이템1"/>
    <item
        android:id="@+id/item2"
        android:title="아이템2"/>
    <item
        android:id="@+id/item3"
        android:title="아이템3"/>
    <item
        android:id="@+id/item4"
        android:title="아이템4"/>

</menu>

 

 

728x90