Android导航中Fragment里实现ViewPager滑动和RadioButton单击事件

来源：互联网发布：java spring 异步调用编辑：程序博客网时间：2024/05/28 06:06

一、首先写好XML导航页布局，没有布局，怎么看效果，俗话说的好：有图有真相！

1、导航页布局，代码中RadioButton中有2自定义选择器，点击换图和点击文字变色

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:id="@+id/activity_main_ll"    android:layout_width="match_parent"    android:layout_height="match_parent"    >    <LinearLayout        android:id="@+id/main_llayout"        android:layout_width="match_parent"        android:layout_height="match_parent"        android:layout_above="@+id/activity_v"        android:layout_alignParentTop="true"        android:orientation="vertical" >    </LinearLayout>    <View android:id="@+id/activity_main_v"    android:layout_above="@+id/activity_main_rg"    android:layout_width="match_parent"    android:layout_height="1dp"    android:background="#c8c7cc"/>    <RadioGroup        android:id="@+id/activity_main_rg"        android:layout_width="match_parent"        android:layout_height="75dp"        android:layout_alignParentBottom="true"        android:orientation="horizontal" >        <RadioButton            android:id="@+id/activity_main_eat_rbtn"            android:layout_width="0dp"            android:layout_height="match_parent"            android:layout_gravity="center"            android:layout_weight="1"            android:button="@null"            android:drawableTop="@drawable/bg_main_radiogroup_eatcolor"            android:gravity="center"            android:text="吃"            android:textColor="@drawable/bg_eat_radiogroup_textcolor"            android:textSize="15sp" />        <RadioButton            android:id="@+id/activity_main_food_rbtn"            android:layout_width="0dp"            android:layout_height="match_parent"            android:layout_gravity="center"            android:layout_weight="1"            android:button="@null"            android:drawableTop="@drawable/bg_main_radiogroup_foodcolor"            android:gravity="center"            android:text="食物"            android:textColor="@drawable/bg_eat_radiogroup_textcolor"            android:textSize="15sp" />        <RadioButton            android:id="@+id/activity_main_shop_rbtn"            android:layout_width="0dp"            android:layout_height="match_parent"            android:layout_gravity="center"            android:layout_weight="1"            android:button="@null"            android:drawableTop="@drawable/bg_main_radiogroup_shopcolor"            android:gravity="center"            android:text="商店"            android:textColor="@drawable/bg_eat_radiogroup_textcolor"            android:textSize="15sp" />        <RadioButton            android:id="@+id/activity_main_my_rbtn"            android:layout_width="0dp"            android:layout_height="match_parent"            android:layout_gravity="center"            android:layout_weight="1"            android:button="@null"            android:drawableTop="@drawable/bg_main_radiogroup_mycolor"            android:gravity="center"            android:text="我的"            android:textColor="@drawable/bg_eat_radiogroup_textcolor"            android:textSize="15sp" />    </RadioGroup>    </RelativeLayout>

2、再来写导航中第一个Fragment---吃

<?xml version="1.0" encoding="utf-8"?><RelativeLayout     android:id="@+id/eat_rlayout"    xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="match_parent"    android:layout_height="match_parent"    >    <RelativeLayout        android:id="@+id/fragment_eat_rl1"        android:layout_width="match_parent"        android:layout_height="75dp" >        <ImageView            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:layout_centerVertical="true"            android:layout_marginLeft="25dp"            android:src="@drawable/ic_home_search" />        <TextView            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:layout_centerInParent="true"            android:gravity="center"            android:text="各种美味"            android:textColor="#ff5a5f"            android:textSize="30sp" />        <ImageView            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:layout_alignParentRight="true"            android:layout_centerVertical="true"            android:layout_marginRight="25dp"            android:src="@drawable/ic_home_camera" />    </RelativeLayout>    <View        android:id="@+id/fragment_eat_v1"        android:layout_below="@+id/fragment_eat_rl1"        android:layout_width="match_parent"        android:layout_height="1dp"        android:background="#c8c7cc" />    <RadioGroup        android:id="@+id/fragment_eat_rg"        android:layout_below="@+id/fragment_eat_v1"        android:layout_width="match_parent"        android:layout_height="64dp"        android:orientation="horizontal" >        <RadioButton            android:id="@+id/fragment_eat_home_page_rbtn"            android:layout_width="0dp"            android:layout_height="match_parent"            android:layout_weight="1"            android:button="@null"            android:checked="true"            android:gravity="center"            android:text="首页"            android:textColor="@drawable/bg_eat_radiogroup_textcolor"            android:textSize="20sp" />        <RadioButton            android:id="@+id/fragment_eat_appraisal_rbtn"            android:layout_width="0dp"            android:layout_height="match_parent"            android:layout_weight="1"            android:button="@null"            android:gravity="center"            android:text="评价"            android:textColor="@drawable/bg_eat_radiogroup_textcolor"            android:textSize="20sp" />        <RadioButton            android:id="@+id/fragment_eat_knowledge_rbtn"            android:layout_width="0dp"            android:layout_height="match_parent"            android:layout_weight="1"            android:button="@null"            android:gravity="center"            android:text="知识"            android:textColor="@drawable/bg_eat_radiogroup_textcolor"            android:textSize="20sp" />        <RadioButton            android:id="@+id/fragment_eat_cate_rbtn"            android:layout_width="0dp"            android:layout_height="match_parent"            android:layout_weight="1"            android:button="@null"            android:gravity="center"            android:text="美味"            android:textColor="@drawable/bg_eat_radiogroup_textcolor"            android:textSize="20sp" />    </RadioGroup>    <View        android:id="@+id/fragment_eat_v2"        android:layout_below="@+id/fragment_eat_rg"        android:layout_width="match_parent"        android:layout_height="1dp"        android:background="#c8c7cc" />    <android.support.v4.view.ViewPager        android:layout_below="@+id/fragment_eat_v2"        android:id="@+id/pager"        android:layout_width="match_parent"        android:layout_height="wrap_content"         >    </android.support.v4.view.ViewPager></RelativeLayout>

3、XML布局最后一步，ViewPager中的4个碎片布局

（1）

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:orientation="vertical" >    <TextView         android:layout_width="match_parent"        android:layout_height="wrap_content"        android:text="首页"/></LinearLayout>

（2）

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:orientation="vertical" >    <TextView         android:layout_width="match_parent"        android:layout_height="wrap_content"        android:text="评价"/></LinearLayout>

（3）

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:orientation="vertical" >    <TextView         android:layout_width="match_parent"        android:layout_height="wrap_content"        android:text="知识"/></LinearLayout>

（4）

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:orientation="vertical" >    <TextView         android:layout_width="match_parent"        android:layout_height="wrap_content"        android:text="美味"/></LinearLayout>

二、写了这么多，烦了么，重点才刚刚开始，src文件中的逻辑

1、绑定ViewPager中的4个碎片布局，建议新建一个Fragment包，其他真心不想多说，自己看着办吧。。。。。。

2、绑定导航中第一个Fragment---吃，里面的逻辑需要说说，直接上代码吧！（自己导包，有V4的导V4）

public class EatFragment extends Fragment {private ViewPager vp;private List<Fragment> list;private EatPagerAadapter adapter;private RadioGroup rg;private RadioButton rb1, rb2, rb3, rb4;private Context context;Fragment honePage, appraisal, knowledge, cate;@Overridepublic void onAttach(Activity activity) {super.onAttach(activity);context = activity;}@Overridepublic View onCreateView(LayoutInflater inflater, ViewGroup container,Bundle savedInstanceState) {View view = inflater.inflate(R.layout.fragment_eat, null);initView(view);list = new ArrayList<Fragment>();list.add(new EatHomePageFragment());list.add(new EatAppraisalFragment());list.add(new EatKnowledgeFragment());list.add(new EatCateFragment());adapter = new EatPagerAadapter(getChildFragmentManager(), list,getActivity());vp.setAdapter(adapter);addListener();return view;}private void addListener() {vp.setOnPageChangeListener(new ViewPager.OnPageChangeListener() {@Overridepublic void onPageSelected(int arg0) {Log.e("onPageSelected", "----" + arg0);switch (arg0) {case 0:rb1.setChecked(true);break;case 1:rb2.setChecked(true);break;case 2:rb3.setChecked(true);break;case 3:rb4.setChecked(true);break;}}@Overridepublic void onPageScrolled(int arg0, float arg1, int arg2) {}@Overridepublic void onPageScrollStateChanged(int arg0) {}});rb1.setOnClickListener(new View.OnClickListener() {@Overridepublic void onClick(View arg0) {vp.setCurrentItem(0);}});rb2.setOnClickListener(new View.OnClickListener() {@Overridepublic void onClick(View arg0) {vp.setCurrentItem(1);}});rb3.setOnClickListener(new View.OnClickListener() {@Overridepublic void onClick(View arg0) {vp.setCurrentItem(2);}});rb4.setOnClickListener(new View.OnClickListener() {@Overridepublic void onClick(View arg0) {vp.setCurrentItem(3);}});}private void initView(View view) {vp = (ViewPager) view.findViewById(R.id.pager);rg = (RadioGroup) view.findViewById(R.id.fragment_eat_rg);rb1 = (RadioButton) view.findViewById(R.id.fragment_eat_home_page_rbtn);rb2 = (RadioButton) view.findViewById(R.id.fragment_eat_appraisal_rbtn);rb3 = (RadioButton) view.findViewById(R.id.fragment_eat_knowledge_rbtn);rb4 = (RadioButton) view.findViewById(R.id.fragment_eat_cate_rbtn);}}

3、是不是还有报错，适配器写了么？（建议新建个“adapter“包）包还是自己导，有V4的导V4

public class EatPagerAadapter extends FragmentPagerAdapter{private Context context;private List<Fragment> list;public EatPagerAadapter(FragmentManager fm) {super(fm);}public EatPagerAadapter(FragmentManager fm,List<Fragment> list,Context context){super(fm);this.list=list;this.context=context;}@Overridepublic Fragment getItem(int arg0) {return list==null?null:list.get(arg0);}@Overridepublic int getCount() {return list==null?0:list.size();}}

4、所有准备工作就绪，最后在导航页主类中加个单击事件就OK了

public class MainActivity extends FragmentActivity implements OnClickListener{private RadioButton mEatBtn,mFoodBtn,mShopBtn,mMyBtn;//后面三个按钮只做声明、初始化和绑定监听，单击事件参考第一个按钮Fragment eat,food,shop,my;@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);initView();addListener();eat=new EatFragment();getSupportFragmentManager().beginTransaction().replace(R.id.main_llayout,eat).commit();mEatBtn.setChecked(true);}@Overrideprotected void onResume() {super.onResume();}private void addListener() {mEatBtn.setOnClickListener(this);mFoodBtn.setOnClickListener(this);mShopBtn.setOnClickListener(this);mMyBtn.setOnClickListener(this);}private void initView() {mEatBtn=(RadioButton) findViewById(R.id.activity_main_eat_rbtn);mFoodBtn=(RadioButton) findViewById(R.id.activity_main_food_rbtn);mShopBtn=(RadioButton) findViewById(R.id.activity_main_shop_rbtn);mMyBtn=(RadioButton) findViewById(R.id.activity_main_my_rbtn);}@Overridepublic void onClick(View v) {switch (v.getId()) {case R.id.activity_main_eat_rbtn:eat=new EatFragment();getSupportFragmentManager().beginTransaction().replace(R.id.main_llayout,eat).commit();break;case R.id.activity_main_food_rbtn:break;case R.id.activity_main_shop_rbtn:break;case R.id.activity_main_my_rbtn:break;}}}

试一试效果吧

1 0