Fragment + TabLayout 实现切换页面

今天使用Fragment + TabLayout 实现切换

  • 依赖

implementation 'com.android.support:design:27.1.1' //防止版本错误

  • xml文件
  1. 布局页面,activity_main.xml



    

        

    

    

    

    


  1. fragment 页面 ,fragment_home.xml、fragment_upload.xml

fragment_home.xml




    
    


fragment_upload.xml




    
    


  • java文件
  1. 布局页面,MainActivity.java
public class MainActivity extends AppCompatActivity implements TabLayout.OnTabSelectedListener {

    private FrameLayout mFrame;
    private TabLayout mTab;
    private HomeFragment mHomeFragment;
    private UploadFragment mUploadFragment;
    private Toolbar mToolBar;
    private TextView mTvTitle;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        initView();
        initTab();      // 设置TabLayout的标题
        initToolBar();  // 设置ToolBar
        initFragmentReplace();  // 设置开启页面时fragment的显示和影藏
        mTab.addOnTabSelectedListener(this);    // 设置TabLayout选择监听
    }

    private void initTab() {

        mTab.addTab(mTab.newTab().setText("首页"));
        mTab.addTab(mTab.newTab().setText("上传"));

    }

    private void initToolBar() {
        mToolBar.setTitle("");
        setSupportActionBar(mToolBar);
    }

    private void initFragmentReplace() {

        // 获取到fragment碎片管理器
        FragmentManager manager = getSupportFragmentManager();
        // 开启事务
        FragmentTransaction transaction = manager.beginTransaction();

        // 获取到fragment的对象
        mHomeFragment = new HomeFragment();
        mUploadFragment = new UploadFragment();

        // 设置要显示的fragment 和 影藏的fragment
        transaction.add(R.id.frame, mHomeFragment, "home").show(mHomeFragment);
        transaction.add(R.id.frame, mUploadFragment, "upload").hide(mUploadFragment);

        // 提交事务
        transaction.commit();

    }

    private void initView() {
        // 获取控件对象
        mTab = (TabLayout) findViewById(R.id.tab);
        mFrame = (FrameLayout) findViewById(R.id.frame);
        mToolBar = (Toolbar) findViewById(R.id.toolBar);
        mTvTitle = (TextView) findViewById(R.id.tv_title);

    }

    @Override
    public void onTabSelected(TabLayout.Tab tab) {

        // 设置标题
        mTvTitle.setText(tab.getText());

        // 设置选中时fragment的显示和影藏
        switch (tab.getPosition()) {
            case 0:
                FragmentManager fragmentManager = getSupportFragmentManager();
                FragmentTransaction transaction = fragmentManager.beginTransaction();
                transaction.show(mHomeFragment).hide(mUploadFragment).commit();

                break;
            case 1:
                FragmentManager fragmentManager1 = getSupportFragmentManager();
                FragmentTransaction transaction1 = fragmentManager1.beginTransaction();
                transaction1.show(mUploadFragment).hide(mHomeFragment).commit();

                break;
        }
    }

    @Override
    public void onTabUnselected(TabLayout.Tab tab) {

    }

    @Override
    public void onTabReselected(TabLayout.Tab tab) {

    }
}

  1. fragment页面,HomeFragment.java、UploadFragment.java

HomeFragment.java

public class HomeFragment extends Fragment {


    public HomeFragment() {
        // Required empty public constructor
    }


    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {
        // Inflate the layout for this fragment
        return inflater.inflate(R.layout.fragment_home, container, false);
    }

}

UploadFragment.java

public class UploadFragment extends Fragment {


    public UploadFragment() {
        // Required empty public constructor
    }


    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {
        // Inflate the layout for this fragment
        return inflater.inflate(R.layout.fragment_upload, container, false);
    }

}

你可能感兴趣的:(Fragment + TabLayout 实现切换页面)