Android Tablayout：选择/取消选择时使用的图标的不透明度_Android_Android Tablayout

Android Tablayout：选择/取消选择时使用的图标的不透明度

android

Android Tablayout：选择/取消选择时使用的图标的不透明度,android,android-tablayout,Android,Android Tablayout,这是whatsapp应用程序。请注意，当您选择一个选项卡时，“联系人”一词为白色，而其他词“通话和聊天”的alpha值可能为50%：他们是如何做到这一点的我想做一些类似的事情，但是用图标代替文本，但是原则应该是一样的。我已经用我的表格做了以下工作： TabLayout tabLayout = (TabLayout) findViewById(R.id.sliding_tabs); tabLayout.setTabGravity(tabLayout.GRAVITY_FILL);

这是whatsapp应用程序。请注意，当您选择一个选项卡时，“联系人”一词为白色，而其他词“通话和聊天”的alpha值可能为50%：

他们是如何做到这一点的

我想做一些类似的事情，但是用图标代替文本，但是原则应该是一样的。我已经用我的表格做了以下工作：

    TabLayout tabLayout = (TabLayout) findViewById(R.id.sliding_tabs);
    tabLayout.setTabGravity(tabLayout.GRAVITY_FILL);
    tabLayout.setupWithViewPager(viewPager);
    tabLayout.getTabAt(0).setIcon(R.drawable.icon1);
    tabLayout.getTabAt(1).setIcon(R.drawable.icon2);
    tabLayout.getTabAt(2).setIcon(R.drawable.icon3);

这是我的表格布局的xml：

<android.support.design.widget.TabLayout
    android:id="@+id/sliding_tabs"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="#cccccc"
    app:tabPaddingStart="-1dp"
    app:tabPaddingEnd="-1dp" />

我也读过这篇文章：但这并不是我想要的

该线程表示，当您选择或取消选择它时，它将更改整个选项卡的颜色。这意味着你会把图标后面的整个背景换成不同的颜色，而我只希望图标有一个较低的不透明度，而不是背景和图标有一个较低的不透明度

Whatsapp没有这样做-您可以看到只有word CALLS设置为较低的不透明度，而不是word后面的背景。

在您的应用程序中执行此操作 tabLayout.gettab0.getText.setAlpha88

在您的计算机中执行此操作

tabLayout.gettab0.getText.setAlpha88

与Avinash answer类似，您必须对图标执行以下操作：

   //on first open of app, the icons will be set to alpha of 50% for all other icons besides the current selected icon
    tabLayout.getTabAt(0).getIcon().setAlpha(128);
    tabLayout.getTabAt(2).getIcon().setAlpha(128);
    viewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {
        @Override
        public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {

        }

        @Override
        public void onPageSelected(int position) {
            switch (position) {
                case 0:
                    tabLayout.getTabAt(0).getIcon().setAlpha(255);
                    tabLayout.getTabAt(1).getIcon().setAlpha(128);
                    tabLayout.getTabAt(2).getIcon().setAlpha(128);
                    break;
                case 1:
                    tabLayout.getTabAt(0).getIcon().setAlpha(128);
                    tabLayout.getTabAt(1).getIcon().setAlpha(255);
                    tabLayout.getTabAt(2).getIcon().setAlpha(128);
                    break;
                case 2:
                    tabLayout.getTabAt(0).getIcon().setAlpha(128);
                    tabLayout.getTabAt(1).getIcon().setAlpha(128);
                    tabLayout.getTabAt(2).getIcon().setAlpha(255);
                    break;
            }
        }

        @Override
        public void onPageScrollStateChanged(int state) {

        }
    });

与Avinash answer类似，您必须对图标执行以下操作：

   //on first open of app, the icons will be set to alpha of 50% for all other icons besides the current selected icon
    tabLayout.getTabAt(0).getIcon().setAlpha(128);
    tabLayout.getTabAt(2).getIcon().setAlpha(128);
    viewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {
        @Override
        public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {

        }

        @Override
        public void onPageSelected(int position) {
            switch (position) {
                case 0:
                    tabLayout.getTabAt(0).getIcon().setAlpha(255);
                    tabLayout.getTabAt(1).getIcon().setAlpha(128);
                    tabLayout.getTabAt(2).getIcon().setAlpha(128);
                    break;
                case 1:
                    tabLayout.getTabAt(0).getIcon().setAlpha(128);
                    tabLayout.getTabAt(1).getIcon().setAlpha(255);
                    tabLayout.getTabAt(2).getIcon().setAlpha(128);
                    break;
                case 2:
                    tabLayout.getTabAt(0).getIcon().setAlpha(128);
                    tabLayout.getTabAt(1).getIcon().setAlpha(128);
                    tabLayout.getTabAt(2).getIcon().setAlpha(255);
                    break;
            }
        }

        @Override
        public void onPageScrollStateChanged(int state) {

        }
    });

在style.xml中定义以下内容：

<style name="TabLayout" parent="Widget.Design.TabLayout">
    <item name="tabIndicatorColor">@color/white</item>
    <item name="tabSelectedTextColor">@color/white</item>
    <item name="tabTextColor">@color/whiteAlpha</item>
</style>

在style.xml中定义以下内容：

<style name="TabLayout" parent="Widget.Design.TabLayout">
    <item name="tabIndicatorColor">@color/white</item>
    <item name="tabSelectedTextColor">@color/white</item>
    <item name="tabTextColor">@color/whiteAlpha</item>
</style>

作为将来的参考，阿维纳什对文本的回答实际上是错误的。 tabLayout.gettabut0.getText不返回选项卡的TextView，它只是以字符串形式返回其文本。因此，调用setAlphafloat只会给您一个编译错误

这样做的正确方法有点混乱。我们获得选项卡的文本视图，如下所示：

LinearLayout tabLayout = (LinearLayout)((ViewGroup) 
            myTabLayout.getChildAt(0)).getChildAt(positionOfMyTab);
TextView tabTextView = (TextView) tabLayout.getChildAt(1);
tabTextView.setAlpha(myAlphaValue);

这是相当混乱，但它的工作。我不知道谷歌为什么不为TabLayout提供getTextView或类似的方法

此外，setAlphafloat中提供的值现在是介于0.0f和1.0f之间的浮点值。使用1.0f表示完全不透明度，直到255之前。

作为将来的参考，Avinash对文本的回答实际上是不正确的。 tabLayout.gettabut0.getText不返回选项卡的TextView，它只是以字符串形式返回其文本。因此，调用setAlphafloat只会给您一个编译错误

这样做的正确方法有点混乱。我们获得选项卡的文本视图，如下所示：

LinearLayout tabLayout = (LinearLayout)((ViewGroup) 
            myTabLayout.getChildAt(0)).getChildAt(positionOfMyTab);
TextView tabTextView = (TextView) tabLayout.getChildAt(1);
tabTextView.setAlpha(myAlphaValue);

这是相当混乱，但它的工作。我不知道谷歌为什么不为TabLayout提供getTextView或类似的方法

此外，setAlphafloat中提供的值现在是介于0.0f和1.0f之间的浮点值。使用1.0f表示完全不透明度，直到255之前。

这里是Simon答案的更好版本

private fun setCurrentTab(position: Int) {
    val values = arrayListOf(0, 1, 2)
    tabs_vp_pocha.getTabAt(position)?.icon?.alpha = 225
    values.remove(position)
    tabs_vp_pocha.getTabAt(values[0])?.icon?.alpha = 128
    tabs_vp_pocha.getTabAt(values[1])?.icon?.alpha = 128

}

并从ChangePageListener调用上述方法

这是西蒙答案的一个更好的版本

private fun setCurrentTab(position: Int) {
    val values = arrayListOf(0, 1, 2)
    tabs_vp_pocha.getTabAt(position)?.icon?.alpha = 225
    values.remove(position)
    tabs_vp_pocha.getTabAt(values[0])?.icon?.alpha = 128
    tabs_vp_pocha.getTabAt(values[1])?.icon?.alpha = 128

}

并从ChangePageListener调用上述方法

他们是如何做到这一点的因为文字的颜色是我的猜测。我只是想让图标的不透明度低一点——StateListDrawable是图像的等效方法。我尝试使用StateListDrawable，但结果太复杂了。我使用了Avinash的技巧，它成功地工作了。当然，Whatsapp使用的是文本，而不是图标，所以他们可以使用他们是如何做到这一点的因为文字的颜色是我的猜测。我只是想让图标的不透明度低一点——StateListDrawable是图像的等效方法。我尝试使用StateListDrawable，但结果太复杂了。我使用了Avinash的技巧，它成功地工作了。当然，Whatsapp使用的是文本，而不是图标，所以他们可以使用感谢-你的答案让我找到了为图标设置alpha的最终答案+1感谢-您的回答让我找到了为图标设置alpha的最终答案+1如何通过图标和文本的自定义布局实现这一点？@SahilShokeen如果您使用，那么我有一个文本和图标的解决方案。如何通过图标和文本的自定义布局实现这一点？@SahilShokeen如果您使用，那么我有一个文本和图标的解决方案。实际上我找到了一个比这更好的方法：只需设置TabLayout\u tabTextColor和TabLayout\选项卡根据需要选择TextColor属性。请记住，android中的颜色可以有指定的alpha。因此，例如，tabTextColor所有未选定选项卡的选项卡颜色可以是80 FFFFFF，颜色为50%白色，tabSelectedTextColor可以是100%白色，使用FFFFFF，我实际上找到了一种更好的方法：只需根据需要设置TabLayout\u tabTextColor和TabLayout\u tabSelectedTextColor属性。请记住，android中的颜色可以有指定的alpha。因此，例如，tabTextColor所有未选定选项卡的选项卡颜色可以为80 FFFFFF，颜色为50%白色，tabSelectedTextColor可以为100%白色，颜色为FFFFFF