
📒 툴바는 UI 설계 요소로서 App bar(==Action bar)라고 부르며 버전에 따라 구현체가 상이하다.
하지만 툴바는 ActionBar와 달리
툴바를 만들고 코드 상으로 속성을 할당할 수 있다.
toolbar = findViewById(R.id.toolbar)
// toolbar.title = "hello"
// toolbar.background = resources.getDrawable(R.color.teal_200, theme)
toolbar.apply {
title = "hello"
//background = resources.getDrawable(R.color.teal_200, theme)
// background = ColorDrawable(resources.getColor(R.color.teal_200,theme))
background = ResourcesCompat.getDrawable(resources, R.color.teal_200, theme)
}
여러개의 속성을 수정할 때는 apply 표준함수를 쓰는 방식이 가독성이 좋다.
또한 resources 파일을 접근하여 속성값을 주기 위한 방법에는 위처럼 여러 가지가 존재한다.
toolbar.inflatemenu(menuXML)을 통해 메뉴를 결합하고,
XML상에서
showAsAction 설정을 통해 메뉴가 보여지는 속성 설정을 할 수 있다.
toolbar.apply {
inflateMenu(R.menu.menu_main)
}
이 경우 기존에 메뉴를 create 할 때처럼 onOptionsItemSelected를 오버라이딩 하여 메뉴 선택에 따른 실행을 정의하는 것이 아닌
toolbar.setOnMenuItemClickListener {
when (it.itemId) {
R.id.action_search -> {
Log.d(TAG, "onCreate: action_search")
}
R.id.action_setting -> {
Log.d(TAG, "onCreate: action_setting")
}
else -> {
Log.d(TAG, "onCreate: other..")
}
}
true
}
위처럼 setOnMenuItemClickListener
로 할당해준다.
CoordinatorLayout :
AppBarLayout :
<com.google.android.material.appbar.AppBarLayout
android:layout_width="match_parent"
android:layout_height="200dp">
<androidx.appcompat.widget.Toolbar
android:id="@+id/toolbar_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:minHeight="?attr/actionBarSize"
app:layout_scrollFlags="scroll|enterAlwaysCollapsed" />
</com.google.android.material.appbar.AppBarLayout>
스크롤에 따라 어떻게 동작할지는
layout_scrollFlags를 통해 결정한다.
구글의 material design에서 제공하는 레이아웃으로 툴바를 펼쳤다가 접을 수 있도록 한다.
기존의 툴바를 CollapsingToolbarLayout에 담고 AppBarLayout에 넣어 구현한다.
<com.google.android.material.appbar.AppBarLayout
android:layout_width="match_parent"
android:layout_height="200dp">
<com.google.android.material.appbar.CollapsingToolbarLayout
app:title="collapse test"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
app:contentScrim="#FF6B60"
app:expandedTitleGravity="center">
<androidx.appcompat.widget.Toolbar
android:id="@+id/collapsing_toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:layout_collapseMode="pin"
/>
</com.google.android.material.appbar.CollapsingToolbarLayout>
</com.google.android.material.appbar.AppBarLayout>
툴바의 속성을 보면
app:layout_collapseMode="pin"으로 되어있는데 이렇게 하면 툴바 영역이 고정되지만 none으로 하면 아래로 스크롤을 할 때 레이아웃 영역과 함께 사라진다.
parallax로 하면 none으로 할때보다 미세하게 천천히 사라진다.