IT

하단 탐색 보기에서 선택한 탭의 색상

itgroup 2023. 8. 1. 20:26
반응형

하단 탐색 보기에서 선택한 탭의 색상

추가합니다.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>

그리고 사용할 상태.BottomNavigationBar이라state_checked것은 아니다.state_selected.

내부에서 이름 색상을 사용하여 폴더를 다시 작성합니다(그릴 수 있음).

색 폴더를 마우스 오른쪽 단추로 클릭합니다.신규 선택-> 컬러 리소스 파일-> create color.xml 파일 (bnv_tab_item_forground) (그림 1: 파일 구조)

bnv_tab_item_forground 복사하여 붙여넣기

<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_forground:

 <?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활성화되지 않은 탭 아이콘 색조입니다.

따라서 원하는 기본 색상으로 스타일을 만들고 이를 테마로 설정할 수 있습니다.BottomNavigationViewxml 레이아웃 파일에 있습니다.

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_syslog.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" />

아이콘 및 텍스트 색상을 프로그래밍 방식으로 변경하려는 경우:

ColorStateList iconColorStates = 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(iconColorStates);
navigation.setItemTextColor(iconColorStates);

사용 중입니다.com.google.android.material.bottomnavigation.BottomNavigationView(OP와 동일하지 않음) 그리고 위에서 제안한 솔루션을 다양하게 시도했지만, 효과가 있었던 것은 설정뿐이었습니다.app:itemBackground그리고.app:itemIconTint제 선택에 맞는 색깔로 말이죠.

        <com.google.android.material.bottomnavigation.BottomNavigationView
            style="@style/BottomNavigationView"
            android:foreground="?attr/selectableItemBackground"
            android:theme="@style/BottomNavigationView"
            app:itemBackground="@color/tab_color"
            app:itemIconTint="@color/tab_color"
            app:itemTextColor="@color/bottom_navigation_text_color"
            app:labelVisibilityMode="labeled"
            app:menu="@menu/bottom_navigation" />

나의color/tab_color.xml사용하다android:state_checked

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

그리고 나는 또한 선택된 상태 색상을 사용합니다.color/bottom_navigation_text_color.xml

enter image description here

여기서 완전히 관련된 것은 아니지만 완전한 투명성을 위해, 나의.BottomNavigationView스타일은 다음과 같습니다.

    <style name="BottomNavigationView" parent="Widget.Design.BottomNavigationView">
        <item name="android:layout_width">match_parent</item>
        <item name="android:layout_height">@dimen/bottom_navigation_height</item>
        <item name="android:layout_gravity">bottom</item>
        <item name="android:textSize">@dimen/bottom_navigation_text_size</item>
    </style>

대답하기에는 너무 늦었지만 누군가에게 도움이 될 수도 있습니다.매우 어리석은 실수를 하고 있었습니다. Select and unselect 색상 변경에 bottom_color_nav.xml이라는 선택기 파일을 사용하고 있었지만 BottomNavigationView에서 색상 변경을 반영하지 않았습니다.

그러고 보니, 내가 NavigationItem에서 거짓으로 반환하고 있었다는 것을 깨달았습니다.선택한 방법입니다.이 방법으로 true를 반환하면 잘 작동합니다.

textColor를 하려면 ,BottomNavigationView에는 xml에서 직접 설정할 수 있는 두 가지 스타일 속성이 있습니다.

  • itemTextAppearanceActive
  • itemTextAppearanceInactive

layout.xml 파일에서 다음을 수행합니다.

<com.google.android.material.bottomnavigation.BottomNavigationView
            android:id="@+id/bnvMainNavigation"
            style="@style/NavigationView"/>
  

styles.xml 파일에서 다음을 수행합니다.

    <style name="NavigationView" parent="Widget.MaterialComponents.BottomNavigationView">
      <item name="itemTextAppearanceActive">@style/ActiveText</item>
      <item name="itemTextAppearanceInactive">@style/InactiveText</item>
    </style>
    <style name="ActiveText">
      <item name="android:textColor">@color/colorPrimary</item>
    </style>
    <style name="InactiveText">
      <item name="android:textColor">@color/colorBaseBlack</item>
    </style>

사용해 보십시오.android:state_enabledandroid:state_selected선택 항목 속성에 대해 입력합니다.

이렇게 하면 됩니다.

setItemBackgroundResource(android.R.color.holo_red_light)

폴더 구조가 변경되었기 때문에 tab_color.xml은 선택기를 처리할 수 있는 res > drawable에 속합니다.거기서 승인된 해결책이 작동합니다.

선택기를 만드는 대신 스타일을 만드는 가장 좋은 방법입니다.

<style name="AppTheme.BottomBar">
    <item name="colorPrimary">@color/colorAccent</item> 
</style>

텍스트 크기를 선택하거나 선택하지 않은 상태로 변경합니다.

<dimen name="design_bottom_navigation_text_size" tools:override="true">11sp</dimen>
<dimen name="design_bottom_navigation_active_text_size" tools:override="true">12sp</dimen>

Android를 즐겨보세요!

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

반응형