Fragment 和RadioButton 实现底部导航拦

继续坚持，努力学习！
App中的页面切换必不可少，我们用Fragment和Radiobutton实现这一切换效果！首先放上效果图：


那么我们如何试下这种效果呢，
1，布局文件
1），主界面的布局XML

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <RelativeLayout
        android:layout_alignParentTop="true"
        android:id="@+id/main_relative_title"
        android:background="@color/colorPrimary"
        android:orientation="horizontal"
        android:layout_width="match_parent"
        android:layout_height="45dp">
        <ImageView
            android:layout_marginLeft="10dp"
            android:id="@+id/main_action_left"
            android:src="@drawable/main_back"
            android:layout_width="wrap_content"
            android:layout_height="match_parent" />
        <TextView
            android:id="@+id/main_action_text"
            android:layout_centerInParent="true"
            android:text="hh"
            android:textSize="16sp"
            android:gravity="center"
            android:textColor="@android:color/white"
            android:layout_width="wrap_content"
            android:layout_height="match_parent" />
        <ImageView
            android:layout_marginRight="10dp"
            android:id="@+id/main_action_right"
            android:src="@drawable/main_back"
            android:layout_alignParentRight="true"
            android:layout_width="wrap_content"
            android:layout_height="match_parent" />
    </RelativeLayout>
    <LinearLayout
        android:layout_alignParentBottom="true"
        android:id="@+id/main_group_layout"
        android:orientation="vertical"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
        <View
            android:layout_width="match_parent"
            android:layout_height="1dp"
            android:background="#CCCCCC"/>
    <RadioGroup
        android:orientation="horizontal"
        android:id="@+id/main_group_btn"
        android:layout_width="match_parent"
        android:layout_height="45dp">
        <RadioButton
            android:padding="5dp"
            android:layout_margin="5dp"
            android:background="@drawable/first_selcotor"
            android:layout_weight="1"
            android:checked="true"
            android:button="@null"
            android:id="@+id/main_first"
            android:layout_width="wrap_content"
            android:layout_height="match_parent" />
        <RadioButton
            android:padding="5dp"
            android:layout_margin="5dp"
            android:background="@drawable/second_slector"
            android:layout_weight="1"
            android:button="@null"
            android:id="@+id/main_second"
            android:layout_width="wrap_content"
            android:layout_height="match_parent" />
        <RadioButton
            android:padding="5dp"
            android:layout_margin="5dp"
            android:background="@drawable/third_selector"
            android:layout_weight="1"
            android:button="@null"
            android:id="@+id/main_third"
            android:layout_width="wrap_content"
            android:layout_height="match_parent" />
        <RadioButton
            android:padding="5dp"
            android:layout_margin="5dp"
            android:background="@drawable/fourth_slector"
            android:layout_weight="1"
            android:button="@null"
            android:id="@+id/main_fourth"
            android:layout_width="wrap_content"
            android:layout_height="match_parent" />
    </RadioGroup>
    </LinearLayout>
    <FrameLayout
        android:layout_below="@id/main_relative_title"
        android:layout_above="@id/main_group_layout"
        android:id="@+id/main_fragment_content"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
    </FrameLayout>
</RelativeLayout>

2），Fragment中的Layout文件我就写了一个，为了节省资源（懒省事，哈哈！）如下：

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="match_parent"
    android:layout_height="match_parent">
    <TextView
        android:textSize="18sp"
        android:layout_centerInParent="true"
        android:id="@+id/common_text"
        android:text="放开我，我要装逼！"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />

</RelativeLayout>

2.其中的Drawable文件中，有按钮点击图片的变化，如下：
1，first_selcotor

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_checked="true"  android:drawable="@drawable/first_"/>
    <item android:drawable="@drawable/first_s" android:state_checked="false"/>

</selector>

2，second_slector

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_checked="true"  android:drawable="@drawable/second_"/>
    <item android:drawable="@drawable/second_s" android:state_checked="false"/>
</selector>

3，third_selector

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_checked="true"  android:drawable="@drawable/third_"/>
    <item android:drawable="@drawable/third_s" android:state_checked="false"/>
</selector>

4，fourth_slector

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_checked="true"  android:drawable="@drawable/fourth_"/>
    <item android:drawable="@drawable/fourth_s" android:state_checked="false"/>
</selector>

图片我就不贴了，自己下载就好了，可以百度 ：阿里巴巴矢量图

3.接下来就是Fragment。java代码了！这里我贴上第一个和第四个Fragment的代码，为了区分不同的Fragment

package btzh.com.myedittext.Fragment;

import android.app.Fragment;
import android.os.Bundle;
import android.support.annotation.Nullable;

import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;

import btzh.com.myedittext.R;

/**
 * Created by IBM on 2016/11/25.
 */
public class Fragment_first extends Fragment {
    @Nullable
    @Override
    public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        View view = inflater.inflate(R.layout.fragment_layout_common,container,false);
        return view;
    }
}

接下来是第四个Fragment代码

package btzh.com.myedittext.Fragment;

import android.app.Fragment;
import android.os.Bundle;
import android.support.annotation.Nullable;

import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.TextView;

import btzh.com.myedittext.R;

/**
 * Created by IBM on 2016/11/25.
 */
public class Fragment_fourth extends Fragment {
    private TextView common_text;
    private View fourth;
    @Nullable
    @Override
    public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        fourth = inflater.inflate(R.layout.fragment_layout_common,container,false);
        initViews();
        return fourth;
    }
    /**
     * 因为自己就写了一个Fragment布局，为了区分不同的Fragment就在这里改变其中的显示内容，
     * 其中第一个Fragment是默认显示的，这个方法就不用写了！
     **/
    private void initViews(){
        common_text = (TextView)fourth.findViewById(R.id.common_text);
        common_text.setText("我是第四个Fragment！");
    }
}

3，最后就是我们要在Activity中处理Fragment的切换问题了代码如下，注释很详细，应该能看懂吧！

package btzh.com.myedittext.Fragment;

import android.app.Activity;
import android.app.FragmentManager;
import android.app.FragmentTransaction;
import android.os.Bundle;
import android.os.PersistableBundle;
import android.view.View;
import android.view.Window;
import android.widget.CompoundButton;
import android.widget.ImageView;
import android.widget.RadioButton;
import android.widget.RadioGroup;
import android.widget.TextView;

import btzh.com.myedittext.R;

/**
 * Created by IBM on 2016/11/25.
 */
public class FragmentActivity extends Activity implements   RadioGroup.OnCheckedChangeListener, View.OnClickListener {
    private RadioGroup main_radioGroup; //声明radiogroup
    private ImageView main_iv_left,main_iv_right;
    private TextView main_tv;
    private Fragment_first fragment_first; //声明fragment
    private Fragment_second fragment_second;
    private Fragment_third fragment_third;
    private Fragment_fourth fragmentFourth;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        //取消系统原始标题栏
        requestWindowFeature(Window.FEATURE_NO_TITLE);
        setContentView(R.layout.fragmentactivity_layout);
        initViews();
        setDefaultFragment();
    }
    //初始化控件
    private void initViews(){
        main_radioGroup = (RadioGroup)findViewById(R.id.main_group_btn);
        main_radioGroup.setOnCheckedChangeListener(this);
        main_tv = (TextView)findViewById(R.id.main_action_text);
        main_iv_left = (ImageView)findViewById(R.id.main_action_left);
        main_iv_left.setOnClickListener(this);
        main_iv_right = (ImageView)findViewById(R.id.main_action_right);
        main_iv_right.setOnClickListener(this);
    }
    //默认选中第一个Fragment
    private void setDefaultFragment()
    {
        FragmentManager fm = getFragmentManager();
        FragmentTransaction transaction = fm.beginTransaction();
        fragment_first= new Fragment_first();
        transaction.replace(R.id.main_fragment_content, fragment_first);
        main_tv.setText("我是第一个Fragment");
        transaction.commit();
    }
    @Override
    public void onCheckedChanged(RadioGroup group, int checkedId) {
        //获取fragment 的管理器
        FragmentManager fm = getFragmentManager();
        //开启管理的事务
        FragmentTransaction transaction = fm.beginTransaction();
        switch (checkedId){  //通过判断选中的ID来切换不同的fragment
            case R.id.main_first:
                main_tv.setText("one");
                if (null == fragment_first){ //判断是否存在，如果已经存在，就不用new了，直接执行下一句
                    fragment_first= new Fragment_first();
                }
                //事务中要处理的事情
                transaction.replace(R.id.main_fragment_content, fragment_first);
                break;
            case R.id.main_second:
                main_tv.setText("two");
                if (null == fragment_second){
                    fragment_second = new Fragment_second();
                }
                transaction.replace(R.id.main_fragment_content,fragment_second);
                break;
            case R.id.main_third:
                main_tv.setText("three");
                if (null == fragment_third){
                    fragment_third = new Fragment_third();
                }
                transaction.replace(R.id.main_fragment_content,fragment_third);
                break;
            case R.id.main_fourth:
                main_tv.setText("four");
                if (null == fragmentFourth){
                    fragmentFourth = new Fragment_fourth();
                }
                transaction.replace(R.id.main_fragment_content,fragmentFourth);
                break;
            default:
                break;
        }
        transaction.commit(); //提交事务
    }
    @Override
    public void onClick(View v) {
        switch (v.getId()){
            case R.id.main_action_left:
                //退出Activity
                this.finish();
                break;
            case R.id.main_action_right:
                //弹出对话框
//                showDialog();
                break;
            default:
                break;
        }

    }
   //   private void showDialog(){}
}

总结：transaction.replace();这种方法，每次执行时都会重新创建fragment,也就是说，原来的fragment都会被销毁，等需要再一次显示时，会被重新创建！（亲身试验，毕竟fragment的生命周期才是我们要特别重视的问题，亲身体会！）