테마를 NoActionBar로 변경하고 새로운 actionBar를 만들어서 커스텀하는 방식 사용
themes.xml
에서 변경 가능android:statusBarColor
에서 원하는 색상으로 변경 후 사용colorPrimaryVariant
로 설정한 색상이 기본 적용되어있다.strings.xml
에서 app_name의 value값을 변경해주면 된다.1. 기본적으로 적용되어있는 style을 NoActionBar로 변경하기
2. 기본적으로 적용되어있는 style에 item을 추가하여 noActionBar로 만들기
3. 새로운 style을 만들어서 AndroidManifest에 적용하기
<resources xmlns:tools="http://schemas.android.com/tools">
<!-- Base application theme. -->
<style name="Theme.TitleBar" 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>
themes.xml
에서 style parent 변경하기<style name="Theme.TitleBar" parent="Theme.MaterialComponents.Light.NoActionBar">
themes.xml
에서 item 추가하기 <item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
themes.xml
에서 style parent 설정하기<style name="Theme.TitleBar.noActionBar" parent="Theme.MaterialComponents.Light.NoActionBar" />
★ 하지만 이 방법은 적용이 안 되는 경우가 있다 ★
<item name="android:windowFullscreen">true</item>
window.setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN, WindowManager.LayoutParams.FLAG_FULLSCREEN)
res > menu > New > Menu Resource File
파일명과, 경로 등을 설정 후 OK
icon은 Vector Asset으로 만든 icon을 사용.
showAsAction의 ifRoom은 공간이 있을 때는 icon을 보여주고 공간이 없을 때는 햄버거버튼으로 보여준다
햄버거버튼으로 보여줄 경우 title이 보여진다.
- xml 파일 내의 Design 화면
activity_main.xml
<com.google.android.material.appbar.AppBarLayout
android:id="@+id/appBarLayout"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:layout_constraintTop_toTopOf="parent">
<androidx.appcompat.widget.Toolbar
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:logo="@drawable/ic_launcher_foreground"
app:popupTheme="@style/Theme.TitleBar.PopupOverlay"
app:menu="@menu/top_nav_menu" />
</com.google.android.material.appbar.AppBarLayout>
- 기본이 ConstraintLayout이기 때문에 AppBarLayout에 constraint를 설정해주어야 한다
?attr/actionBarSize
는 대략 56dp의 사이즈이고, 기본적으로 적용되어있는 actionBar의 사이즈와 동일하다- popupTheme의 PopupOverlay style은
- res > values > themes >themes.xml
에 새로운 style 설정해놓음<style name="Theme.TitleBar.PopupOverlay" parent="ThemeOverlay.AppCompat.Light" />
- menu에 위에서 만들어줬던
top_nav_menu.xml
파일을 연동시켜주면 된다.
activity_main.xml
android:layout_marginTop="?attr/actionBarSize"
android:layout_marginBottom="?attr/actionBarSize"