当前位置:   article > 正文

Android使用Fragment简单底部导航切换_android底部导航栏切换

android底部导航栏切换

最近写毕业设计遇到了这个问题,鄙人是个初学Android小白,于是找了视频学习后解决了,就写一下,如果说的有错误的地方欢迎在评论区告诉我,废话不多说。开始。

运行展示:

 下面写的页面为第三个页面,其他的都是一样的写法,只是页面内容不同,第三个页面我没写内容

首先,要在 主页面中添加底部导航栏;

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <LinearLayout
            android:id="@+id/content_layout"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_above="@id/view_line"
            android:orientation="vertical"></LinearLayout>
 
        <View
            android:id="@+id/view_line"
            android:layout_width="match_parent"
            android:layout_height="1dp"
            android:layout_above="@id/bottom_tab"
            android:background="@color/design_default_color_error" />

        <LinearLayout
            android:id="@+id/bottom_tab"
            android:layout_width="match_parent"
            android:layout_height="50dp"
            android:layout_alignParentBottom="true"
            android:background="#B5A7A7"
            android:gravity="center"
            android:orientation="horizontal">

            <TextView
                android:id="@+id/one"
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:layout_weight="1"
                android:gravity="center"
                android:text="首页"
                android:textSize="20sp" />

            <TextView
                android:id="@+id/two"
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:layout_weight="1"
                android:gravity="center"
                android:text="地图"
                android:textSize="20sp" />

            <TextView
                android:id="@+id/three"
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:layout_weight="1"
                android:gravity="center"
                android:text="论坛"
                android:textSize="20sp" />

            <TextView
                android:id="@+id/frou"
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:layout_weight="1"
                android:gravity="center"
                android:text="个人"
                android:textSize="20sp" />
        </LinearLayout>
    </RelativeLayout>

</androidx.constraintlayout.widget.ConstraintLayout>

view为导航栏上方的直线,第一个LinearLayout为装Fragment页面的容器

之后要写导航栏对应页面,我写的有四个页面,这里我只放了第三个页面的代码,其余页面中的内容为自己开发相应页面的内容

<?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">

    <TextView
        android:id="@+id/textView3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:text="3" />
</LinearLayout>

这个页面只有一个Textview,我没写其他的内容。

之后在Mainactivity中的程序如下:

public class MainActivity extends AppCompatActivity implements View.OnClickListener {
    

    

    //声明Fragment对象
    private Fragment fragment1,fragment2,fragment3,fragment4,nowFragemnt;

    //声明底部标签
    private TextView tab1,tab2,tab3,tab4;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        
        setContentView(R.layout.activity_main);//设置主页面
        initUI();//初始化UI方法
        

    }




    //初始化UI界面
    private void initUI(){

        //初始化底部标签
        tab1 = findViewById(R.id.one);
        tab2 = findViewById(R.id.two);
        tab3 = findViewById(R.id.three);
        tab4 = findViewById(R.id.frou);

        //设置底部标签的变化,默认第一个被选中
        tab1.setBackgroundColor(Color.RED);
        tab2.setBackgroundColor(Color.WHITE);
        tab3.setBackgroundColor(Color.WHITE);
        tab4.setBackgroundColor(Color.WHITE);

        //为底部标签内设置点击事件
        tab1.setOnClickListener(this);
        tab2.setOnClickListener(this);
        tab3.setOnClickListener(this);
        tab4.setOnClickListener(this);

        showFragment1();

    }

    //第一个标签被点击
    private void showFragment1(){

        //开启事务,Fragment的切换是由事务控制
        FragmentTransaction transaction = getSupportFragmentManager().beginTransaction();
        //判断Fragment是否为空
        if (fragment1 == null){
            fragment1 = new Fragment_1();
            //添加Fragmet1到事务中
            transaction.add(R.id.content_layout,fragment1);
        }
        //隐藏所有的Fragment
        hideAllFragment(transaction);
        //显示Fragment
        transaction.show(fragment1);
        //记录Fragment
        nowFragemnt = fragment1;
        //提交事务
        transaction.commit();
        //设置底部标签的变化
        tab1.setBackgroundColor(Color.RED);
        tab2.setBackgroundColor(Color.WHITE);
        tab3.setBackgroundColor(Color.WHITE);
        tab4.setBackgroundColor(Color.WHITE);

    }

    //第二个标签被点击
    private void showFragment2(){

        //开启事务,Fragment的切换是由事务控制
        FragmentTransaction transaction = getSupportFragmentManager().beginTransaction();
        //判断Fragment是否为空
        if (fragment2 == null){
            fragment2 = new Fragment_2();
            //添加Fragmet1到事务中
            transaction.add(R.id.content_layout,fragment2);
        }
        //隐藏所有的Fragment
        hideAllFragment(transaction);
        //显示Fragment
        transaction.show(fragment2);
        //记录Fragment
        nowFragemnt = fragment2;
        //提交事务
        transaction.commit();
        //设置底部标签的变化
        tab1.setBackgroundColor(Color.WHITE);
        tab2.setBackgroundColor(Color.RED);
        tab3.setBackgroundColor(Color.WHITE);
        tab4.setBackgroundColor(Color.WHITE);

    }

    //第三个标签被点击
    private void showFragment3(){

        //开启事务,Fragment的切换是由事务控制
        FragmentTransaction transaction = getSupportFragmentManager().beginTransaction();
        //判断Fragment是否为空
        if (fragment3 == null){
            fragment3 = new Fragment_3();
            //添加Fragmet3到事务中
            transaction.add(R.id.content_layout,fragment3);
        }
        //隐藏所有的Fragment
        hideAllFragment(transaction);
        //显示Fragment
        transaction.show(fragment3);
        //记录Fragment
        nowFragemnt = fragment3;
        //提交事务
        transaction.commit();
        //设置底部标签的变化
        tab1.setBackgroundColor(Color.WHITE);
        tab2.setBackgroundColor(Color.WHITE);
        tab3.setBackgroundColor(Color.RED);
        tab4.setBackgroundColor(Color.WHITE);

    }
    //第四个标签被点击
    private void showFragment4(){

        //开启事务,Fragment的切换是由事务控制
        FragmentTransaction transaction = getSupportFragmentManager().beginTransaction();
        //判断Fragment是否为空
        if (fragment4 == null){
            fragment4 = new Fragment_4();
            //添加Fragmet1到事务中
            transaction.add(R.id.content_layout,fragment4);
        }
        //隐藏所有的Fragment
        hideAllFragment(transaction);
        //显示Fragment
        transaction.show(fragment4);
        //记录Fragment
        nowFragemnt = fragment4;
        //提交事务
        transaction.commit();
        //设置底部标签的变化
        tab1.setBackgroundColor(Color.WHITE);
        tab2.setBackgroundColor(Color.WHITE);
        tab3.setBackgroundColor(Color.WHITE);
        tab4.setBackgroundColor(Color.RED);

    }

    //隐藏所有的Fragment
    private void hideAllFragment(FragmentTransaction transaction){
        if (fragment1!= null){
            transaction.hide(fragment1);
        }
        if (fragment2!= null){
            transaction.hide(fragment2);
        }
        if (fragment3!= null){
            transaction.hide(fragment3);
        }
        if (fragment4!= null){
            transaction.hide(fragment4);
        }
    }

    //点击事件
    @Override
    public void onClick(View view) {
        switch (view.getId()){
            case R.id.one: showFragment1();break;
            case R.id.two: showFragment2();break;
            case R.id.three: showFragment3();break;
            case R.id.frou: showFragment4();break;
            default: break;
        }
    }

}

在initUI()中最后一行的showFragment1()是把第一个页面设置为刚进入软件的第一个页面,点击事件方法作用为点击哪一个底部标签就显示哪一个Fragment页面

对于每一个Fragment都要有相对应的类,这是第三个Fragment的:

public class Fragment_3 extends Fragment {
    @Nullable
    @Override
    public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        //创建Fragment布局
        View view = inflater.inflate(R.layout.layout_3,container,false);

        return view;
    }
}

这是第三个页面的代码,对应上面的页面文件(.xml)的那个,页面里我没写什么内容,在类里面我就没写其他东西了,只是把页面返回去,在这个类中,主要运行的是onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState)方法,其他的Fragment中也一样的,我这里只放了一个的代码,其他三个我没放,但是都是大同小异的。

这样就可以进行页面的切换了,但是用RadioGroup来做底部导航栏才是比较好的,这个只是能进行页面切换,底部导航栏比较简陋。

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/花生_TL007/article/detail/342924
推荐阅读
相关标签