ViewPager 更改页面时更改工具栏颜色

Posted

技术标签:

【中文标题】ViewPager 更改页面时更改工具栏颜色【英文标题】:Change Toolbar color when ViewPager changes page 【发布时间】:2016-07-26 04:12:43 【问题描述】:

我一直在思考这个问题,但我似乎无法弄清楚。我有一个简单的应用程序退出 3 个选项卡 (TabLayout + ViewPager),我想在滑动选项卡时更改 ToolBar 的颜色。我想要实现的效果是在用户滑动到下一个或上一个标签时动态更改颜色。

Check video here

在过去,我可以通过为每个子视图分配颜色并使用PageTransformer 修改工作正常的 alpha 组件来更改 ViewPager 的子视图的背景,但是, ToolBar 不是 ViewPager 的子代,因此我无法为每一页设置颜色,因为始终只有一个 ToolBar

关于如何实现这一点的任何想法?

【问题讨论】:

你为什么不在你的活动中获得对工具栏的引用,然后在 viewpager pagechange 方法中更改它的颜色。这个答案解释了它的用法。 ***.com/a/11294494/4543112 。如果您正在使用托管 3 个选项卡片段的片段,请使用 getActivity().findViewById 而不是 fragmentView.findViewById 为什么不在 FragmentPagerAdapters getItem 方法中更改 ToolBar 颜色。 @iBobb,感谢您的建议,但是在那里设置颜色不会达到我想要的效果。 ToolBar 上的颜色只有在页面完全滚动后才会发生变化,这将是一个突然的变化。我在这里寻找渐变的颜色。 @chRyNaN ToolBar 不属于我的任何片段,这些片段是ViewPager 的子片段,ViewPagerToolBar 处于同一层次结构级别 正确,但您使用 ViewPager 上的适配器来显示片段。如果在 Activity 类中定义了该适配器,则可以访问 ToolBar。否则,创建一个您可以在适配器上设置的自定义侦听器并更改其中的工具栏颜色。 【参考方案1】:

在这种情况下,您应该向 ViewPager 添加一个 onPageChangeListener,然后单独处理每个更改。

public class MyActivity extends AppCompatActivity 
private Toolbar toolbar;
private ViewPager viewPager;

    @Override
    protected void onCreate(Bundle savedInstanceState) 
    super.oncreate(savedInstanceState);

    //Initialize your views

    viewPager.addOnPageChangeListener(new OnPageChangeListener() 
    //Override default methods and change toolbar color inside of here
    );
  

【讨论】:

【参考方案2】:

您可以借助界面和片段内部的 setUserVisibleHint(boolean isVisibleToUser) 来完成此操作。

colorChangeInterface:

public interface ColorChangeInterface 
    void setToolbarAndTabColor(int position);

MainActivity:

public class MainActivity extends AppCompatActivity implements ColorChangeInterface

public void setToolbarAndTabColor(int position)

     if(position==1)
        
            toolbar.setBackgroundColor(ContextCompat.getColor(getApplicationContext(),R.color.classColor4));
            tabLayout.setBackgroundColor(ContextCompat.getColor(getApplicationContext(),R.color.classColor4));
            Log.d("colorchange",String.valueOf(position));
        
        else if(position ==2)
        
            toolbar.setBackgroundColor(ContextCompat.getColor(getApplicationContext(),R.color.classColor2));
            tabLayout.setBackgroundColor(ContextCompat.getColor(getApplicationContext(),R.color.classColor2));
            Log.d("colorchange", String.valueOf(position));


        


FragmentOne:

让你的片段使用默认的覆盖方法 setUserVisibleHint。 这是检查当前Fragment在ViewPager中是否可见,如果Visible使用Interface改变工具栏和Tabbar的颜色。

public class FragmentOne extends Fragment 
 @Override
    public void setUserVisibleHint(boolean isVisibleToUser) 
        super.setUserVisibleHint(isVisibleToUser);
       if (isVisibleToUser)
       
          ColorChangeInterface colorChangeInterface = (ColorChangeInterface) getActivity();
          colorChangeInterface.setToolbarAndPagerColor(1);
           Log.d("TAG","Current Fragment is visible");
        
    

片段二:

 public class FragmentOne extends Fragment 
     @Override
        public void setUserVisibleHint(boolean isVisibleToUser) 
            super.setUserVisibleHint(isVisibleToUser);
           if (isVisibleToUser)
           
              ColorChangeInterface colorChangeInterface = (ColorChangeInterface) getActivity();
              colorChangeInterface.setToolbarAndPagerColor(2);
               Log.d("TAG","Current Fragment is visible");
            
        
    

如果您只是想在每次滑动时更改工具栏颜色。

public class FragmentOne extends Fragment 
Toolbar toolbar;
 protected void onCreate(Bundle savedInstanceState) 
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity);
 toolbar = (Toolbar) findViewById(R.id.toolbar);
        setSupportActionBar(toolbar);
       
         @Override
         public void setUserVisibleHint(boolean isVisibleToUser) 
                super.setUserVisibleHint(isVisibleToUser);
               if (isVisibleToUser)
               
                 toolbar.setBackgroundColor(ContextCompat.getColor(getApplicationContext(),R.color.classColor2));  
             
            
        

【讨论】:

感谢您的回答,但同样,这会突然改变ToolBar 的颜色,我正在寻找基于ViewPager 滑动位置的渐变。查看答案上的视频

以上是关于ViewPager 更改页面时更改工具栏颜色的主要内容,如果未能解决你的问题,请参考以下文章

如何更改工具栏主页图标颜色

如何更改悬停时gridview内可用控件的工具提示的背景颜色

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

如何在 Fragment 对象中控制 ViewPager 更改页面

如何更改 viewpager 中每个片段的点指示器(活动和非活动)的颜色?

Swift 3 / IQKeyboardManager:如何更改工具栏的背景颜色、完成颜色、箭头颜色?