一行代码调用Android自定义ViewPager指示器

PagerSlidingTabStrip基于HorizontalScrollView实现ViewPager的tab指示栏?效果,闲话不多说,直接看效果。

AndroidCodeTools (持续更新…)

GitHub:https://github.com/Pgrammerybj/AndroidCodeTools

Fragment_02
Fragment_03

* 支持自定义Tab栏的颜色、高度、点击以及条目个数
* 支持条目文字的大小、颜色设置
* 支持文字底部横向指示条的颜色、高度以及间距
* 如需更多功能,请联系我咯

具体调用:

        //真正的实现一行调用,让广大开发者朋友能够happy的做需求。(具体的配置方式可参考库中的demo)
        PagerSlidingTabStrip pagerTitle = (PagerSlidingTabStrip) findViewById(R.id.topic_viewpager_title);
        ViewPager viewPager = (ViewPager) findViewById(R.id.viewpager_fragment);

        FragmentOne oneF = new FragmentOne();
        FragmentTwo twoF = new FragmentTwo();
        FragmentManager fragmentTransaction = getSupportFragmentManager();
        FragmentViewPagerAdapter pagerAdapter = new FragmentViewPagerAdapter(fragmentTransaction);
        pagerAdapter.add(oneF, getString(R.string.viewpager_one_text));
        pagerAdapter.add(twoF, getString(R.string.viewpager_two_text));

        viewPager.setAdapter(pagerAdapter);
        //将目标viewPager添加到指示器中
        pagerTitle.setViewPager(viewPager);

Xml 布局:

 <com.jackyang.codetools.PagerSlidingTabStrip
        android:id="@+id/topic_viewpager_title"
        android:layout_width="match_parent"
        android:layout_height="45dp"
        android:layout_gravity="top"
        android:background="#ffffffff"
        app:pstsDefTextColor="@color/w2"
        app:pstsDividerColor="#00000000"
        app:pstsDividerPadding="0dp"
        app:pstsDividerWidth="0dp"
        app:pstsIndicatorColor="@color/w1"
        app:pstsIndicatorPaddingLeftRight="60dp"
        app:pstsIndicatorHeight="2dp"
        app:pstsSelTextColor="@color/w1"
        app:pstsShouldExpand="true"
        app:pstsTabTextSize="@dimen/s2"
        app:pstsUnderlineColor="@color/w1"
        app:pstsUnderlineHeight="0dp"/>

FragmentViewPagerAdapter的源码:

private static class FragmentViewPagerAdapter extends android.support.v4.app.FragmentPagerAdapter {
        private List<Fragment> mFragmentList = new ArrayList<>();
        private List<CharSequence> mTitleList = new ArrayList<>();

        FragmentViewPagerAdapter(FragmentManager fm) {
            super(fm);
        }

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

        @Override
        public Fragment getItem(int position) {
            return getCount() > position ? mFragmentList.get(position) : null;
        }

        @Override
        public Parcelable saveState() {
            return null;
        }

        @Override
        public void restoreState(Parcelable state, ClassLoader loader) {
        }

        @Override
        public CharSequence getPageTitle(int position) {
            return mTitleList.get(position);
        }

        void add(Fragment fragment, CharSequence title) {
            mFragmentList.add(fragment);
            mTitleList.add(title);
        }
    }

后话:

我所想要的就是简洁简单,能让用户上手就能使用不至于其他繁杂的设置来影 响大家的开发进度。PagerSlidingTabStrip目前已经在公司项目中使用(日活3W左右),目前所包含的功能还是比较简单的,还望大家对该控件有什么建议或者意见,大家共同进步。

更多项目:

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
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的页面滑动事件,根据页面位置更新指示器的状态。 注意,这里使用了两种不同的图片作为指示器的状态图,一种是未选中状态的图片,另一种是选中状态的图片。这两种图片可以根据自己的需求进行替换。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值