Làm cách nào để thay đổi màu biểu tượng của tab đã chọn của TabLayout?


81

Tôi đang sử dụng a TabLayoutvới a ViewPagervà tôi đang tự hỏi làm cách nào để có thể thay đổi màu của biểu tượng của tab đã chọn trong TabLayout một cách hiệu quả nhất.

Một tài liệu tham khảo hoàn hảo về cách thực hiện điều này là ứng dụng Youtube của Google . Trên trang chính, có bốn biểu tượng được tô màu xám đậm. Khi một tab cụ thể được chọn, biểu tượng của tab sẽ trở thành màu trắng.

Nếu không có bất kỳ thư viện bên thứ ba nào , làm thế nào tôi có thể đạt được hiệu quả tương tự?

Một giải pháp khả thi rõ ràng là với bộ chọn. Nhưng trong trường hợp đó, tôi sẽ phải tìm cả phiên bản màu trắng và màu xám của biểu tượng và sau đó chuyển biểu tượng khi tab được chọn hoặc bỏ chọn. Tôi tự hỏi liệu có phương pháp nào hiệu quả hơn để tôi có thể đánh dấu màu biểu tượng hoặc thứ gì đó không. Tôi không thể tìm thấy điều này trong bất kỳ hướng dẫn nào.

BIÊN TẬP

Giải pháp mà tôi đề cập trực tiếp ở trên yêu cầu sử dụng hai ngăn kéo cho mỗi biểu tượng của tab. Tôi tự hỏi liệu có cách nào tôi có thể làm điều đó theo lập trình với MỘT có thể vẽ cho mỗi biểu tượng của tab hay không.


1
Vui lòng chỉ sử dụng android-studiothẻ nếu nó dành riêng cho IDE.
Sufian

@WayWay bạn đã nhận được giải pháp cho vấn đề này chưa? Tôi cũng đang tìm kiếm tương tự.
Raju

Câu trả lời:


90

Tôi đã tìm thấy một cách có thể dễ dàng.

    viewPager = (ViewPager) findViewById(R.id.viewpager);
    setupViewPager(viewPager);

    tabLayout = (TabLayout) findViewById(R.id.tabs);
    tabLayout.setupWithViewPager(viewPager);
    tabLayout.setOnTabSelectedListener(
            new TabLayout.ViewPagerOnTabSelectedListener(viewPager) {

                @Override
                public void onTabSelected(TabLayout.Tab tab) {
                    super.onTabSelected(tab);
                    int tabIconColor = ContextCompat.getColor(context, R.color.tabSelectedIconColor);
                    tab.getIcon().setColorFilter(tabIconColor, PorterDuff.Mode.SRC_IN);
                }

                @Override
                public void onTabUnselected(TabLayout.Tab tab) {
                    super.onTabUnselected(tab);
                    int tabIconColor = ContextCompat.getColor(context, R.color.tabUnselectedIconColor);
                    tab.getIcon().setColorFilter(tabIconColor, PorterDuff.Mode.SRC_IN);
                }

                @Override
                public void onTabReselected(TabLayout.Tab tab) {
                    super.onTabReselected(tab);
                }
            }
    );

pls u có thể nói tôi đã cố gắng để làm theo cùng một cách nhưng tiếc onTabSelected của tôi không nhận được gọi trong khi gọi nó viewpager.setOnPageChangeListener
Erum

Tôi không biết tại sao onTabSelected không được gọi, nhưng tôi có thể khuyên bạn nên thực hiện gỡ lỗi mã để biết vấn đề là do đâu. Nếu bạn chắc chắn không tìm ra sai lầm, tôi đoán rằng bạn có thể đạt được điều tương tự với setOnPageChangeListener, nhưng có thể khó làm hơn.
Cristian Hoyos,

3
setOnTabSelectedListener bị phản đối, sử dụng addOnTabSelectedListener
Nick Asher

1
xin chào, tôi đang sử dụng customView cho tablayout nhưng không thể thay đổi màu của biểu tượng và xem màu backgorund trên lựa chọn tab bằng customView? Bất kỳ ý tưởng làm thế nào tôi sẽ làm gì?
Erum

46

Điều này có thể được thực hiện rất đơn giản, hoàn toàn bằng xml.

Thêm một dòng vào TabLayout của bạn trong xml app:tabIconTint="@color/your_color_selector", như bên dưới:

 <android.support.design.widget.TabLayout
     android:id="@+id/tab_layout"
     android:layout_width="match_parent"
     android:layout_height="wrap_content"
     app:tabIconTint="@color/your_color_selector"
     app:tabIndicatorColor="@color/selected_color"/>

Sau đó, tạo tệp bộ chọn màu (có tên "your_color_selector.xml" ở trên) trong thư mục res / color:

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

Điều này giả sử bạn có 2 màu, "select_color" và "unselected_color" trong tệp color.xml của mình.


1
if (Build.VERSION.SDK_INT> = 23) {Nó hoạt động} else { stackoverflow.com/a/36161252/8072092 }
Joonsoo

@joonsoo nó hoạt động trên các phiên bản thấp hơn 23. Tôi đang sử dụng trong các dự án xuống API 19.
Vin Norman

43
private void setupTabIcons() {
    tabLayout.getTabAt(0).setIcon(tabIcons[0]);
    tabLayout.getTabAt(1).setIcon(tabIcons[1]);
    tabLayout.getTabAt(2).setIcon(tabIcons[2]);
    tabLayout.getTabAt(3).setIcon(tabIcons[3]);

    tabLayout.getTabAt(0).getIcon().setColorFilter(Color.GREEN, PorterDuff.Mode.SRC_IN);
    tabLayout.getTabAt(1).getIcon().setColorFilter(Color.parseColor("#a8a8a8"), PorterDuff.Mode.SRC_IN);
    tabLayout.getTabAt(2).getIcon().setColorFilter(Color.parseColor("#a8a8a8"), PorterDuff.Mode.SRC_IN);
    tabLayout.getTabAt(3).getIcon().setColorFilter(Color.parseColor("#a8a8a8"), PorterDuff.Mode.SRC_IN);


    tabLayout.setOnTabSelectedListener(new TabLayout.OnTabSelectedListener() {
        @Override
        public void onTabSelected(TabLayout.Tab tab) {
            tab.getIcon().setColorFilter(Color.GREEN, PorterDuff.Mode.SRC_IN);

        }

        @Override
        public void onTabUnselected(TabLayout.Tab tab) {
            tab.getIcon().setColorFilter(Color.parseColor("#a8a8a8"), PorterDuff.Mode.SRC_IN);
        }

        @Override
        public void onTabReselected(TabLayout.Tab tab) {

        }
    });
}

Nó hoạt động tốt ngay từ đầu bt khi bạn đóng và mở ứng dụng đầu tiên sẽ bắt đầu với màu bạn đã đưa.
Sam

Để ngăn điều này, bạn có thể gọi setCurrentItem(0)phiên bản của viewPager khỏi hoạt động khi onBackButton()phương thức được gọi và người dùng sẽ luôn được trả về trên phân đoạn đầu tiên khi anh ta cố gắng thoát khỏi ứng dụng.
Dusan Dimitrijevic

bạn có thể sử dụng tab.getIcon (). clearColorFilter (); để loại bỏ bộ lọc
Ahmad Dehnavi

2
setOnTabSelectedListener không được dùng nữa. Thay vào đó hãy sử dụng addOnTabSelectedListener. developer.android.com/reference/android/support/design/widget/…
Red M

37

Bạn có thể sử dụng ColorStateList.

Đầu tiên, tạo một tệp xml (ví dụ /color/tab_icon.xml) trông giống như thế này và xác định các sắc thái khác nhau cho các trạng thái khác nhau:

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

    <item android:color="@color/icon_light_inactive" />
</selector>

Sau đó, thêm mã này vào mã của bạn:

ColorStateList colors;
if (Build.VERSION.SDK_INT >= 23) {
    colors = getResources().getColorStateList(R.color.tab_icon, getTheme());
}
else {
    colors = getResources().getColorStateList(R.color.tab_icon);
}

for (int i = 0; i < tabLayout.getTabCount(); i++) {
    TabLayout.Tab tab = tabLayout.getTabAt(i);
    Drawable icon = tab.getIcon();

     if (icon != null) {
        icon = DrawableCompat.wrap(icon);
        DrawableCompat.setTintList(icon, colors);
    }
}

Đầu tiên, bạn lấy ColorStateList từ XML của mình (phương pháp không có chủ đề không được dùng nữa, nhưng cần thiết cho các thiết bị trước Marshmallow). Sau đó, bạn đặt cho mỗi biểu tượng của tab đó là TintList thành ColorStateList; sử dụng DrawableCompat (thư viện hỗ trợ) để hỗ trợ các phiên bản cũ hơn.

Đó là nó!


4
đây là giải pháp tốt nhất cho đến nay, vì nó không ngụ ý thay đổi màu biểu tượng theo cách thủ công
xleon

Tôi không, nhưng bạn chỉ phải chèn mã sau vào phương thức onCreate (..) của hoạt động của bạn sau khi TabLayout (được đặt tên tabLayout) đã được khởi tạo.
Felix Edelmann

Chúng ta có thể áp dụng điều này cho tệp biểu tượng svg không?
Red M

Bạn hoàn toàn không thể sử dụng svg trong Android (không có thư viện bổ sung), nhưng giải pháp của tôi cũng hoạt động với Android Vector Drawables (có những ưu điểm tương tự như svg).
Felix Edelmann

Giải pháp của bạn hoạt động nhưng không hoạt động đối với Android 23 dưới đây, tất cả các tab cuối cùng có cùng màu và đó là màu không hoạt động. Bất kỳ suy nghĩ tại sao hoặc một cách giải quyết ??
John

17

Đối với nó Bạn sẽ phải tùy chỉnh các biểu tượng tab bằng cách sử dụng lớp bộ chọn cho mỗi Tab như:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@drawable/advisory_selected" android:state_selected="true" />
<item android:drawable="@drawable/advisory_normal" android:state_selected="false" />


Vì vậy, với phương pháp này, nó giống như một trong những mô tả trong câu hỏi? Tôi sẽ phải tìm hai bảng có thể kéo cho mỗi biểu tượng của tab mà tôi có trong bố cục (mỗi màu một)?
wayway

chính xác. Để làm rõ hơn, hãy chỉnh sửa câu hỏi của bạn bằng mã.
Anshul Tyagi

9

Thêm cái này vào res > colorsthư mục:

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

Thêm mã trong chế độ xem tab trong xml:

app:tabIconTint="@color/selector_tab"

1
if (Build.VERSION.SDK_INT> = 23) {Nó hoạt động} else { stackoverflow.com/a/36161252/8072092 }
Joonsoo

5

Tại sao bạn không sử dụng phông chữ biểu tượng (như phông chữ tuyệt vời) cho các biểu tượng của mình? sau đó thay đổi phông chữ của văn bản tab thành biểu tượng phông chữ mong muốn của bạn .ttf và tận hưởng thay đổi màu văn bản đã chọn thành các biểu tượng tab của bạn!

Tôi, bản thân tôi, đã sử dụng phương pháp này và nó thực sự tốt đẹp và sạch sẽ :)

đầu tiên, thiết lập tiêu đề từ phông chữ biểu tượng mong muốn của bạn:

trong string.xml:

    <string name="ic_calculator">&#xf1ec;</string>
    <string name="ic_bank">&#xf19c;</string>

thì trong MainActivity.Java:

    private void setupViewPager(ViewPager viewPager) {
    ViewPagerAdapter adapter = new ViewPagerAdapter(getSupportFragmentManager());
    adapter.addFragment(new FragmentBank(), getString(R.string.ic_bank));
    adapter.addFragment(new FragmentCalculate(), getString(R.string.ic_calculator));
    viewPager.setAdapter(adapter);
    }

Sau đó, bạn nên thay đổi phông chữ của tiêu đề Tab thành phông chữ tuyệt vời:

    Typeface typeFaceFont = Typeface.createFromAsset(getAssets(), "fontawesome-webfont.ttf");

    TabLayout tabLayout = (TabLayout) findViewById(R.id.tabs);
    tabLayout.setupWithViewPager(viewPager);
    ViewGroup vg = (ViewGroup) tabLayout.getChildAt(0);
    int tabsCount = vg.getChildCount();
    for (int j = 0; j < tabsCount; j++) {
        ViewGroup vgTab = (ViewGroup) vg.getChildAt(j);
        int tabChildsCount = vgTab.getChildCount();
        for (int i = 0; i < tabChildsCount; i++) {
            View tabViewChild = vgTab.getChildAt(i);
            if (tabViewChild instanceof TextView) {
                ((TextView) tabViewChild).setTypeface(typeFaceFont);
            }
        }
    }

và cuối cùng nhưng không kém phần quan trọng, trong tệp .xml liên quan của bạn, hãy đặt màu cho tabTextColor và tabSelectedTextColor của bạn:

<android.support.design.widget.TabLayout
        android:id="@+id/tabs"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:scrollbars="horizontal"
        android:background="@color/colorPrimaryDark"
        app:tabSelectedTextColor="@color/colorAccent"
        app:tabTextColor="@color/textColorPrimary"
        app:tabIndicatorColor="@color/colorAccent"
        app:tabMode="fixed"
        app:tabGravity="fill"/>
</android.support.design.widget.TabLayout>

và màu sắc. xml:

<resources>
    <color name="colorPrimary">#3F51B5</color>
    <color name="colorPrimaryDark">#303F9F</color>
    <color name="colorAccent">#FF4081</color>
    <color name="colorHighlight">#FFFFFF</color>
    <color name="textColorPrimary">#E1E3F3</color>
</resources>

Phông chữ biểu tượng không hoạt động trên một số thiết bị. Vui lòng sử dụng một cách thận trọng.
shanks

4

kiểm tra mã sau. Tùy chỉnh biểu tượng của bạn, một biểu tượng có màu và một biểu tượng khác không có màu.

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@drawable/mybookings_select" android:state_selected="true"/><!-- tab is selected(colored icon)-->
<item android:drawable="@drawable/mybookings" /><!-- tab is not selected(normal no color icon)-->


2

Khi tham khảo câu trả lời thứ hai cho thấy cách đặt màu riêng biệt, nhiều người có thể tự hỏi xung quanh cách xóa màu của biểu tượng đầu tiên trong khi chuyển sang biểu tượng tiếp theo. Những gì bạn có thể làm là như sau:

private void setupTabIcons() {
tabLayout.getTabAt(0).setIcon(tabIcons[0]);
tabLayout.getTabAt(1).setIcon(tabIcons[1]);
tabLayout.getTabAt(2).setIcon(tabIcons[2]);
tabLayout.getTabAt(3).setIcon(tabIcons[3]);

tabLayout.getTabAt(0).getIcon().setColorFilter(Color.GREEN, PorterDuff.Mode.SRC_IN);
tabLayout.getTabAt(1).getIcon().setColorFilter(Color.WHITE, PorterDuff.Mode.SRC_IN);
tabLayout.getTabAt(2).getIcon().setColorFilter(Color.WHITE, PorterDuff.Mode.SRC_IN);
tabLayout.getTabAt(3).getIcon().setColorFilter(Color.WHITE, PorterDuff.Mode.SRC_IN);


tabLayout.setOnTabSelectedListener(new TabLayout.OnTabSelectedListener() {
    @Override
    public void onTabSelected(TabLayout.Tab tab) {
        tab.getIcon().setColorFilter(Color.GREEN,PorterDuff.Mode.SRC_IN);

    }

    @Override
    public void onTabUnselected(TabLayout.Tab tab) {
        //for removing the color of first icon when switched to next tab
        tablayout.getTabAt(0).getIcon().clearColorFilter();
        //for other tabs
        tab.getIcon().clearColorFilter();

    }

    @Override
    public void onTabReselected(TabLayout.Tab tab) {

    }
});}

Tôi đã nhận xét về câu trả lời thứ hai nhưng không có đủ danh tiếng cho điều đó! Lấy làm tiếc. Nhưng hãy làm theo điều đó bạn sẽ tiết kiệm thời gian và cơn đau đầu của mình! Học vui vẻ


2

Bạn có thể sử dụng addOnTabSelectedListener, nó làm việc cho tôi.

tablayout = findViewById(R.id.viewall_tablayout);
pager = findViewById(R.id.viewall_pager);
adapter = new ViewPagerAdapter(getSupportFragmentManager());
adapter.addFragments(new RestFragment(),"Restaurant");
adapter.addFragments(new BarFragment(),"Bar");
adapter.addFragments(new HotelFragment(),"Hotel");
adapter.addFragments(new CoffeeFragment(),"Coffee Shop");
pager.setAdapter(adapter);
tablayout.setupWithViewPager(pager);

tablayout.getTabAt(0).setIcon(R.drawable.ic_restaurant);
tablayout.getTabAt(1).setIcon(R.drawable.ic_glass_and_bottle_of_wine);
tablayout.getTabAt(2).setIcon(R.drawable.ic_hotel_black_24dp);
tablayout.getTabAt(3).setIcon(R.drawable.ic_hot_coffee);

tablayout.getTabAt(0).getIcon().setTint(getResources().getColor(R.color.colorAccent,getTheme()));
tablayout.getTabAt(1).getIcon().setTint(getResources().getColor(R.color.colorAccent,getTheme()));
tablayout.getTabAt(2).getIcon().setTint(getResources().getColor(R.color.colorAccent,getTheme()));
tablayout.getTabAt(3).getIcon().setTint(getResources().getColor(R.color.colorAccent,getTheme()));
tablayout.addOnTabSelectedListener(new TabLayout.OnTabSelectedListener() {
    @Override
    public void onTabSelected(TabLayout.Tab tab) {
        tab.getIcon().setTint(getResources().getColor(R.color.colorPrimary,getTheme()));
    }

    @Override
    public void onTabUnselected(TabLayout.Tab tab) {
        tab.getIcon().setTint(getResources().getColor(R.color.colorAccent,getTheme()));
    }

    @Override
    public void onTabReselected(TabLayout.Tab tab) {

    }
});

1

Một cách khả thi để "Đánh dấu" biểu tượng là truy cập chế độ xem hình ảnh và đặt bộ lọc màu. Hãy thử sử dụng phương thức ImageView setColorFilter (int color) và áp dụng màu trắng.


vâng nhưng làm thế nào chúng ta có thể truy cập vào ImageView khi tab được chọn
Erum

1

tabLayout.setOnTabSelectedListener(new TabLayout.ViewPagerOnTabSelectedListener(viewPager) {...} Đã không được dùng nữa. Thay vì Sử dụng

tabLayout.addOnTabSelectedListener(new TabLayout.BaseOnTabSelectedListener() {
        @Override
        public void onTabSelected(TabLayout.Tab tab) {
            int tabIconColor = ContextCompat.getColor(context, R.color.tabSelectedIconColor);
            tab.getIcon().setColorFilter(tabIconColor, PorterDuff.Mode.SRC_IN);
        }

        @Override
        public void onTabUnselected(TabLayout.Tab tab) {
            int tabIconColor = ContextCompat.getColor(context, R.color.tabUnselectedIconColor);
            tab.getIcon().setColorFilter(tabIconColor, PorterDuff.Mode.SRC_IN);
        }

        @Override
        public void onTabReselected(TabLayout.Tab tab) {

        }
    });

-1

Mở rộng câu trả lời ưa thích của tôi với ColorStateList từ đây , bạn có thể sử dụng giải pháp sau nếu bạn đang sử dụng các tab tùy chỉnh.

Thiết lập các tab trong xml hoạt động của bạn

 ...

<android.support.design.widget.TabLayout
    android:id="@+id/main_tablayout"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <android.support.design.widget.TabItem
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout="@layout/nav_bar_tab_item"/>

    <android.support.design.widget.TabItem
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout="@layout/nav_bar_tab_item"/>
</android.support.design.widget.TabLayout>

...

Và bố cục tab tùy chỉnh nav_bar_item.xml

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
android:id="@+id/nav_bar_item_layout"
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
android:paddingEnd="@dimen/_5sdp"
android:paddingStart="@dimen/_5sdp">

<ImageView
    android:id="@+id/item_img"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent"/>

<TextView
    android:id="@+id/item_description"
    android:layout_width="wrap_content"
    android:gravity="center"

<!-- Use selector here to change the text color when selected/unselected -->
    android:textColor="@color/nav_bar_icons_color"

    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toBottomOf="@+id/item_img"/>

</android.support.constraint.ConstraintLayout>

Trong hoạt động của bạn

    tabLayout = findViewById(R.id.main_tablayout);

    ConstraintLayout navMyHotelLayout = (ConstraintLayout) tabLayout.getTabAt(0)
            .getCustomView();
    tab1Icon = navMyHotelLayout.findViewById(R.id.item_img);
    tab1TextView = navMyHotelLayout.findViewById(R.id.item_description);

    tab1Icon.setImageResource(R.drawable.ic_tab1);

    // Use the selector here to change the color when selected/unselected
    tintImageViewSelector(tab1Icon, R.color.nav_bar_icons_color);

    tab1TextView.setText("tab 1");

    ConstraintLayout navTtdLayout = (ConstraintLayout) tabLayout.getTabAt(1)
            .getCustomView();
    tab2Icon = navTtdLayout.findViewById(R.id.item_img);
    tab2View = navTtdLayout.findViewById(R.id.item_description);

    tab2Icon.setImageResource(R.drawable.ic_tab2);
    tintImageViewSelector(tab2Icon, R.color.nav_bar_icons_color);
    tab2TextView.setText("tab 2");

Và thêm các chức năng trợ giúp này để thay đổi màu sắc

public static void tintDrawableSelector(Drawable vd, final @ColorRes int clrRes, Context context) {

    DrawableCompat.setTintList(vd, ContextCompat.getColorStateList(context, clrRes));
}

public static void tintImageViewSelector(ImageView imgView, final @ColorRes int clrRes, Context context) {

    tintDrawableSelector(imgView.getDrawable(), clrRes);
}

Cuối cùng, bộ chọn nav_bar_icons_color.xml

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

-1

Kiểm tra mã sau:

tabLayout.addOnTabSelectedListener(new TabLayout.OnTabSelectedListener() {
    @Override
    public void onTabSelected(TabLayout.Tab tab) {
        if(tab.getPosition() == 0){
            tabLayout.getTabAt(0).setIcon(tabIcons1[0]);
        }
        if(tab.getPosition() == 1){
            tabLayout.getTabAt(1).setIcon(tabIcons1[1]);
        }
        if(tab.getPosition() == 2){
            tabLayout.getTabAt(2).setIcon(tabIcons1[2]);
        }
    }
    @Override
    public void onTabUnselected(TabLayout.Tab tab) {
        tabLayout.getTabAt(0).setIcon(tabIcons[0]);
        tabLayout.getTabAt(1).setIcon(tabIcons[1]);
        tabLayout.getTabAt(2).setIcon(tabIcons[2]);
    }
    @Override
    public void onTabReselected(TabLayout.Tab tab) {
    }
});

Điều này không hoạt động với chủ đề Material như Theme.MaterialComponents.DayNight
Kishan Solanki

-1

Bạn có thể thay đổi màu văn bản của tab đã chọn bằng cách sử dụng thuộc tính xml sau của bố cục tab:

app:tabSelectedTextColor="your desired color"

Để tùy chỉnh màu biểu tượng của tab đã chọn, bạn cần sử dụng bộ chọn Tạo tệp xml trong thư mục có thể vẽ:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
   <item android:color="selected_item_color" android:state_activated="true" />
   <item android:color="unselected_item_color" />
</selector> 

và thêm bộ chọn này vào thuộc tính xml bố cục tab như bên dưới:

app:tabIconTint="@drawable/name_of_file"

Không hoạt động. Ngoài việc không hoạt động, nếu name_of_file của bạn là drawable / name_of_file.xml, bạn nên đánh dấu nó như vậy, nếu không, bạn sẽ để người đọc đoán ý bạn.
Mitch

name_of_file là chỉ báo cho người đọc về tên của tệp có thể vẽ của riêng họ.
Shrinivasan

-1

Lần lượt thực hiện các bước sau.

app / src / main / res / values ​​/ Colors.xml (Thêm vào Colors.xml)

<color name="icon_enabled">#F3D65F</color>
<color name="icon_disabled">#FFFFFF</color>

app / src / main / res / color / custom_tab_icon.xml (Tạo một thư mục có tên màu trong res. Tạo một tab tùy chỉnh icon.xml trong thư mục.)

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

app / src / main / res / drawable / ic_action_settings.png (Tạo)

nhấp đúp vào action_settings để thêm

<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:width="24dp"
android:height="24dp"
android:viewportWidth="21.6"
android:viewportHeight="21.6"
android:tint="@color/custom_tab_icon">
<group android:translateX="-1.2"
  android:translateY="-1.2">
  <path
      android:fillColor="#FF000000"
 android:pathData="M19.1,12.9a2.8,2.8 0,0 0,0.1 -0.9,2.8 2.8,0 0,0 -0.1,-0.9l2.1,-1.6a0.7,0.7 0,0 0,0.1 -0.6L19.4,5.5a0.7,0.7 0,0 0,-0.6 -0.2l-2.4,1a6.5,6.5 0,0 0,-1.6 -0.9l-0.4,-2.6a0.5,0.5 0,0 0,-0.5 -0.4H10.1a0.5,0.5 0,0 0,-0.5 0.4L9.3,5.4a5.6,5.6 0,0 0,-1.7 0.9l-2.4,-1a0.4,0.4 0,0 0,-0.5 0.2l-2,3.4c-0.1,0.2 0,0.4 0.2,0.6l2,1.6a2.8,2.8 0,0 0,-0.1 0.9,2.8 2.8,0 0,0 0.1,0.9L2.8,14.5a0.7,0.7 0,0 0,-0.1 0.6l1.9,3.4a0.7,0.7 0,0 0,0.6 0.2l2.4,-1a6.5,6.5 0,0 0,1.6 0.9l0.4,2.6a0.5,0.5 0,0 0,0.5 0.4h3.8a0.5,0.5 0,0 0,0.5 -0.4l0.3,-2.6a5.6,5.6 0,0 0,1.7 -0.9l2.4,1a0.4,0.4 0,0 0,0.5 -0.2l2,-3.4c0.1,-0.2 0,-0.4 -0.2,-0.6ZM12,15.6A3.6,3.6 0,1 1,15.6 12,3.6 3.6,0 0,1 12,15.6Z"/>
</group>
</vector>
Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookieChính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.