移动开发第一次作业--类微信界面设计

本文链接：https://blog.csdn.net/weixin_43238931/article/details/104976487

页面布局

底部标签栏,四个Linear横向布局
四个标签对应的页面主部分内容（四个fragment）
顶部top部分显示内容

核心代码MainActivity.java

initFragment()

初始化fragment，将四个fragment内容依次放入transation中

private void initFragment() {

        FragmentTransaction transaction = fm.beginTransaction();
        transaction.add(R.id.id_content, mTab01);
        transaction.add(R.id.id_content, mTab02);
        transaction.add(R.id.id_content, mTab03);
        transaction.add(R.id.id_content, mTab04);
        transaction.commit();
    }

initView()

初始化view，将底部四个LinearLayout与四个fragment绑定

private void initView() {
        mTabWeixin = (LinearLayout) findViewById(R.id.id_tab_weixin);
        mTabFrd = (LinearLayout) findViewById(R.id.id_tab_frd);
        mTabContact = (LinearLayout) findViewById(R.id.id_tab_contact);
        mTabSetting = (LinearLayout) findViewById(R.id.id_tab_settings);

        mImgWeixin = (ImageButton)findViewById(R.id.id_tab_weixin_img);
        mImgFrd = (ImageButton)findViewById(R.id.id_tab_frd_img);
        mImgContact = (ImageButton)findViewById(R.id.id_tab_contact_img);
        mImgSetting = (ImageButton)findViewById(R.id.id_tab_settings_img);

    }

selectFragment(int i)

选择索引为i的部分，当选择第i个LinearLayout时，第i个fragment显示出来，并且将该标签栏图标变为被激活的图标（即另一张图片）

private void selectFragment(int i) {
        // 先将所有图标颜色还原
        resetImg();
        FragmentTransaction transaction = fm.beginTransaction();
        hideFragment(transaction);
        switch (i) {
            case 0:
                transaction.show(mTab01);
                mImgWeixin.setImageResource(R.drawable.tab_weixin_pressed);
                break;
            case 1:
                transaction.show(mTab02);
                mImgFrd.setImageResource(R.drawable.tab_find_frd_pressed);
                break;
            case 2:
                transaction.show(mTab03);
                mImgContact.setImageResource(R.drawable.tab_address_pressed);
                break;
            case 3:
                transaction.show(mTab04);
                mImgSetting.setImageResource(R.drawable.tab_settings_pressed);
                break;
            default:
                break;
        }
        transaction.commit();
    }

initEvent()

默认监听范围为全屏，此时会占用过多资源，通过编写initEvent()将监听范围缩小至底部四个LinearLayout,减少内存消耗

private void initEvent() {
        mTabWeixin.setOnClickListener(this);
        mTabFrd.setOnClickListener(this);
        mTabContact.setOnClickListener(this);
        mTabSetting.setOnClickListener(this);
    }