development

하단 네비게이션보기에서 선택된 탭의 색상

big-blog 2020. 7. 30. 09:25
반응형

하단 네비게이션보기에서 선택된 탭의 색상


BottomNavigationView프로젝트 에을 추가하고 있으며 선택한 탭에 대해 다른 텍스트 (및 아이콘 색조) 색상을 원합니다 (선택되지 않은 탭 효과를 흐리게 표시하기 위해). android:state_selected="true"색상 선택기 리소스 파일에서 다른 색상을 사용하면 작동하지 않는 것 같습니다. 또한 android:state_focused="true"또는로 추가 항목 항목을 시도했지만 android:state_enabled="true"불행히도 효과가 없습니다. 또한 state_selected기본 (선택하지 않은) 색상에 대해 속성을 false (명시 적으로)로 설정했지만 운이 없었습니다.

레이아웃에 뷰를 추가하는 방법은 다음과 같습니다.

<android.support.design.widget.BottomNavigationView
        android:id="@+id/bottom_navigation"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        app:itemBackground="@color/silver"
        app:itemIconTint="@color/bnv_tab_item_foreground"
        app:itemTextColor="@color/bnv_tab_item_foreground"
        app:menu="@menu/bottom_nav_bar_menu" />

내 색상 선택기 ( bnv_tab_item_foreground.xml) 는 다음과 같습니다 .

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:color="@android:color/darker_gray"  />
    <item android:state_selected="true" android:color="@android:color/holo_blue_dark" />
</selector>

그리고 내 메뉴 리소스 ( bottom_nav_bar_menu.xml) :

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

    <item
        android:id="@+id/action_home"
        android:icon="@drawable/ic_local_taxi_black_24dp"
        android:title="@string/home" />
    <item
        android:id="@+id/action_rides"
        android:icon="@drawable/ic_local_airport_black_24dp"
        android:title="@string/rides"/>
    <item
        android:id="@+id/action_cafes"
        android:icon="@drawable/ic_local_cafe_black_24dp"
        android:title="@string/cafes"/>
    <item
        android:id="@+id/action_hotels"
        android:icon="@drawable/ic_local_hotel_black_24dp"
        android:title="@string/hotels"/>

</menu>

도움을 주시면 감사하겠습니다.


를 만드는 동안 selector항상 기본 상태를 마지막에 유지하십시오. 그렇지 않으면 기본 상태 만 사용됩니다. 다음과 같이 선택기에서 항목을 다시 주문해야합니다.

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_checked="true" android:color="@android:color/holo_blue_dark" />
    <item android:color="@android:color/darker_gray"  />
</selector>

그리고 함께 사용될 상태 BottomNavigationBarstate_checked아닙니다 state_selected.


1. 내부 입술 이름 폴더 (드로우 어블)

2. 컬러 폴더를 마우스 오른쪽 버튼으로 클릭하십시오. 선택 새로 만들기 -> 색상 자원 파일 -> color.xml 파일 생성 (bnv_tab_item_foreground)을 (그림 1 : 파일 구조)

3. bnv_tab_item_foreground를 복사하여 붙여 넣기

<android.support.design.widget.BottomNavigationView
            android:id="@+id/navigation"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_marginEnd="0dp"
            android:layout_marginStart="0dp"
            app:itemBackground="@color/appcolor"//diffrent color
            app:itemIconTint="@color/bnv_tab_item_foreground" //inside folder 2 diff colors
            app:itemTextColor="@color/bnv_tab_item_foreground"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintLeft_toLeftOf="parent"
            app:layout_constraintRight_toRightOf="parent"
            app:menu="@menu/navigation" />

bnv_tab_item_foreground :

 <?xml version="1.0" encoding="utf-8"?>
    <selector xmlns:android="http://schemas.android.com/apk/res/android">
        <item android:state_checked="true" android:color="@color/white" />
        <item android:color="@android:color/darker_gray"  />
    </selector>

그림 1 : 파일 구조 :

Figure 1: File Structure


BottomNavigationView사용 colorPrimary를 선택한 탭에 적용 주제에서 그것을 사용 android:textColorSecondary 비활성 탭 아이콘 색조에 대한.

So you can create a style with the prefered primary color and set it as a theme to your BottomNavigationView in an xml layout file.

styles.xml:

 <style name="BottomNavigationTheme" parent="Theme.AppCompat.Light">
        <item name="colorPrimary">@color/active_tab_color</item>
        <item name="android:textColorSecondary">@color/inactive_tab_color</item>
 </style>

your_layout.xml:

<android.support.design.widget.BottomNavigationView
            android:id="@+id/navigation"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="?android:attr/windowBackground"
            android:theme="@style/BottomNavigationTheme"
            app:menu="@menu/navigation" />

Try using android:state_enabled rather than android:state_selected for the selector item attributes.


If you want to change icons' and texts' colors programmatically:

ColorStateList iconsColorStates = new ColorStateList(
            new int[][]{
                    new int[]{-android.R.attr.state_checked},
                    new int[]{android.R.attr.state_checked}
            },
            new int[]{
                    Color.parseColor("#123456"),
                    Color.parseColor("#654321")
            });

    ColorStateList textColorStates = new ColorStateList(
            new int[][]{
                    new int[]{-android.R.attr.state_checked},
                    new int[]{android.R.attr.state_checked}
            },
            new int[]{
                    Color.parseColor("#123456"),
                    Color.parseColor("#654321")
            });

    navigation.setItemIconTintList(iconsColorStates);
    navigation.setItemTextColor(textColorStates);

It's too late for the answer but helpful for anyone. I was doing a very silly mistake, I was using bottom_color_nav.xml for Select and unselect color change. Still getting not getting proper color in BottomNavigation.

Then I realize, I was return false in onNavigationItemSelected Method that was only issued with my code.


This will work:

setItemBackgroundResource(android.R.color.holo_red_light)

참고URL : https://stackoverflow.com/questions/40325422/selected-tabs-color-in-bottom-navigation-view

반응형