ViewPager与RadioGroup实现导航切换

最新推荐文章于 2022-01-12 00:01:25 发布

sunxiaogang0214

最新推荐文章于 2022-01-12 00:01:25 发布

阅读量433

点赞数

分类专栏： Android

本文链接：https://blog.csdn.net/sunxiaogang0214/article/details/53508545

版权

Android 专栏收录该内容

33 篇文章 0 订阅

订阅专栏

前言：百度（谷歌）上已经有很多类似的例子了，为什么还会有这篇文章？
第一：我观察所有的文章都是在介绍原理，有的帖出了代码，对于新人来说，都是不错的教学案例，不过，有的人就是不会，就只想用（我同事，开发ios的，想搞安卓）。所以封装成一个控件了，直接用就行，支持大多数情况
第二：所有代码逻辑实现几乎都放在Activity，这种方式是我不喜欢的。Activity只负责展示就好，具体逻辑尽量不要放在Activity或者Fragment。相信很多程序猿代码写多了都会有相应的感悟。
第三：羞愧啊，我在外包，要效率，所以，闲暇时间有了它。（嘿嘿）
第四：这篇博客出来后，又会方便一群拿来主义，因为集成他实在是方便，只需要配置一些参数就可以出来了（比如，drawable selector 显示名称等，下面会把代码贴出来，并附图实例）
说下项目结构吧{
抽象类一个，所有的逻辑处理都在这里
具体实现类两个，给出一个参考，其他方式都一样
}
光辉时刻（帖代码）：
1、BaseView

/**
 * 描述：用于展示项目首页view，底部item导航，顶部空白部分采用ViewPager实现一键式管理。
 * <P>
 *     所有逻辑内部处理<br/>
 *     只向外暴露设置Fragment List的方法<br/>
 *     使用泛型，可以获取到Fragment具体类，如果是首页则泛型设置为Fragment即可
 *
 * </P>
 * Created by sxg on 2016/12/7.
 */
public abstract class BaseVGAndVPView<T extends Fragment> extends LinearLayout {

    private List<T> mFragments;

    private MyRadioGroup mRadioGroup;
    private ViewPager mViewPager;
    private MyViewPagerAdapter mAdapter;

    public BaseVGAndVPView(Context context) {
        super(context);
    }

    public BaseVGAndVPView(Context context, AttributeSet attrs) {
        super(context, attrs);
       init();

    }

    public BaseVGAndVPView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
    }

    protected void init() {
        //初始化ViewPager
        mViewPager=new ViewPager(getContext());
        //初始化RadioGroup相关
        resources=setImageResources();
        names=setRadioButtonNames();
        mRadioGroup=new MyRadioGroup(getContext());

        LinearLayout.LayoutParams lp1=new LinearLayout.LayoutParams(LinearLayout.LayoutParams.MATCH_PARENT, 0,1);
        mViewPager.setLayoutParams(lp1);

        ViewGroup.LayoutParams lp2=new ViewGroup.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.WRAP_CONTENT);
        mRadioGroup.setLayoutParams(lp2);

        //设置ViewPager和MyRadioGroup的相互监听
        mViewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {
            @Override
            public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {

            }

            @Override
            public void onPageSelected(int position) {
                if (mRadioGroup.getChildCount() > position) {
                    mRadioGroup.getChildAt(position).setChecked(true);
                }
            }

            @Override
            public void onPageScrollStateChanged(int state) {

            }
        });
        mRadioGroup.setOnCheckedChangeListener(new RadioGroup.OnCheckedChangeListener() {
            @Override
            public void onCheckedChanged(RadioGroup radioGroup, int i) {
                //判空
                if (mFragments==null) return;
                for (int k = 0,length=radioGroup.getChildCount();k<length ;k++ ) {
                    if (radioGroup.getChildAt(k).getId() == i) {
                        if (mFragments.size() > k) {
                            mViewPager.setCurrentItem(i);
                            return;
                        }
                    }
                }
            }
        });

        //添加布局
        if (setFlags() == FLAG_RADIO_BOTTOM) {
            addView(mViewPager);
            addView(mRadioGroup);
        }else if (setFlags() == FLAG_RADIO_GROUP_TOP) {
            addView(mRadioGroup);
            addView(mViewPager);
        } else {
            throw new RuntimeException("看看setFlags()方法返回的是不是FLAG_RADIO_BOTTOM(RadioGroup在底部)、FLAG_RADIO_GROUP_TOP(RadioGroup在顶部)其中一个");
        }


        mRadioGroup.getChildAt(0).setChecked(true);
    }
    //其他的初始化功能绑定
    public void setmFragments(List<T> mFragments,FragmentManager fm) {
        this.mFragments=mFragments;

        mAdapter=new MyViewPagerAdapter(fm,mFragments);
        mViewPager.setAdapter(mAdapter);

        if (isCacheAllFragment()) {
            mViewPager.setOffscreenPageLimit(mFragments.size());
        }

    }

    //设置是RadioButton在上还是在下
    public final int FLAG_RADIO_GROUP_TOP=1;//导航在上面
    public final int FLAG_RADIO_BOTTOM=2;//导航在下面
    public abstract int setFlags();
    //设置图片资源
    int[] resources;
    public abstract int[] setImageResources();
    //设置RadioButton名称
    String[] names;
    public abstract String[] setRadioButtonNames();

    /**
     * 获取RadioButton在Layout布局
     */
    public abstract int getRadioGroupChildId() ;

    /**
     * 是否缓存全部页面
     */
    public abstract boolean isCacheAllFragment();


    public List<T> getFragments() {
        return mFragments;
    }

    public T getChildFragmentAt(int index) {
        return mFragments.get(index);

    }

    public RadioButton getRadioButtonChildAt(int index) {
        return mRadioGroup.getChildAt(index);
    }

    public MyRadioGroup getmRadioGroup() {
        return mRadioGroup;
    }

    public void setmRadioGroup(MyRadioGroup mRadioGroup) {
        this.mRadioGroup = mRadioGroup;
    }

    public ViewPager getmViewPager() {
        return mViewPager;
    }

    private class MyRadioGroup extends RadioGroup {

        public MyRadioGroup(Context context) {
            super(context);
            init();
        }

        public MyRadioGroup(Context context, AttributeSet attrs) {
            super(context, attrs);
        }

        private void init() {
            this.setOrientation(HORIZONTAL);
            for (int i = 0, length = Math.min(resources.length==0?names.length:resources.length, names.length); i < length; i++) {
                addView(createRadioButton(i));
            }


        }

        @Override
        public RadioButton getChildAt(int index) {
            return (RadioButton) super.getChildAt(index);
        }

        private RadioButton createRadioButton(int index) {
            RadioButton rb= (RadioButton) LayoutInflater.from(getContext()).inflate(getRadioGroupChildId(),this,false);
            rb.setText(names[index]);

            if (resources != null&&resources.length>0) {
                setDrawTop(rb,resources[index]);
            }
            return rb;
        }

        private void setDrawTop(TextView view,int drawable) {
            Drawable drawable1=getContext().getResources().getDrawable(drawable);
            drawable1.setBounds(0, 0, drawable1.getMinimumWidth(), drawable1.getMinimumHeight());
            view.setCompoundDrawables(null, drawable1, null, null);
        }
    }


    private class MyViewPagerAdapter extends FragmentStatePagerAdapter {
        List<T> mList;
        public MyViewPagerAdapter(FragmentManager fm,List<T> mList) {
            super(fm);
            this.mList=mList;
        }

        @Override
        public T getItem(int position) {
            return mList.get(position);
        }

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



    //其他内置方法，例如字体大小等尺寸转换

    /**
     * sp转换px
     */
    protected int sp2px(float spValue) {
        final float fontScale = getContext().getResources().getDisplayMetrics().scaledDensity;
        return (int) (spValue * fontScale + 0.5f);
    }

    /**
     * dip转换px
     */
    protected   float dip2px(float dip) {
        final float scale = getContext().getResources().getDisplayMetrics().density;
        return (int) (dip * scale + 0.5f);
    }
}

下面贴出一个实现类

/**
 * 描述：
 * Created by sxg on 2016/12/7.
 */
public class BottomVGAndVPView<T> extends BaseVGAndVPView {
    public BottomVGAndVPView(Context context) {
        super(context);
    }

    public BottomVGAndVPView(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    public BottomVGAndVPView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
    }

    @Override
    public int setFlags() {
        return FLAG_RADIO_BOTTOM;
    }

   @Override
    public int[] setImageResources() {
        return new int[]{R.drawable.main_home_rb,R.drawable.main_order_rb};
    }

    @Override
    public String[] setRadioButtonNames() {
        return new String[]{"首页", "订单"};
    }

    @Override
    public int getRadioGroupChildId() {
        return R.layout.wedget_main_bottom_rb;
    }

    @Override
    public boolean isCacheAllFragment() {
        return false;
    }
}

RadioButton代码如下：

<RadioButton           xmlns:android="http://schemas.android.com/apk/res/android"
    android:button="@null"
    android:gravity="center"
    android:textColor="@drawable/sel_main_rb_color"
    android:layout_weight="1"
    android:layout_width="0dp"
    android:layout_height="50dp"/>

效果展示如下
这个是底部效果图

有兴趣的童鞋看看代码，都是平常代码。我着重介绍几个比较重要的，能用到的
第一：此View支持泛型，如果传入Fragment是同一个类，在声明的时候传入泛型，比如：大家常见的商城软件，会有订单系统，订单用的Fragment都是OrderFragment，那么，声明的时候，就是这样

BottomVGAndVPView<OrderFragment> mViews;

如果是类似于主页面的导航传

 BottomVGAndVPView<Fragment> mViews;

写完了，发现这个方法几乎没啥用。。尴尬，如果不需要，直接删了吧

重点介绍比较重要的几个方法

1、

@Override
    public int setFlags() {
        return FLAG_RADIO_BOTTOM;
    }

设置RadioGroup在上方还是下放预置两个常量，分别是：
FLAG_RADIO_BOTTOM 在下放显示
FLAG_RADIO_GROUP_TOP 在上方显示
ps（不使用这2中方式，我抛了异常，表示不允许你瞎搞）

2、

@Override
    public int getRadioGroupChildId() {
        return R.layout.wedget_main_bottom_rb;
    }

因为代码需求毕竟不能满足所有人的想法，所以，View还是自己定义一个，常规属性自己设置，如我贴的关于RadioButton代码。如果想指定RadioGroup固定高度，就设置RadioButton的高度为固定值
这个View必须是RadioButton及其子类，否则运行报错

3、

@Override
    public boolean isCacheAllFragment() {
        return false;
    }

是否缓存全部页面，如果设置为false，按照ViewPager的缓存机制来，如果设置为true：有多少页缓存多少页，至于性能问题，开发者自己协调取舍。

4、外部调用

 public void setmFragments(List<T> mFragments,FragmentManager fm) ;

设置数据源

最后，点我下载

sunxiaogang0214

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
1
评论
ViewPager与RadioGroup实现导航切换

前言：百度（谷歌）上已经有很多类似的例子了，为什么还会有这篇文章？第一：我观察所有的文章都是在介绍原理，有的帖出了代码，对于新人来说，都是不错的教学案例，不过，有的人就是不会，就只想用（我同事，开发ios的，想搞安卓）。所以封装成一个控件了，直接用就行，支持大多数情况第二：所有代码逻辑实现几乎都放在Activity，这种方式是我不喜欢的。Activity只负责展示就好，具体逻辑尽量不要放在A
复制链接

扫一扫