Android 推荐几款好用的开源作品(一)之ViewPager指示器

今天介绍的这款ViewPager指示器叫做,MagicIndicator,一款高扩展性ViewPager指示器,曾经用过ViewPagerIndicator作为指示器,但是后来需求中需要定制,扩展不方便,所以就放弃使用了,然而这款MagicIndicator,扩展极其方便,而且内置指示器也非常多,有图有真相:

                                               


开源地址点击下载,目前开发者只提供了以Module的方式添加到自己的工程中去,具体集成方式如下:

1、下载完成之后,在Studio界面选择Import Module,选择自己下载好的确定OK

                            

2、添加依赖

dependencies {
    compile project(':magicindicator')
}
3、之后就可以在项目中使用了,最近写了一个小项目,就是使用的 MagicIndicator作为ViewPager指示器的,代码如下:

public class CategoryActivity extends BaseActivity {


    private ViewPager mPager;
    private List<String> titles = new ArrayList<String>();
    private List<Integer> categoryIdList = new ArrayList<Integer>();

    @Override
    protected void initView() {
        setContentView(R.layout.activity_viewpager);
        setBack();
        setTitle("商品分类");
        mPager = (ViewPager) findViewById(R.id.view_pager);
        mPager.setAdapter(mAdapter);
    }

    @Override
    protected void initData() {//访问网络,获取数据
        buildProgressDialog(getString(R.string.loading));
        webHttpconnection.getValue(Constant.GET_PRODUCT_CATEGORY + SNApplication.getInstance().getUserInfo().getUserId(), 1, true);
    }

    @Override
    public void requestJsonOnSucceed(String json, int msgFlag) {//网路访问成功回调
        super.requestJsonOnSucceed(json, msgFlag);
        if (1 == msgFlag) {
            Category category = JSON.parseObject(json, Category.class);
            if (1 == category.getCode() && null != category.getList()) {
                List<CategoryEntity> entities = category.getList();
                for (int i = 0; i < entities.size(); i++) {
                    titles.add(entities.get(i).getCategory_name());//接口返回的tab name
                    categoryIdList.add(entities.get(i).getId());//接口返回的id
                }
                initMagicUI();
                mAdapter.notifyDataSetChanged();
            }
        }
    }

    @Override
    protected void setOnClickEvent() {

    }

    private void initMagicUI() {
        final MagicIndicator magicIndicator = (MagicIndicator) findViewById(R.id.magic_indicator);
        final CommonNavigator commonNavigator = new CommonNavigator(this);
//        commonNavigator.setEnablePivotScroll(true);//多指示器模式,可以滑动
        commonNavigator.setAdjustMode(true);  // 自适应模式
        commonNavigator.setAdapter(new CommonNavigatorAdapter() {
            @Override
            public int getCount() {
                return titles == null ? 0 : titles.size();
            }

            @Override
            public IPagerTitleView getItemView(Context context, final int index) {
                ScaleTransitionPagerTitleView colorTransitionPagerTitleView = new ScaleTransitionPagerTitleView(context);
                colorTransitionPagerTitleView.setText(titles.get(index));
                colorTransitionPagerTitleView.setTextSize(18);
                colorTransitionPagerTitleView.setNormalColor(Color.GRAY);
                colorTransitionPagerTitleView.setSelectedColor(Color.BLACK);
                colorTransitionPagerTitleView.setOnClickListener(new View.OnClickListener() {
                    @Override
                    public void onClick(View v) {
                        mPager.setCurrentItem(index);
                    }
                });
                return colorTransitionPagerTitleView;
            }
            @Override
            public IPagerIndicator getIndicator(Context context) {
                BezierPagerIndicator indicator = new BezierPagerIndicator(context);
                List<String> colorList = new ArrayList<String>();
                colorList.add("#ff4a42");
                colorList.add("#fcde64");
                colorList.add("#73e8f4");
                colorList.add("#76b0ff");
                colorList.add("#c683fe");
                indicator.setColorList(colorList);
                return indicator;
            }
        });
        magicIndicator.setNavigator(commonNavigator);


        mPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {
            @Override
            public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
                magicIndicator.onPageScrolled(position, positionOffset, positionOffsetPixels);
            }

            @Override
            public void onPageSelected(int position) {
                magicIndicator.onPageSelected(position);
            }

            @Override
            public void onPageScrollStateChanged(int state) {
                magicIndicator.onPageScrollStateChanged(state);
            }
        });
    }


    private FragmentPagerAdapter mAdapter = new FragmentPagerAdapter(getSupportFragmentManager()) {
        @Override
        public Fragment getItem(int position) {
            return MainFragment.newInstance(categoryIdList.get(position));
        }

        @Override
        public int getCount() {
            return titles.size();
        }
    };

}
4、效果图

                                                                       



  • 4
    点赞
  • 22
    收藏
    觉得还不错? 一键收藏
  • 3
    评论
ViewPager指示器是用来显示ViewPager当前页面位置的小组件,一般位于ViewPager的底部或顶部。下面给出一个简单的ViewPager指示器的实现方法。 首先,我们需要在布局文件中添加一个ViewPager和一个指示器组件,可以使用LinearLayout或RelativeLayout等布局容器。 ``` <RelativeLayout android:layout_width="match_parent" android:layout_height="match_parent"> <androidx.viewpager.widget.ViewPager android:id="@+id/view_pager" android:layout_width="match_parent" android:layout_height="match_parent"/> <LinearLayout android:id="@+id/indicator" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentBottom="true" android:layout_centerHorizontal="true" android:orientation="horizontal"/> </RelativeLayout> ``` 其中,ViewPager的id为view_pager,指示器的id为indicator指示器使用LinearLayout实现,其中包含若干个ImageView组件。 接下来,我们需要在代码中实现ViewPager指示器的逻辑。具体步骤如下: 1. 在Activity或Fragment中获取ViewPager和指示器组件的引用。 2. 创建一个ImageView数组,长度为ViewPager的页面数量。 3. 遍历ImageView数组,为每个ImageView设置未选中状态的图片,并将其添加到指示器组件中。 4. 监听ViewPager的页面滑动事件,根据页面位置更新指示器的状态。 示例代码如下: ``` private ViewPager mViewPager; private LinearLayout mIndicator; private ImageView[] mImageViews; private void initIndicator() { int count = mViewPager.getAdapter().getCount(); mImageViews = new ImageView[count]; for (int i = 0; i < count; i++) { mImageViews[i] = new ImageView(this); mImageViews[i].setImageResource(R.drawable.indicator_unselected); LinearLayout.LayoutParams lp = new LinearLayout.LayoutParams( LinearLayout.LayoutParams.WRAP_CONTENT, LinearLayout.LayoutParams.WRAP_CONTENT); lp.setMargins(10, 0, 10, 0); mIndicator.addView(mImageViews[i], lp); } mImageViews[0].setImageResource(R.drawable.indicator_selected); mViewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() { @Override public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) { } @Override public void onPageSelected(int position) { for (int i = 0; i < mImageViews.length; i++) { mImageViews[i].setImageResource(R.drawable.indicator_unselected); } mImageViews[position].setImageResource(R.drawable.indicator_selected); } @Override public void onPageScrollStateChanged(int state) { } }); } ``` 在initIndicator()方法中,我们首先获取ViewPager和指示器组件的引用,然后创建一个ImageView数组,长度为ViewPager的页面数量。接着,我们遍历ImageView数组,为每个ImageView设置未选中状态的图片,并将其添加到指示器组件中。最后,我们监听ViewPager的页面滑动事件,根据页面位置更新指示器的状态。 注意,这里使用了两种不同的图片作为指示器的状态图,一种是未选中状态的图片,另一种是选中状态的图片。这两种图片可以根据自己的需求进行替换。
评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值