안드로이드 action bar

화면 상단에 배치되어 있는 부분을 의미합니다.

 

 

XML 수정하기

 

먼저 activity_main의 xml을 아래와 같이 수정합니다.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".MainActivity">

    <TextView
        android:id="@+id/textView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="text"
        android:textAppearance="@style/TextAppearance.AppCompat.Large" />

    <TextView
        android:id="@+id/textView2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="text"
        android:textAppearance="@style/TextAppearance.AppCompat.Large" />

</LinearLayout>

 

 

menu 만들기

 

 

Resource type을 Menu로 설정하고 메뉴를 만들어줍니다.

 

그리고 xml을 아래와 같이 수정합니다.

 

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

    <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" />
    <item
        android:id="@+id/item5"
        android:title="5" />
    <item
        android:id="@+id/item6"
        android:title="6" />
    <item
        android:id="@+id/item7"
        android:title="7" />
</menu>

 

 

 

코드 작성하기

 

MainActivity를 아래와 같이 수정해줍니다.

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.main_menu, menu)
        return true
    }

    override fun onOptionsItemSelected(item: MenuItem): Boolean {

        when(item.itemId) {
            R.id.item1 -> textView1.text = "1번 클릭"
            R.id.item2 -> textView1.text = "2번 클릭"
            R.id.item3 -> textView1.text = "3번 클릭"
            R.id.item4 -> textView1.text = "4번 클릭"
            R.id.item5 -> textView1.text = "5번 클릭"
            R.id.item6 -> textView1.text = "6번 클릭"
            R.id.item7 -> textView1.text = "7번 클릭"
        }

        return super.onOptionsItemSelected(item)
    }
}

 

onCreateOptionsMenu에 메뉴를 지정해주고

onOptionsItemSelected에 id에 따른 동작을 지정해줍니다.

 

 

실행을 하게 되면,

 

 

오른쪽 상단에 액션바 모양이 뜨고 

 

 

위와 같이 동작을 하는 것을 확인할 수 있습니다.

 

 

 

showAsAction 설정하기

 

action bar에는 showAsAction 값을 지정할 수 있습니다.

메뉴가 어떻게 보일지 설정하는 것입니다.

 

<item
    android:id="@+id/item1"
    app:showAsAction="always"
    android:title="1" />

 

위와 같이 설정을 하면 아래의 화면처럼 보이게 됩니다.

 

 

 

showAsAction의

 

• never - 메뉴를 Action Bar에 표시하지 않습니다.
• always - 항상 Action Bar에 표시합니다.
• ifRoom - 공간이 되면 Action Bar에 표시합니다.
• withText - title로 지정한 문자열과 함께 표시합니다.
• collapseActionView - 접었다 펼쳤다 하면서 뷰를 표시할 수 있습니다.

 

 

아이콘 지정하기

 

아이콘도 지정을 할 수 있습니다.

 <item
    android:id="@+id/item1"
    app:showAsAction="always"
    android:icon="@drawable/ic_launcher_foreground"
    android:title="1" />
 

 

위와 같이 설정을 하게 되면 아래와 같이 보이게 됩니다.

 

 

 

actionViewClass 적용하기

 

action bar에서는 actionViewClass를 적용할 수도 있습니다.

 

아래는 actionViewClass를 통해 검색 창을 구현하는 것입니다.

 

 

<item
    android:id="@+id/item1"
    app:showAsAction="always"
    android:icon="@drawable/ic_launcher_foreground"
    android:title="1"
    app:actionViewClass="androidx.appcompat.widget.SearchView" />

 

위와 같이 actionViewClass로 SearchView를 구현하면 아래와 같이 동작하는 것을 구현할 수 있습니다.

 

 

 

 

 

만약 showAsAction 값에 collapseActionView를 추가하면 아래와 같이 동작합니다.

app:showAsAction="always|collapseActionView"