美团App首页实现之Category_HeaderView可翻页实现

一。主要实现功能：

    自定义indicator，侧滑页面切换页面内容，indicator跟着变化；

二。实现步奏：

    1.自定义ViewPagerIndicator

      ①：定义三个不同颜色的画笔

          

       ②：在画布上画三个静态圆

                    

       ③：改变CX值使indicator居中

                      float CX =(float) (ScreenUtils.getScreenWidth(getContext()) / 2 - (num - 1) * 1.5 * RADIUS);

       ④：设置移动的方法，当移动到最后一个时，不能再移动

                      

    2.实现片段添加

      ①： 新建空白main_header_category,viewPager和indicator同级，如下图

                    

      ②：新建片段category01,实现布局：

                      

     ③：在categoryFragment中根据页码设置不同数据源

          

        特别注意textView中drawable数据源要如此设置：

          

      ④： 在主页所在片段中初始化该headerView及其所包含的ViewPage和indicator

      ⑤： 设置该headerview的PagerChangerListener，设置其适配器，使其根据PagerPosition切换页面数据来源，从而改变内容

        

   3.ListView添加HeaderView

     

     最终首页多个HeaderView效果如下图

转载于:https://blog.51cto.com/1137907860/1666097