as实现简单微信界面切换

要求：

1.上方栏有标题 

2.中间显示内容，内容随下方栏的选择而切换

3.下方栏分成四个小板块可点击切换

实现步骤：

top.xml
界面上方栏标题。

bottom.xml
界面下方四个小bottom可相互切换，点击之后界面的图标变为绿色，没有使用的界面的图标为灰色。bottom中用LinearLayout中嵌套LinearLayout。

Fragment_Blank
界面中间显示内容，用四个BlankFragment分别对应四个主界面。四个Fragment_Blank代码基本一样只需要修改文本内容即可，这里展示第一个微信界面的Fragment_Blank1

activity_main.xml
主界面需要用到插件frameLayout和include。

package com.example.experiment1;

import androidx.appcompat.app.AppCompatActivity;
import androidx.fragment.app.FragmentTransaction;
import android.annotation.SuppressLint;
import android.os.Bundle;
import android.view.View;
import android.view.Window;
import android.widget.ImageButton;
import android.widget.LinearLayout;

public class MainActivity extends AppCompatActivity implements View.onClickListener {

    private Blank1Fragment f1;
    private Blank2Fragment f2;
    private Blank3Fragment f3;
    private Blank4Fragment f4;

    private LinearLayout foot1;
    private LinearLayout foot2;
    private LinearLayout foot3;
    private LinearLayout foot4;

    private ImageButton mImgWeixin;
    private ImageButton mImgFrd;
    private ImageButton mImgAddress;
    private ImageButton mImgSettings;

    @SuppressLint("WrongViewCast")
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        requestWindowFeature(Window.FEATURE_NO_TITLE);
        setContentView(R.layout.mylayout);

        foot1 = (LinearLayout) findViewById(R.id.weixin);
        foot2 = (LinearLayout) findViewById(R.id.frd);
        foot3 = (LinearLayout) findViewById(R.id.contacts);
        foot4 = (LinearLayout) findViewById(R.id.settings);
        mImgWeixin = (ImageButton)findViewById(R.id.imageButton_weixin);
        mImgFrd = (ImageButton)findViewById(R.id.imageButton_frd);
        mImgAddress = (ImageButton)findViewById(R.id.imageButton_contacts);
        mImgSettings = (ImageButton)findViewById(R.id.imageButton_settings);

        foot1.setonClickListener(this);
        foot2.setonClickListener(this);
        foot3.setonClickListener(this);
        foot4.setonClickListener(this);

        initFragment1();
    }

    private void initFragment1(){
        //开启事务，fragment的控制是由事务来实现的
        FragmentTransaction transaction = getSupportFragmentManager().beginTransaction();

        //第一种方式（add），初始化fragment并添加到事务中，如果为null就new一个
        if(f1 == null){
           f1 = new Blank1Fragment();
            transaction.add(R.id.main_frame_layout,f1);
        }
        mImgWeixin.setImageResource(R.drawable.tab_weixin_pressed);
        //隐藏所有fragment
        hideFragment(transaction);
        //显示需要显示的fragment
        transaction.show(f1);

        //第二种方式(replace)，初始化fragment
//        if(f1 == null){
//            f1 = new MyFragment("消息");
//        }
//        transaction.replace(R.id.main_frame_layout, f1);

        //提交事务
        transaction.commit();
    }
    private void initFragment2(){
        //开启事务，fragment的控制是由事务来实现的
        FragmentTransaction transaction = getSupportFragmentManager().beginTransaction();

        //第一种方式（add），初始化fragment并添加到事务中，如果为null就new一个
        if(f2 == null){
            f2 = new Blank2Fragment("朋友");
            transaction.add(R.id.main_frame_layout, f2);
        }
        mImgFrd.setImageResource(R.drawable.tab_find_frd_pressed);
        //隐藏所有fragment
        hideFragment(transaction);
        //显示需要显示的fragment
        transaction.show(f2);

        transaction.commit();
    }
    private void initFragment3(){
        //开启事务，fragment的控制是由事务来实现的
        FragmentTransaction transaction = getSupportFragmentManager().beginTransaction();

        //第一种方式（add），初始化fragment并添加到事务中，如果为null就new一个
        if(f3 == null){
            f3 = new Blank3Fragment("通讯录");
            transaction.add(R.id.main_frame_layout, f3);
        }
        mImgAddress.setImageResource(R.drawable.tab_address_pressed);
        //隐藏所有fragment
        hideFragment(transaction);
        //显示需要显示的fragment
        transaction.show(f3);

        //第二种方式(replace)，初始化fragment
//        }
//        if(f1 == null){
//            f1 = new MyFragment("消息");
//        transaction.replace(R.id.main_frame_layout, f1);

        //提交事务
        transaction.commit();
    }
    private void initFragment4(){
        //开启事务，fragment的控制是由事务来实现的
        FragmentTransaction transaction = getSupportFragmentManager().beginTransaction();

        //第一种方式（add），初始化fragment并添加到事务中，如果为null就new一个
        if(f4 == null){
            f4 = new Blank4Fragment("设置");
            transaction.add(R.id.main_frame_layout, f4);
        }
        mImgSettings.setImageResource(R.drawable.tab_settings_pressed);
        //隐藏所有fragment
        hideFragment(transaction);
        //显示需要显示的fragment
        transaction.show(f4);

        //第二种方式(replace)，初始化fragment
//        if(f1 == null){
//            f1 = new MyFragment("消息");
//        }
//        transaction.replace(R.id.main_frame_layout, f1);

        //提交事务
        transaction.commit();
    }
    //隐藏所有的fragment
    private void hideFragment(FragmentTransaction transaction){
        if(f1 != null){
            transaction.hide(f1);
        }
        if(f2 != null){
            transaction.hide(f2);
        }
        if(f3 != null){
            transaction.hide(f3);
        }
        if(f4 != null){
            transaction.hide(f4);
        }
    }

    @Override
    public void onClick(View v) {
        resetimg();
        if(v == foot1){
            initFragment1();
        }else if(v == foot2){
            initFragment2();
        }else if(v == foot3){
            initFragment3();
        }else if(v == foot4){
            initFragment4();
        }
    }

    public void resetimg(){
        mImgWeixin.setImageResource(R.drawable.tab_weixin_normal);
        mImgFrd.setImageResource(R.drawable.tab_find_frd_normal);
        mImgAddress.setImageResource(R.drawable.tab_address_normal);
        mImgSettings.setImageResource(R.drawable.tab_settings_normal);

    }
}

 最后附上源码的代码仓库地址（码云）

 as: as项目代码仓库 - Gitee.com