Android中巧用官方自带View —— 导航

发表于 阅读次数：

TabLayout

  • 步骤：
    1. 布局（TabLayout和ViewPager位置关系）；
    2. 自定义Adapter（继承自 FragmentPagerAdapter），并配置Fragment和tab标题内容；
    3. java代码中给ViewPager绑定Adapter；

  1. 布局

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    <?xml version="1.0" encoding="utf-8"?>
    <merge xmlns:android="http://schemas.android.com/apk/res/android"
                  xmlns:app="http://schemas.android.com/apk/res-auto"
                  android:layout_width="match_parent"
                  android:layout_height="match_parent"
                  android:orientation="vertical">

        <View
            android:layout_width="match_parent"
            android:layout_height="0.1dp"
            android:background="@color/tab_sep"/>

        <android.support.design.widget.TabLayout
            android:id="@+id/sliding_tabs"
            style="@style/MyCustomTabLayout"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:tabMode="fixed"/>

        <View
            android:layout_width="match_parent"
            android:layout_height="0.1dp"
            android:background="@color/tab_sep"/>

        <android.support.v4.view.ViewPager
            android:id="@+id/viewpager"
            android:layout_width="match_parent"
            android:layout_height="0px"
            android:layout_weight="1"/>
    </merge>

  2. 自定义Adapter

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29

    public class ModeListVpAdapter extends FragmentPagerAdapter {
        private final String mTabTitles[];
        private final Mode.Position[] mPosition = Mode.Position.values();
        private final int PAGE_COUNT = mPosition.length;
        private Context mContext;

        public ModeListVpAdapter(FragmentManager fm, Context context) {
            super(fm);
            mContext = context;
            mTabTitles = context.getResources().getStringArray(R.array.main_tabs);
        }

        @Override
        public int getCount() {
            return PAGE_COUNT;
        }

        @Override
        public Fragment getItem(int position) {
            return ModeListFragment.newInstance(position); // 根据position返回对应的fragment
        }

        @Override
        public CharSequence getPageTitle(int position) {
            return mTabTitles[position]; // 根据position返回对应的tab标题
        }

    }

  3. 绑定

    1
    2
    3
    4
    5
    6
    ViewPager viewPager = (ViewPager) findViewById(R.id.viewpager);
    viewPager.setAdapter(new ModeListVpAdapter(getSupportFragmentManager(), mContext));

    TabLayout tabLayout = (TabLayout) findViewById(R.id.sliding_tabs);
    tabLayout.setupWithViewPager(viewPager);
    viewPager.setCurrentItem(2); // 默认选中第二个tab

DrawerLayout & NavigationView

  • NavigationView隐藏menu：不使用app:menu属性即可；
  • 给NavigationView头部布局组件设置点击事件：可以通过mNavView.getHeaderView(0)获取根布局的view引用；
  • 禁用滑动
    1
    2
    3
    4
    // lock
    mDrawerLayout.setDrawerLockMode(DrawerLayout.LOCK_MODE_LOCKED_CLOSED);
    // unlock
    mDrawerLayout.setDrawerLockMode(DrawerLayout.LOCK_MODE_UNLOCKED);

外部链接

ToolBar

  • 切换fragment时对应显示不同的菜单：
    通过控制自定义的标志，然后调用invalidateOptionsMenu();刷新菜单即可；

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    @Override
    protected boolean onPrepareOptionsPanel(View view, Menu menu) {
        if (mMode == DEVICE_FRAGMENT) {
            menu.findItem(R.id.action_add).setVisible(true);
            menu.findItem(R.id.action_ok).setVisible(false);
        } else if (mMode == SETTING_TIME_FRAGMENT) {
            menu.findItem(R.id.action_add).setVisible(false);
            menu.findItem(R.id.action_ok).setVisible(true);
        }
        return super.onPrepareOptionsPanel(view, menu);
    }

  • 在Fragment中获取ToolBar对象，并监听点击事件；

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    Toolbar toolbar = (Toolbar) getActivity().findViewById(R.id.toolbar);
    TextView tvTitle = (TextView) toolbar.findViewById(R.id.tv_nav_title);
    tvTitle.setText("标题1");

    // 处理toolbar上的菜单点击事件；
    toolbar.setOnMenuItemClickListener(new Toolbar.OnMenuItemClickListener() {
        @Override
        public boolean onMenuItemClick(MenuItem item) {
            switch (item.getItemId()) {
                case R.id.action_ok:
                    Usp.init(mContext).putInt(CKeys.KEY_TS, indexInTIMES(mRgSettingTime.getCheckedRadioButtonId()));
                    Utoast.toastOnMain(mContext, mContext.getString(R.string.time_setting_setted));
                    break;
            }
            return false;
        }
    });

适配

Toolbar 里面有两个属性很关键:
android:minHeight=”?attr/actionBarSize”,这个表示引用系统 ActionBar 的高度.
android:paddingTop=”@dimen/tool_bar_top_padding”这个是来引用资源文件里面的tool_bar_top_padding的高度,这个高度主要是为了对5.0做适配,在5.0 上为24dp,其他版本为0dp

外部链接