导航抽屉（menudrawer）Android 5（棒棒糖）风格

Question

我在我的项目中使用menudrawer库（这一个：https://github.com/SimonVT/android-menudrawer）。

我正在更新我的应用程序，以便与API21（Android 5 Lollipop）和Material Design兼容。当你在API21中使用这个库时，menudrawer图标看起来很糟糕。

我想实现您可以在新Play商店中看到的转换（新menudrawer图标转换为箭头）。

什么是做到这一点的最好方法是什么？这个库有可能吗？我现在唯一想到的解决方案是自定义绘制。但也许我可以使用本地可绘制的方式？

Answer 1

好的。我花了几个小时用新的API，我认为最适合我的是将我的抽屉从lib重写为原生DrawerLayout。

但也许这对于有类似问题的人会有用。我已经使用DrawerLayout创建了测试项目（Android Studio - >使用menudrawer的新项目）。

然后我看到了同样的问题。错误的图标。如果你想看到花哨的动画和良好的Android 5.0图标请确保您使用的是：

import android.support.**v7**.app.ActionBarDrawerToggle; 

请注意v7。默认情况下，片段类有v4导入，然后你将看不到好的图标。

另一件事。更改为v7后，您需要修复ActionBarDrawerToggle函数到新的构造函数。就是这样。你会看到新的抽屉图标。

Answer 2

首先，确保您更新到最新的SDK。在Android Studio中创建新项目，然后在buid.gradle中添加appcompat-v7.21.0。+和appcompat-v4.21.0。+库作为gradle依赖项。

compile 'com.android.support:appcompat-v7:21.0.2' 
compile 'com.android.support:support-v4:21.0.2' 

在color.xml文件中添加primaryColor和primarycolorDark。

<resources> 
<color name="primaryColor">#2196F3</color> 
<color name="primaryColorDark">#0D47A1</color> 
</resources> 

在您的strings.xml文件中添加抽屉打开/关闭字符串值。

<resources> 
<string name="app_name">Lollipop Drawer</string> 
<string name="action_settings">Settings</string> 
<string name="drawer_open">open</string> 
<string name="drawer_close">close</string> 
</resources> 

你activity_my.xml布局文件看起来是这样的：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
xmlns:tools="http://schemas.android.com/tools" 
android:layout_width="match_parent" 
android:orientation="vertical" 
android:layout_height="match_parent" 
tools:context=".MainActivity"> 

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


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

    <!-- activity view --> 
    <RelativeLayout 
     android:layout_width="match_parent" 
     android:background="#fff" 
     android:layout_height="match_parent"> 

     <TextView 
      android:layout_centerInParent="true" 
      android:layout_width="wrap_content" 
      android:textColor="#000" 
      android:text="Activity Content" 
      android:layout_height="wrap_content" /> 
    </RelativeLayout> 

    <!-- navigation drawer --> 
    <RelativeLayout 
     android:layout_gravity="left|start" 
     android:layout_width="match_parent" 
     android:background="#fff" 
     android:layout_height="match_parent"> 

     <ListView 
      android:id="@+id/left_drawer" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:divider="#eee" 
      android:background="#fff" 
      android:dividerHeight="1dp" /> 
    </RelativeLayout> 

</android.support.v4.widget.DrawerLayout> 

</LinearLayout> 

你toolbar.xml布局文件看起来是这样的：

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

</android.support.v7.widget.Toolbar> 

你MyActivity.java看起来是这样的： 在这里你的活动必须扩展ActionBarActivity并将你的工具栏设置为支持操作栏。

import android.content.res.Configuration; 
import android.support.v4.widget.DrawerLayout; 
import android.support.v7.app.ActionBarActivity; 
import android.os.Bundle; 
import android.support.v7.app.ActionBarDrawerToggle; 
import android.support.v7.widget.Toolbar; 
import android.view.Menu; 
import android.view.MenuItem; 
import android.view.View; 
import android.widget.ArrayAdapter; 
import android.widget.ListView; 

public class MyActivity extends ActionBarActivity { 

private Toolbar toolbar; 
private DrawerLayout drawerLayout; 
private ActionBarDrawerToggle drawerToggle; 
private ListView leftDrawerList; 
private ArrayAdapter<String> navigationDrawerAdapter; 
private String[] leftSliderData = {"Home", "Android", "Sitemap", "About", "Contact Me"}; 

@Override 
protected void onCreate(Bundle savedInstanceState) { 
    super.onCreate(savedInstanceState); 
    setContentView(R.layout.activity_my); 
    nitView(); 
    if (toolbar != null) { 
     toolbar.setTitle("Navigation Drawer"); 
     setSupportActionBar(toolbar); 
    } 
    initDrawer(); 
} 

private void nitView() { 
    leftDrawerList = (ListView) findViewById(R.id.left_drawer); 
    toolbar = (Toolbar) findViewById(R.id.toolbar); 
    drawerLayout = (DrawerLayout) findViewById(R.id.drawerLayout); 
    navigationDrawerAdapter=new ArrayAdapter<String>(MyActivity.this, android.R.layout.simple_list_item_1, leftSliderData); 
    leftDrawerList.setAdapter(navigationDrawerAdapter); 
} 

private void initDrawer() { 

    drawerToggle = new ActionBarDrawerToggle(this, drawerLayout, toolbar, R.string.drawer_open, R.string.drawer_close) { 

     @Override 
     public void onDrawerClosed(View drawerView) { 
      super.onDrawerClosed(drawerView); 

     } 

     @Override 
     public void onDrawerOpened(View drawerView) { 
      super.onDrawerOpened(drawerView); 

     } 
    }; 
    drawerLayout.setDrawerListener(drawerToggle); 
} 

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

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

@Override 
public boolean onCreateOptionsMenu(Menu menu) { 
    getMenuInflater().inflate(R.menu.my, menu); 
    return true; 
} 

@Override 
public boolean onOptionsItemSelected(MenuItem item) { 
    int id = item.getItemId(); 
    if (id == R.id.action_settings) { 
     return true; 
    } 
    if (drawerToggle.onOptionsItemSelected(item)) { 
     return true; 
    } 
    return super.onOptionsItemSelected(item); 
} 
} 

为Android棒棒糖

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

<style name="myAppTheme" parent="Theme.AppCompat.Light.NoActionBar"> 
    <item name="colorPrimary">@color/primaryColor</item> 
    <item name="colorPrimaryDark">@color/primaryColorDark</item> 
    <item name="android:statusBarColor">@color/primaryColorDark</item> 

    <item name="drawerArrowStyle">@style/DrawerArrowStyle</item> 
</style> 

<style name="DrawerArrowStyle" parent="Widget.AppCompat.DrawerArrowToggle"> 
    <item name="spinBars">true</item> 
    <item name="color">@android:color/black</item> 
</style> 

</resources> 

创建值-21文件夹style.xml文件来创建自己的风格。在值文件夹的XML文件旧版本的Android，然后棒棒糖

<resources> 

<style name="myAppTheme" parent="Theme.AppCompat.Light"> 
    <item name="colorPrimary">@color/primaryColor</item> 
    <item name="colorPrimaryDark">@color/primaryColorDark</item> 
    <item name="android:windowNoTitle">true</item> 
    <item name="windowActionBar">false</item> 
    <item name="drawerArrowStyle">@style/DrawerArrowStyle</item> 
</style> 

<style name="DrawerArrowStyle" parent="Widget.AppCompat.DrawerArrowToggle"> 
    <item name="spinBars">true</item> 
    <item name="color">@android:color/black</item> 
</style> 

</resources> 

您的AndroidManifest.xml看起来是这样的：

<?xml version="1.0" encoding="utf-8"?> 
<manifest xmlns:android="http://schemas.android.com/apk/res/android" 
package="nkdroid.com.lollipopdrawer" > 

<application 
    android:allowBackup="true" 
    android:icon="@drawable/ic_launcher" 
    android:label="@string/app_name" 
    android:theme="@style/myAppTheme" > 
    <activity 
     android:name=".MyActivity" 
     android:label="@string/app_name" > 
     <intent-filter> 
      <action android:name="android.intent.action.MAIN" /> 

      <category android:name="android.intent.category.LAUNCHER" /> 
     </intent-filter> 
    </activity> 
</application> 

</manifest> 

仅供参考： 你可以从这里下载完整的源代码： click here

Answer 3

查看Android团队于2015年5月发布的新棒棒糖组件。

Design Support Library

Blog on Design Support Library