[英]Android 5.0 material design style navigation drawer for KitKat
I see that Android introduced new navigation drawer icons, drawer icon and back arrow icon. 我看到Android推出了新的导航抽屉图标,抽屉图标和后退箭头图标。 How can we use that in Kitkat supported apps.
我们如何在Kitkat支持的应用程序中使用它。 See Google's latest version of Newsstand app, which has the latest navigation drawer icons and animations.
查看Google最新版的报亭应用,它具有最新的导航抽屉图标和动画。 How can we implement that?
我们怎样才能实现呢?
I have tried setting the minSDK to 19 and complileSDK to 21 but it's using the old style icons. 我已经尝试将minSDK设置为19并将complileSDK设置为21,但它使用的是旧式图标。 Is that self implemented?
这是自我实施的吗?
You need to use the new Toolbar in the appcompat v21 and the new ActionBarDrawerToggle
that is in this library as well. 您需要使用appcompat v21中的新工具栏以及此库中的新
ActionBarDrawerToggle
。
Add the gradle dependency to your gradle file: 将gradle依赖项添加到gradle文件:
compile 'com.android.support:appcompat-v7:21.0.0'
Your activity_main.xml
layout would look something like that: 您的
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>
Your Toolbar layout would look something like that: 您的工具栏布局看起来像这样:
<?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"/>
Your activity must extend from: 您的活动必须延伸至:
ActionBarActivity
When you find your views (drawer and toolbar) in the activity the set the toolbar as the support action bar and set the setDrawerListener: 当您在活动中找到视图(抽屉和工具栏)时,将工具栏设置为支持操作栏并设置setDrawerListener:
setSupportActionBar(mToolbar);
mDrawerToggle= new ActionBarDrawerToggle(this, mDrawerLayout,mToolbar, R.string.app_name, R.string.app_name);
mDrawerLayout.setDrawerListener(mDrawerToggle);
After that you just need to take care of the menu items and drawerToogle state: 之后你只需要处理菜单项和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();
}
The implementation is the same as It was before the Toolbar and you receive the arrow animation for free. 实现与工具栏之前的实现相同,您可以免费获得箭头动画。 No headaches.
没有头疼。 For more information follow:
有关更多信息,请访
The documentation . 文档 。
If you want to display the drawer over the Toolbar and under the status bar, please refer to this question . 如果要在工具栏上方和状态栏下方显示抽屉,请参阅此问题 。
EDIT: Use NavigationView from the support design library. 编辑:使用支持设计库中的NavigationView。 Tutorial to learn how to use in here: http://antonioleiva.com/navigation-view/
在这里学习如何使用的教程: http : //antonioleiva.com/navigation-view/
There are plenty of libraries now that can achieve this. 现在有很多库可以实现这一目标。
Choice 1 - https://github.com/neokree/MaterialNavigationDrawer 选择1 - https://github.com/neokree/MaterialNavigationDrawer
Others 其他
Supporting top comment along with the new generated main_content's layout. 支持热门评论以及新生成的main_content布局。 I simply override the included content layout with DrawerLayout.
我只是使用DrawerLayout覆盖包含的内容布局。 Keep in mind that your drawerlayout must have this layout_behavior: appbar_scrolling_view_behavior
请记住,drawerlayoutout必须具有此layout_behavior:appbar_scrolling_view_behavior
top container's layout 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/activity_recycler.xml#L17
included content layout https://github.com/juanmendez/jm_android_dev/blob/master/01.fragments/06.fragments_with_rx/app/src/main/res/layout/content_recycler.xml#L9 包含的内容布局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.