美文网首页
使用DrawerLayout

使用DrawerLayout

作者: MrAbel | 来源:发表于2017-04-01 14:03 被阅读0次

    引言

    本文主要参考Android开发文档Creating a Navigation Drawer

    创建DrawLayout布局

    为了在项目中引入DrawLayout布局,让DrawLayout对象作为布局的根视图,然后在这个DrawLayout里面添加一个主内容视图(当导航抽屉隐藏时,显示内容的布局)以及一个包含导航抽屉内容的视图。如下所示:

    <android.support.v4.widget.DrawerLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/drawer_layout"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
    
        <FrameLayout
            android:id="@+id/content_frame"
            android:layout_width="match_parent"
            android:layout_height="match_parent" />
    
        <ListView
            android:id="@+id/left_drawer"
            android:layout_width="240dp"
            android:layout_height="match_parent"
            android:layout_gravity="start"
            android:choiceMode="singleChoice"
            android:divider="@android:color/transparent"
            android:dividerHeight="0dp"
            android:background="#111"/>
    </android.support.v4.widget.DrawerLayout>
    
    

    引入DrawerLayout布局要注意一些要求:

    • 主要内容的视图(FrameLayout)必须是DrawLayout的第一个子节点, 因为导航抽屉是在主要内容视图的上面。
    • 主要内容视图的layout_width layout_height均设置为match_parent,因为当导航抽屉隐藏时,它填充了整个界面。
    • 抽屉视图(ListView)必须指定其水平重力(android:layout_gravity)属性。如果指定为左菜单时,值为left,右菜单为right。然而不过要跟随系统语言方向(比如系统文字是从做到右,或者从右到左)用start
    • 抽屉视图用dp单位来指定其宽度,并且高度匹配父视图。抽屉的宽度不能超过320 dp, 因此用户总是可以看到主要内容视图的一部分。

    初始化Drawer ListView

    初始化列表就是为抽屉里的列表填充数据,这里我们将数据定义在res/values/strings.xml里,如下所示

    <string-array name="drawer_menu">
            <item>Menu 1</item>
            <item>Menu 2</item>
            <item>Menu 3</item>
            <item>Menu 4</item>
    </string-array>
    

    ListView中的子项创建布局如下:

    <?xml version="1.0" encoding="utf-8"?>
    <TextView xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@android:id/text1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:textAppearance="?android:attr/textAppearanceListItemSmall"
        android:gravity="center_vertical"
        android:paddingLeft="16dp"
        android:paddingRight="16dp"
        android:textColor="#fff"
        android:background="?android:attr/activatedBackgroundIndicator"
        android:minHeight="?android:attr/listPreferredItemHeightSmall"/>
    

    接下来,在MainActivity.java中对ListView进行初始化,配置适配器,设置监听器,如下所示:

    // 定义变量
    private String[] mDrawerMenuTitles;
    private DrawerLayout mDrawerLayout;
    private ListView mDrawerListView;
    
    // 初始化变量
    mDrawerLayout = (DrawerLayout)findViewById(R.id.drawer_layout);
    mDrawerListView = (ListView)findViewById(R.id.left_drawer);
    mDrawerMenuTitles = getResources().getStringArray(R.array.drawer_menu);
    
    // 为ListView设置适配器
    mDrawerListView.setAdapter(new ArrayAdapter<String>(this, R.layout.drawer_list_item, mDrawerMenuTitles));
    
    // 为ListView设置监听器
    mDrawerListView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
        @Override
        public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
            selectItem(position);   // 对点事件的处理
        }
    });
    

    处理ListView中子项的点击事件

    这里实现点击事件为切换主界面的Fragment,每点击一个Item,就会创建相应的ContentFragment,然后更换掉主界面的Fragment。因此要创建一个继承自FragmentContentFragment,首先创建一个fragment_content布局:

    <?xml version="1.0" encoding="utf-8"?>
    <TextView xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/text2"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
    
    </TextView>
    

    创建ContentFragment类,以及实现selectItem()(点击事件的处理)

    
    public static class ContentFragment extends Fragment {
        public static final String ARG_DRAWER_MENU_NUMBER = "drawer_menu_number";
    
        public ContentFragment() {
            // Empty constructor required for fragment subclasses
        }
    
        @Override
        public View onCreateView(LayoutInflater inflater, ViewGroup container,
                                 Bundle savedInstanceState) {
            View rootView = inflater.inflate(R.layout.fragment_content, container, false);
            int i = getArguments().getInt(ARG_DRAWER_MENU_NUMBER);
            String menuItem = getResources().getStringArray(R.array.drawer_menu)[i];
    
            ((TextView)rootView.findViewById(R.id.text2)).setText(menuItem);
            return rootView;
        }
    }
        
    private void selectItem(int position){
        Fragment fragment = new ContentFragment();
        Bundle args = new Bundle();
        switch (position) {
            case 0:
                args.putInt(ContentFragment.ARG_DRAWER_MENU_NUMBER, position);
                break;
            case 1:
                args.putInt(ContentFragment.ARG_DRAWER_MENU_NUMBER, position);
                break;
            case 2:
                args.putInt(ContentFragment.ARG_DRAWER_MENU_NUMBER, position);
                break;
            case 3:
                  args.putInt(ContentFragment.ARG_DRAWER_MENU_NUMBER, position);
                break;
            default:
                break;
        }
        // FragmentActivity将点击的菜单列表标题传递给Fragment
        fragment.setArguments(args); 
    
        // 插入Fragment
        FragmentManager fragmentManager = getSupportFragmentManager();
        fragmentManager.beginTransaction().replace(R.id.content_frame, fragment).commit();
    
        // 更新选择后的item和title,然后关闭菜单
        mDrawerListView.setItemChecked(position, true);
        setTitle(mDrawerMenuTitles[position]);
        mDrawerLayout.closeDrawer(mDrawerListView);
    }
    

    相关文章

      网友评论

          本文标题:使用DrawerLayout

          本文链接:https://www.haomeiwen.com/subject/giyiottx.html