본문 바로가기
안드로이드스튜디오 개발

[안드로이드 스튜디오] 오늘의 명언 - 툴바 아이콘 색상바꾸기

by jinu957 2021. 5. 7.
728x90

앱을 만들때 상단에 타이틀이나 메뉴 버튼, 네비게이션 버튼 등을 사용하기 위해서 Toolbar를 많이 사용합니다.

구글링을 해보면 툴바에 아이콘을 넣고 메뉴를 붙이고 검색 등을 넣고 하는 것들은 많이 나오는데 아이콘의 색상을 바꾸는 것은 쉽게 찾을 수가 없더군요

그래서 이번 포스팅에서는 툴바의 아이콘 색상을 바꾸는 법을 적어보도록 하겠습니다.

 

먼저 저의 경우 아래 그림과 같이 툴바에 배경 이미지를 넣었더니 기본으로 나타나는 아이콘의 색상이 흰색이어서 배경때문에 아이콘이 전혀 식별이 되지 않았습니다.

 

툴바 아이콘 색상바꾸기

툴바 아이콘은 위 그림처럼 붉은색 동그라미가 있는 부분입니다.

 

툴바의 아이콘 색상을 변경하려면 res -> values -> styles 에서 변경가능합니다.

<resources xmlns:tools="http://schemas.android.com/tools">

    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
        <!-- Customize your theme here. -->
        <item name="colorPrimary">@android:color/holo_orange_dark</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>

        <item name="toolbarNavigationButtonStyle">@style/AppTheme.Actionbar</item>
        <item name="android:actionOverflowButtonStyle">@style/AppTheme.OverFlow</item>
    </style>

    <style name="AppTheme.Actionbar" parent="Widget.AppCompat.Toolbar.Button.Navigation">
        <item name="android:tint">#5C5C5C</item>
    </style>

    <style name="AppTheme.OverFlow" parent="Widget.AppCompat.ActionButton.Overflow">
        <item name="android:tint">#fff</item>
    </style>

</resources>

새로 프로젝트를 생성하시면 기본적으로 style이 만들어지는데 여기에 툴바 아이콘의 색상을 변경하기 위해

 

<item name="toolbarNavigationButtonStyle">@style/AppTheme.Actionbar</item>
<item name="android:actionOverflowButtonStyle">@style/AppTheme.OverFlow</item>

 

이 두부분을 추가하였습니다.

 

그리고 왼쪽에 있는 버튼은 style을 재정의 하기 위한 부분이 

<style name="AppTheme.Actionbar" parent="Widget.AppCompat.Toolbar.Button.Navigation">

이 부분입니다.

 

그리고 오른쪽에 있는 버튼은 

<style name="AppTheme.OverFlow" parent="Widget.AppCompat.ActionButton.Overflow">

이 부분입니다.

 

여기서 tint의 색상을 바꾸면 아이콘의 색상이 바뀝니다.

간단하죠? 근데 이걸 몰라서 한참 헤맸습니다. ㅜㅜ

 

 

그리고 맨 위에 있는 이미지는 이번에 새로 만든 앱인데 별거 없지만 몇가지 소소한 팁을 포스팅하려고 합니다.

 

혹시 앱이 궁금하신 분은 플레이스토어에 올려놨으니 한번 다운받아서 설치해보시고 리뷰 남겨주시면 감사하겠습니다. ^^;;;

https://play.google.com/store/apps/details?id=com.withu.todayssaying

 
 

 

 

728x90

댓글