繁体   English   中英

适用于KitKat的Android 5.0材质设计风格导航抽屉

[英]Android 5.0 material design style navigation drawer for KitKat

我看到Android推出了新的导航抽屉图标,抽屉图标和后退箭头图标。 我们如何在Kitkat支持的应用程序中使用它。 查看Google最新版的报亭应用,它具有最新的导航抽屉图标和动画。 我们怎样才能实现呢?

我已经尝试将minSDK设置为19并将complileSDK设置为21,但它使用的是旧式图标。 这是自我实施的吗?

您需要使用appcompat v21中的新工具栏以及此库中的新ActionBarDrawerToggle

将gradle依赖项添加到gradle文件:

compile 'com.android.support:appcompat-v7:21.0.0'

您的activity_main.xml布局看起来像这样:

<!--I use android:fitsSystemWindows because I am changing the color of the statusbar as well-->
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/main_parent_view"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:fitsSystemWindows="true">

    <include layout="@layout/toolbar"/>

    <android.support.v4.widget.DrawerLayout
        android:id="@+id/drawer_layout"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <!-- Main layout -->
        <FrameLayout
            android:id="@+id/main_fragment_container"
            android:layout_width="match_parent"
            android:layout_height="match_parent" />

        <!-- Nav drawer -->
        <fragment
            android:id="@+id/fragment_drawer"
            android:name="com.example.packagename.DrawerFragment"
            android:layout_width="@dimen/drawer_width"
            android:layout_height="match_parent"
            android:layout_gravity="left|start" />
    </android.support.v4.widget.DrawerLayout>
</LinearLayout>

您的工具栏布局看起来像这样:

<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.Toolbar 
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/toolbar"
    app:theme="@style/ThemeOverlay.AppCompat.ActionBar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:minHeight="?attr/actionBarSize"
    android:background="?attr/colorPrimary"/>

您的活动必须延伸至:

ActionBarActivity

当您在活动中找到视图(抽屉和工具栏)时,将工具栏设置为支持操作栏并设置setDrawerListener:

setSupportActionBar(mToolbar);
mDrawerToggle= new ActionBarDrawerToggle(this, mDrawerLayout,mToolbar, R.string.app_name, R.string.app_name);
mDrawerLayout.setDrawerListener(mDrawerToggle);

之后你只需要处理菜单项和drawerToogle状态:

 @Override
public boolean onCreateOptionsMenu(Menu menu) {
    MenuInflater inflater = new MenuInflater(this);
    inflater.inflate(R.menu.menu_main,menu);
    return true;
}

@Override
public boolean onOptionsItemSelected(MenuItem item) {
    if (mDrawerToggle.onOptionsItemSelected(item)) {
        return true;
    }
    return super.onOptionsItemSelected(item);
}

@Override
protected void onPostCreate(Bundle savedInstanceState) {
    super.onPostCreate(savedInstanceState);
    mDrawerToggle.syncState();
}

@Override
public void onConfigurationChanged(Configuration newConfig) {
    super.onConfigurationChanged(newConfig);
    mDrawerToggle.onConfigurationChanged(newConfig);
}

@Override
public void onBackPressed() {
    if(mDrawerLayout.isDrawerOpen(Gravity.START|Gravity.LEFT)){
        mDrawerLayout.closeDrawers();
        return;
    }
    super.onBackPressed();
}

实现与工具栏之前的实现相同,您可以免费获得箭头动画。 没有头疼。 有关更多信息,请访

如果要在工具栏上方和状态栏下方显示抽屉,请参阅此问题

编辑:使用支持设计库中的NavigationView。 在这里学习如何使用的教程: http//antonioleiva.com/navigation-view/

如果您想要具有材料设计风格的真实导航抽屉( 在此处定义)
我已经实现了一个完全相同的自定义库。
你可以在这里找到它

支持热门评论以及新生成的main_content布局。 我只是使用DrawerLayout覆盖包含的内容布局。 请记住,drawerlayoutout必须具有此layout_behavior:appbar_scrolling_view_behavior

顶部容器的布局https://github.com/juanmendez/jm_android_dev/blob/master/01.fragments/06.fragments_with_rx/app/src/main/res/layout/activity_recycler.xml#L17

包含的内容布局https://github.com/juanmendez/jm_android_dev/blob/master/01.fragments/06.fragments_with_rx/app/src/main/res/layout/content_recycler.xml#L9

看导航抽屉!!

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM