Fragment+RadioButton实现Tab页切换

• 总所周知，实现一个App的Tab页切换的方式有很多种。例如使用ViewPager+Fragment，RadioButton+Fragment。今天主要来利用RadioButton来实现。

首先我们绘制一个布局

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:id="@+id/activity_main"
    android:background="@color/page_bg"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <FrameLayout
        android:id="@+id/fl_content"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"/>


    <RadioGroup
        android:id="@+id/main_group"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:padding="5dp"
        android:background="@color/white"
        android:orientation="horizontal">

        <RadioButton
            android:id="@+id/rb_information"
            android:button="@null"
            android:checked="true"
            android:text="资讯"
            android:drawablePadding="3dp"
            android:layout_width="0dp"
            android:layout_weight="1"
            android:layout_height="wrap_content"
            android:gravity="center"
            android:drawableTop="@drawable/main_information_selector"
            />

        <RadioButton
            android:id="@+id/rb_video"
            android:button="@null"
            android:text="短视频"
            android:drawablePadding="3dp"
            android:layout_width="0dp"
            android:layout_weight="1"
            android:layout_height="wrap_content"
            android:gravity="center"
            android:drawableTop="@drawable/main_video_selector"
            />

        <RadioButton
            android:id="@+id/rb_me"
            android:button="@null"
            android:text="我的"
            android:drawablePadding="3dp"
            android:layout_width="0dp"
            android:layout_weight="1"
            android:layout_height="wrap_content"
            android:gravity="center"
            android:drawableTop="@drawable/main_me_selector"
            />
    </RadioGroup>

</LinearLayout>

好吧，直接java代码吧

package com.wj.gamingheadlines;

import android.os.Bundle;
import android.support.annotation.Nullable;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentTransaction;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.widget.FrameLayout;
import android.widget.RadioButton;
import android.widget.RadioGroup;

import com.wj.gamingheadlines.fragments.InformationFragment;
import com.wj.gamingheadlines.fragments.MeFragment;
import com.wj.gamingheadlines.fragments.VideoFragment;

import java.lang.reflect.InvocationTargetException;

import butterknife.BindView;
import butterknife.ButterKnife;
import butterknife.OnClick;

/**
 * 主页面
 */
public class MainActivity extends AppCompatActivity {

    @BindView(R.id.rb_information)
    RadioButton rbInformation;
    @BindView(R.id.rb_video)
    RadioButton rbVideo;
    @BindView(R.id.rb_me)
    RadioButton rbMe;

    private Fragment mShowFragment;
    private FragmentManager fm;

    @Override
    protected void onCreate(@Nullable Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        ButterKnife.bind(this);

        fm=getSupportFragmentManager();

        initCheck();
    }


    private void initCheck() {
        FragmentTransaction transaction = fm.beginTransaction();
        mShowFragment=new InformationFragment();
        transaction.add(R.id.fl_content,mShowFragment,InformationFragment.TAG);
        transaction.commit();
    }

    @OnClick({R.id.rb_information, R.id.rb_video, R.id.rb_me})
    public void onViewClicked(View view) {

        switch (view.getId()) {
            case R.id.rb_information:

                switchPages(InformationFragment.TAG,InformationFragment.class);
                break;
            case R.id.rb_video:

                switchPages(VideoFragment.TAG,VideoFragment.class);
                break;
            case R.id.rb_me:

                switchPages(MeFragment.TAG,MeFragment.class);
                break;
        }

    }

    //切换显示Fragment
    private void switchPages(String tag, Class<? extends Fragment> cls) {
//        FragmentManager fm = getSupportFragmentManager();
        FragmentTransaction transaction = fm.beginTransaction();
        //隐藏显示页面
        transaction.hide(mShowFragment);
        //根据TAG去FragmentManager寻找碎片
        mShowFragment = fm.findFragmentByTag(tag);
        if (mShowFragment != null) {
            transaction.show(mShowFragment);
        } else {
            try {
                //使用反射实例化一个对象
                mShowFragment = cls.getConstructor().newInstance();
            } catch (InstantiationException e) {
                e.printStackTrace();
            } catch (IllegalAccessException e) {
                e.printStackTrace();
            } catch (InvocationTargetException e) {
                e.printStackTrace();
            } catch (NoSuchMethodException e) {
                e.printStackTrace();
            }
            transaction.add(R.id.fl_content, mShowFragment, tag);
        }
        transaction.commit();
    }
}

---

• 其中使用的是ButterKnife，减少findViewById的繁复工作。切换是不是很简单，就是一个方法的事儿。