ViewPager与RadioGroup实现导航切换

来源：互联网发布：ecshop php 5.5 编辑：程序博客网时间：2024/06/16 00:03

前言：百度（谷歌）上已经有很多类似的例子了，为什么还会有这篇文章？
第一：我观察所有的文章都是在介绍原理，有的帖出了代码，对于新人来说，都是不错的教学案例，不过，有的人就是不会，就只想用（我同事，开发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) ;

设置数据源

最后，点我下载

0 0