使用 PageChangeListener 动态更改选项卡图标的颜色

cmingmai

我想像 Facebook 应用程序一样更改标签图标的颜色。

ViewPager的状态是SCROLL_STATE_DRAGGING,则改变所有图标'颜色向未选定(灰)色,在另一方面,当ViewPager的状态是SCROLL_STATE_SETTLINGSCROLL_STATE_IDLE,然后更改所选择的标签的图标以选择的(白色)的颜色。

我做了一个测试:将当前选定的片段滚动到其他片段但仍保持SCROLL_STATE_DRAGGING状态。

这是一个奇怪的情况,我在模拟器上运行该应用程序,它似乎运行良好,但是当我在真实设备上运行该应用程序时,当ViewPager状态为SCROLL_STATE_IDLE时,它没有将所选选项卡的颜色更改为白色SCROLL_STATE_SETTLING

我添加了一个addOnPageChangeListenerto ViewPager,并在不同状态下改变了颜色。

有小费吗?

这是我的代码:

void setupViews() {
        mViewPager = (ViewPager) findViewById(R.id.container);
        tabLayout = (TabLayout) findViewById(R.id.tabLayout);
        colorSelected = ContextCompat.getColor(ctx, R.color.itemSelected);//white
        colorUnselected = ContextCompat.getColor(ctx, R.color.itemUnselected);//gray

        pagerIcons = new Drawable[2];
        pagerIcons[0] = DrawableCompat.wrap(VectorDrawableCompat.create(ctx.getResources(), R.drawable.ic_list_black_24dp, null));
        pagerIcons[1] = DrawableCompat.wrap(VectorDrawableCompat.create(ctx.getResources(), R.drawable.ic_shopping_cart_black_24dp, null));

        ViewPagerHelper.TabOption option = new ViewPagerHelper.TabOption(true, true);
        helper = new ViewPagerHelper(getSupportFragmentManager(), mViewPager, tabLayout, option);
        helper.bindViewPager();

        helper.addFragmentWithTabIcon(new ExpenseIncomeFragment(), pagerIcons[0], ExpenseIncomeFragment.TAG);
        helper.addFragmentWithTabIcon(new FragmentWishList(), pagerIcons[1], FragmentWishList.TAG);

        mViewPager.setScrollbarFadingEnabled(true);
        mViewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {
            @Override
            public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
                //if (positionOffset>0)DrawableCompat.setTint(pagerIcons[mViewPager.getCurrentItem()], colorUnselected);
                Log.e("MainActivity","position="+position+" 
positionOffset="+positionOffset+" positionOffsetPixels="+positionOffsetPixels);
            }

            @Override
            public void onPageSelected(int position) {
                Log.e("MainActivity","position="+position);

pagerIcons[mViewPager.getCurrentItem()].setColorFilter(colorSelected, PorterDuff.Mode.SRC_IN);
        }

            @Override
            public void onPageScrollStateChanged(int state) {
                int pos = mViewPager.getCurrentItem();
                switch (state) {
                    case ViewPager.SCROLL_STATE_IDLE:
                        Log.e("MainActivity","SCROLL_STATE_IDLE" + " getCurrentItem="+pos);

                        pagerIcons[pos].setColorFilter(colorSelected, PorterDuff.Mode.SRC_IN);
                        break;
                    case ViewPager.SCROLL_STATE_DRAGGING:
                        Log.e("MainActivity","SCROLL_STATE_DRAGGING" + " getCurrentItem="+pos);
                        pagerIcons[pos].setColorFilter(colorUnselected, PorterDuff.Mode.SRC_IN);
                        break;
                    case ViewPager.SCROLL_STATE_SETTLING:
                        Log.e("MainActivity","SCROLL_STATE_SETTLING" + " getCurrentItem="+pos);
                        pagerIcons[pos].setColorFilter(colorSelected, PorterDuff.Mode.SRC_IN);
                        break;
                }

            }
        });
        helper.update();

        mViewPager.setCurrentItem(0);
        int len = pagerIcons.length;
        for (int i = 0; i < len; i++) {
            pagerIcons[i].setColorFilter(colorUnselected,
            PorterDuff.Mode.SRC_IN);
        }
        pagerIcons[0].setColorFilter(colorSelected,PorterDuff.Mode.SRC_IN);

    });
}

该类ViewPagerHelper用于绑定ViewPagerTabLayout. pagerIcons是选项卡图标的可绘制对象,我为它们着色。

我是p。

由于您正在使用矢量可绘制对象,您可以用不同的方式解决这个问题。你可以摆脱整体OnPageChangeListener,让自己只剩下这个:

void setupViews() {
    mViewPager = (ViewPager) findViewById(R.id.container);
    tabLayout = (TabLayout) findViewById(R.id.tabLayout);

    pagerIcons = new Drawable[2];
    pagerIcons[0] = VectorDrawableCompat.create(ctx.getResources(), R.drawable.ic_list_black_24dp, null);
    pagerIcons[1] = VectorDrawableCompat.create(ctx.getResources(), R.drawable.ic_shopping_cart_black_24dp, null);

    ViewPagerHelper.TabOption option = new ViewPagerHelper.TabOption(true, true);
    helper = new ViewPagerHelper(getSupportFragmentManager(), mViewPager, tabLayout, option);
    helper.bindViewPager();

    helper.addFragmentWithTabIcon(new ExpenseIncomeFragment(), pagerIcons[0], ExpenseIncomeFragment.TAG);
    helper.addFragmentWithTabIcon(new FragmentWishList(), pagerIcons[1], FragmentWishList.TAG);

    mViewPager.setScrollbarFadingEnabled(true);
    helper.update();

    mViewPager.setCurrentItem(0);
}

不用尝试在 Java 中管理图标的颜色,您可以让系统通过在<vector>可绘制对象中管理它们来让系统为您完成首先,在您的res/color/目录中创建一个颜色选择器文件

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:color="@color/itemSelected" android:state_selected="true"/>
    <item android:color="@color/itemUnselected"/>
</selector>

然后在您的矢量文件中使用此颜色:

<vector
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:width="24dp"
    android:height="24dp"
    android:viewportWidth="24.0"
    android:viewportHeight="24.0">
    <path
        android:fillColor="@color/my_color_selector"
        android:pathData="M3,13h2v-2L3,11v2zM3,17h2v-2L3,15v2zM3,9h2L5,7L3,7v2zM7,13h14v-2L7,11v2zM7,17h14v-2L7,15v2zM7,7v2h14L21,7L7,7z"/>
</vector>

如果您需要支持低于 21 的 API 级别,则不能直接在矢量中使用颜色选择器。相反,为每个矢量可绘制对象创建两个副本,一个使用选定的颜色,一个使用未选择的颜色。然后StateListDrawable在 Java 中构建一个并将其分配给您的pagerIcons数组:

Drawable selected0 = ContextCompat.getDrawable(this, R.drawable.ic_list_black_24dp_selected);
Drawable unselected0 = ContextCompat.getDrawable(this, R.drawable.ic_list_black_24dp_unselected);

StateListDrawable statelist0 = new StateListDrawable();
statelist0.addState(new int[]{android.R.attr.state_selected}, selected0);
statelist0.addState(StateSet.WILD_CARD, unselected0);

pagerIcons[0] = statelist0;

无论您是可以在 XML 中使用颜色选择器还是必须在 Java 中构建 StateListDrawable,根本概念都是一样的:让 Android 框架决定选择哪个选项卡,并让它为您处理颜色。

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

是否有任何解决方案可以在使用反应导航处于活动状态时更改选项卡导航图标的颜色

来自分类Dev

使用 MaterializeCSS 更改选项卡内容的背景颜色

来自分类Dev

如何使用Android中的代码使用TabLayout更改选定的选项卡文本颜色?

来自分类Dev

使用PHP / Ajax更改选项卡(和URL)

来自分类Dev

如何使用$ stateProvider更改选项卡的内容?

来自分类Dev

android TabLayout更改选定选项卡图标的颜色,显示暗白色

来自分类Dev

iOS-如何更改选项卡栏中图标的颜色moreViewController

来自分类Dev

android TabLayout更改选定选项卡图标的颜色,显示暗白色

来自分类Dev

如何使用PHPExcel更改Excel选项卡的颜色?

来自分类Dev

使用AngularJS选择时更改选项卡链接上的类

来自分类Dev

如何通过外部事件处理程序使用JavaFX更改选项卡?

来自分类Dev

使用AngularJS进行选择时,更改选项卡链接上的类

来自分类Dev

如何使用视图控制器更改选项卡栏项目关系?

来自分类Dev

VBA - 复制模板工作表并使用用户输入的文本重命名并修改选项卡颜色

来自分类Dev

如何更改选项卡栏上不活动的图标/文本颜色?

来自分类Dev

使用tabview更改选项卡时如何在SwiftUI中使计时器保持触发

来自分类Dev

使用jQuery更改活动选项卡

来自分类Dev

使用jQuery更改活动选项卡

来自分类Dev

使用角度更改活动选项卡

来自分类Dev

使用CSS进行选项卡更改时平滑的颜色过渡

来自分类Dev

使用自定义字体更改Tablayout的选定选项卡颜色

来自分类Dev

使用Java脚本在onClick事件中更改菜单选项卡的颜色

来自分类Dev

如何使用新的 WebExtensions 附加组件更改 Firefox 选项卡颜色?

来自分类Dev

使用 css 更改水平子菜单中活动选项卡的颜色

来自分类Dev

如何在NetBeans中更改选项卡图标?

来自分类Dev

如何更改选项卡指示器的颜色

来自分类Dev

单击按钮时更改选项卡颜色

来自分类Dev

vim:更改选项卡栏的颜色

来自分类Dev

gnome 终端更改选项卡颜色 ubuntu 19.04

Related 相关文章

  1. 1

    是否有任何解决方案可以在使用反应导航处于活动状态时更改选项卡导航图标的颜色

  2. 2

    使用 MaterializeCSS 更改选项卡内容的背景颜色

  3. 3

    如何使用Android中的代码使用TabLayout更改选定的选项卡文本颜色?

  4. 4

    使用PHP / Ajax更改选项卡(和URL)

  5. 5

    如何使用$ stateProvider更改选项卡的内容?

  6. 6

    android TabLayout更改选定选项卡图标的颜色,显示暗白色

  7. 7

    iOS-如何更改选项卡栏中图标的颜色moreViewController

  8. 8

    android TabLayout更改选定选项卡图标的颜色,显示暗白色

  9. 9

    如何使用PHPExcel更改Excel选项卡的颜色?

  10. 10

    使用AngularJS选择时更改选项卡链接上的类

  11. 11

    如何通过外部事件处理程序使用JavaFX更改选项卡?

  12. 12

    使用AngularJS进行选择时,更改选项卡链接上的类

  13. 13

    如何使用视图控制器更改选项卡栏项目关系?

  14. 14

    VBA - 复制模板工作表并使用用户输入的文本重命名并修改选项卡颜色

  15. 15

    如何更改选项卡栏上不活动的图标/文本颜色?

  16. 16

    使用tabview更改选项卡时如何在SwiftUI中使计时器保持触发

  17. 17

    使用jQuery更改活动选项卡

  18. 18

    使用jQuery更改活动选项卡

  19. 19

    使用角度更改活动选项卡

  20. 20

    使用CSS进行选项卡更改时平滑的颜色过渡

  21. 21

    使用自定义字体更改Tablayout的选定选项卡颜色

  22. 22

    使用Java脚本在onClick事件中更改菜单选项卡的颜色

  23. 23

    如何使用新的 WebExtensions 附加组件更改 Firefox 选项卡颜色?

  24. 24

    使用 css 更改水平子菜单中活动选项卡的颜色

  25. 25

    如何在NetBeans中更改选项卡图标?

  26. 26

    如何更改选项卡指示器的颜色

  27. 27

    单击按钮时更改选项卡颜色

  28. 28

    vim:更改选项卡栏的颜色

  29. 29

    gnome 终端更改选项卡颜色 ubuntu 19.04

热门标签

归档