简体   繁体   English

选中后更改Tab的customView

[英]Change customView of Tab when selected

在此处输入图片说明 I want to change image of tab Price when selected. 我想更改价格标签的图像。 When it is pressed first time, it displays products according to price in ascending order ,when same tab is pressed again It displays products according to price in descending Order. 第一次按下时,将按价格升序显示产品,再次按下同一选项卡时,将按价格降序显示产品。 I am unable to change image of tab to display the order. 我无法更改标签的图像以显示订单。 I am using customView for my 3rd tab as it contains image aligned right to text, 我将customView用于我的第三个标签,因为它包含与文本对齐的图像,

Below is my code: 下面是我的代码:

price_tab.xml: price_tab.xml:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:orientation="horizontal">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/price"
        android:textAllCaps="true"
        android:textColor="@android:color/black" />

    <ImageView
        android:id="@+id/icon"
        android:layout_width="24dp"
        android:layout_height="24dp"
        android:src="@drawable/lth" />

</LinearLayout>

ProductActivity.java ProductActivity.java

tablayout.addTab(tablayout.newTab().setText(getText(R.string.popular)), 0);
        tablayout.addTab(tablayout.newTab().setText(getText(R.string.new_tag)), 1);
        tablayout.addTab(tablayout.newTab().setText(getText(R.string.price)), 2);
        View mCustomView = LayoutInflater.from(ProductActivity.this).inflate(R.layout.price_tab, null);
        mImageViewCustom = (ImageView) mCustomView.findViewById(R.id.icon);
        tablayout.getTabAt(2).setCustomView(mCustomView);
        tablayout.addOnTabSelectedListener(new OnTabSelectedListener() {
            @Override
            public void onTabSelected(Tab tab) {

                if (tab.getText().equals(getString(R.string.new_tag))) {
                    sort = 0;
                    page = 1;
                    isLastPage = false;
                    productList.clear();
                    productListAdapter.notifyDataSetChanged();
                    getProducts();


                } else if (tab.getText().equals(getString(R.string.price))) {
                    if (sort != 2) {
                        sort = 2;

                        mImageViewCustom.setImageResource(R.drawable.lth);
                    } else {
                        sort = 3;
                        mImageViewCustom.setImageResource(R.drawable.htl);
                    }
                    page = 1;
                    isLastPage = false;
                    productList.clear();
                    productListAdapter.notifyDataSetChanged();
                    getProducts();

                } else if (tab.getText().equals(getString(R.string.popular))) {
                    sort = 1;


                    page = 1;
                    isLastPage = false;
                    productList.clear();
                    productListAdapter.notifyDataSetChanged();
                    getProducts();
                }

            }

            @Override
            public void onTabUnselected(Tab tab) {

            }

            @Override
            public void onTabReselected(Tab tab) {

                if (tab.getText().equals("Price")) {
                    if (sort == 2) {
                        sort = 3;
                    } else
                        sort = 2;
                    page = 1;
                    isLastPage = false;
                    productList.clear();
                    productListAdapter.notifyDataSetChanged();

                    getProducts();
                }
            }


        });

        getProducts();

在此处输入图片说明

In your onTabReselcted() , try below code: 在您的onTabReselcted() ,尝试以下代码:

@Override
        public void onTabReselected(TabLayout.Tab tab) {
            if (tab.getText().toString().equals("Price")) {
                if (sort == 2) {
                    sort = 3;
                } else
                    sort = 2;
                page = 1;
                isLastPage = false;
                productList.clear();
                productListAdapter.notifyDataSetChanged();

                //change tab icon
                View view = tab.getCustomView();
                if (view != null) {
                   ImageView icon = view.findViewById(R.id.icon);
                   icon.setImageResource(R.drawable.your_image_resource);
                }      

                getProducts();
            }
        }

Depending on your sort logic you can change the icon from increasing to decreasing and vice versa 根据您的sort逻辑,您可以将图标从增加更改为减少,反之亦然

By using this you can customize any tab you want according to the current position of the tab. 通过使用此选项,您可以根据选项卡的当前位置自定义所需的任何选项卡。

private TabLayout tabs;
tabs = view.findViewById(R.id.tabs);

.

 tabs.addOnTabSelectedListener(new TabLayout.OnTabSelectedListener()
            {
                @Override
                public void onTabSelected(TabLayout.Tab tab) {


                    if (tab.getPosition()==your tab position){
                        tabs.setTabTextColors(Color.parseColor("#fdb827"), Color.parseColor("#ffffff"));
                        tabs.setSelectedTabIndicatorColor(Color.parseColor("#ffffff"));

                    }else {
                        tabs.setTabTextColors(Color.parseColor("#fdb827"), Color.parseColor("#F57F17"));
                        tabs.setSelectedTabIndicatorColor(Color.parseColor("#fdb827"));
                    }



                }

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

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

                }
            });

Hope this helps. 希望这可以帮助。

将tab.getText()更改为tab.getText()。toString()

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM