安卓ButtomBar实现方法

这里ButtomBar有3个items，分别有icon和文字，在当前fragment时，所属的icon和文字会显示不同颜色。

1. 首先要准好ICON素材，命名规范要清楚。

2. 实现这个ButtomBar用到fragment，架构是这样。

3. ButtomBar的TextView带ICON

        <TextView

            android:id="@+id/tvBbMainHome"

            android:layout_width="match_parent"

            android:layout_height="match_parent"

            android:layout_weight="1"

            android:gravity="center_vertical|center_horizontal"

            android:paddingBottom="4dp"

            android:text="主頁"

            android:drawableTop="@drawable/selector_icon_frag_home"

            android:textColor="@drawable/selector_bottom_text"

            android:textSize="12dp"

            android:paddingTop="6dp" />

用DrawTop在TextView上画ICON，TextColor来改变当前点选的颜色。看看代码就知道发生什麽事了。

selector_icon_frag_home

<?xml version="1.0" encoding="utf-8"?>

<selector xmlns:android="http://schemas.android.com/apk/res/android">

    <item android:drawable="@drawable/bb_main_home_select" android:state_selected="true"/>

    <item android:drawable="@drawable/bb_main_home_native"/>

</selector>

selector_bottom_text

<?xml version="1.0" encoding="utf-8"?>

<selector xmlns:android="http://schemas.android.com/apk/res/android">

    <item android:color="@color/bottomTextSelectedColor" android:state_selected="true"/>

    <item android:color="@color/bottomTextStabledColor"/>

</selector>

不算太复杂，不解释。

3. 先创建Fregment吧。

public class HomeFragment extends Fragment {

    @Override

    public View onCreateView (LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {

        view = inflater.inflate(R.layout.fragment_home, container, false);

        return view;

    }

}

别忘记要创建fragment_home。

4. 现在有了ButtonBar，有了Fragment，就可以用MainActivity调用它们来实现ButtonBar功能。

MainActivity初始化2个很重要的控件，FragmentManager和FragmentTransaction。

FragmentManager是管理Fragment，FragmentTransaction是过场效果。

这3个TextView就是ButtonBar的3个IC。

    // bottom bar main

    private TextView tvBbMainHome;

    private TextView tvBbMainAcademic;

    private TextView tvBbMainSet;

    // fragment

    private FragmentManager fragmentManager;

    private FragmentTransaction transaction;

    // fragment

    private HomeFragment homeFragment;

    private AcademicFragment academicFragment;

    private SetFrgment setFragment;

初始化。

    @Override

    protected void onCreate(Bundle savedInstanceState) {

        super.onCreate(savedInstanceState);

        supportRequestWindowFeature(Window.FEATURE_NO_TITLE);

        setContentView(R.layout.activity_main);

        fragmentManager = getSupportFragmentManager();

        initUI();

        initListener();

        // per-click the home page icon of button bar

        tvBbMainHome.performClick();

    }

看代码，不解释。

    private void initUI() {

        // bottom bar main

        tvBbMainHome = (TextView)findViewById(R.id.tvBbMainHome);

        tvBbMainAcademic = (TextView)findViewById(R.id.tvBbMainAcademic);

        tvBbMainSet = (TextView)findViewById(R.id.tvBbMainSet);

    }

    private void initListener() {

        // bottom bar Main

        tvBbMainHome.setOnClickListener(this);

        tvBbMainAcademic.setOnClickListener(this);

        tvBbMainSet.setOnClickListener(this);

    }

    private void setSelectorAllFalse() {

        tvBbMainHome.setSelected(false);

        tvBbMainAcademic.setSelected(false);

        tvBbMainSet.setSelected(false);

    }

    private void hideAllFragment() {

        if (homeFragment != null) {

            transaction.hide(homeFragment);

        }

        if (academicFragment != null) {

            transaction.hide(academicFragment);

        }

        if (setFragment != null) {

            transaction.hide(setFragment);

        }

    }

最核心的业务层在这。TextView继承了onClickListener。假如点中了TextView，首先会调用hideAllFragment，把所有Fragment都隐藏，保证画面是初始化了完全空白。

然后调用setSelectorAllFalse，确保不会出现连点的情况。

setSelected(true)是用来调用selector_bottom_text，转变TextView的颜色。

中间的太简单不解释。

最后别忘记调用transaction.commit()

    @Override

    public void onClick(View view) {

        transaction = fragmentManager.beginTransaction();

        hideAllFragment();

        setSelectorAllFalse();

        switch (view.getId()) {

            case R.id.tvBbMainHome:

                tvBbMainHome.setSelected(true);

                if (homeFragment == null) {

                    homeFragment = new HomeFragment();

                    transaction.add(R.id.frameLayout, homeFragment, "homeFragment");

                }

                transaction.show(homeFragment);

                break;

            case R.id.tvBbMainAcademic:

                tvBbMainAcademic.setSelected(true);

                if (academicFragment == null) {

                    academicFragment = new AcademicFragment();

                    transaction.add(R.id.frameLayout, academicFragment, "academicFragment");

                }

                transaction.show(academicFragment);

                break;

            case R.id.tvBbMainSet:

                tvBbMainSet.setSelected(true);

                if (setFragment == null) {

                    setFragment = new SetFrgment();

                    transaction.add(R.id.frameLayout, setFragment, "setFragment");

                }

                transaction.show(setFragment);

                break;

        }

        transaction.commit();

    }

吾系佛系青年，庚叁透叁透！

巴特西

安卓ButtomBar实现方法

最新文章

热门文章