如何从Android appcompat v7 21库实现DrawerArrowToggle

所以现在安卓5.0发布了，我想知道如何实现动画的actionbar图标

这个库对我来说很好地实现了它，但是既然appcompat v7库有它，如何实现它呢

该库在themes.xml中引用它

 <item name="drawerArrowStyle">@style/Widget.AppCompat.DrawerArrowToggle</item>

@style/Widget.AppCompat.drawerRowToggle

在这种风格下

 <style name="Base.V7.Theme.AppCompat" parent="Platform.AppCompat">

更新

我使用v7抽屉切换实现了这一点。但是我不能设计它。请帮忙

我在v7 styles_base.xml中找到了它的样式

<style name="Base.Widget.AppCompat.DrawerArrowToggle" parent="">
    <item name="color">?android:attr/textColorSecondary</item>
    <item name="thickness">2dp</item>
    <item name="barSize">18dp</item>
    <item name="gapBetweenBars">3dp</item>
    <item name="topBottomBarArrowSize">11.31dp</item>
    <item name="middleBarArrowSize">16dp</item>
    <item name="drawableSize">24dp</item>
    <item name="spinBars">true</item>
</style>

？android:attr/textColorSecondary
2dp
18dp
3dp
11.31 DP
16dp
24dp
真的

我将此添加到我的样式中，但不起作用。还添加到我的attr.xml中

<declare-styleable name="DrawerArrowToggle">
    <!-- The drawing color for the bars -->
    <attr name="color" format="color"/>
    <!-- Whether bars should rotate or not during transition -->
    <attr name="spinBars" format="boolean"/>
    <!-- The total size of the drawable -->
    <attr name="drawableSize" format="dimension"/>
    <!-- The max gap between the bars when they are parallel to each other -->
    <attr name="gapBetweenBars" format="dimension"/>
    <!-- The size of the top and bottom bars when they merge to the middle bar to form an arrow -->
    <attr name="topBottomBarArrowSize" format="dimension"/>
    <!-- The size of the middle bar when top and bottom bars merge into middle bar to form an arrow -->
    <attr name="middleBarArrowSize" format="dimension"/>
    <!-- The size of the bars when they are parallel to each other -->
    <attr name="barSize" format="dimension"/>
    <!-- The thickness (stroke size) for the bar paint -->
    <attr name="thickness" format="dimension"/>
</declare-styleable>

---

但这样做时会崩溃并显示颜色类型错误。我缺少什么？

如果您正在使用中建议的支持库，您可以使用新添加的支持库（注意：与现在不推荐的支持库不同）：

抽屉关闭时显示汉堡包图标，抽屉打开时显示箭头。抽屉打开时，它会在这两种状态之间设置动画

---

虽然培训尚未更新以考虑弃用/新建类，但您应该能够使用几乎完全相同的代码-实现它的唯一区别是构造函数。

首先，您应该知道现在

android.support.v4.app.ActionBarDrawerToggle

已弃用

您必须将其替换为android.support.v7.app.ActionBarDrawerToggle

下面是我的示例，我使用新的

工具栏

替换

操作栏

MainActivity.java

styles.xml

@样式/抽屉箭头样式
真的
@android：彩色/白色

你可以在网上阅读文件

该属性是实现菜单到箭头动画的关键

公共静态int-drawerRowToggle_微调条

在转换过程中，条是否应旋转
必须是布尔值，为“真”或“假”。

因此，您可以设置为：

true

然后可以呈现动画

---

希望这能对您有所帮助。

我想更正一下上面的代码

    public class MainActivity extends ActionBarActivity {
        @Override
        protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        Toolbar mToolbar = (Toolbar) findViewById(R.id.toolbar);
        DrawerLayout mDrawerLayout = (DrawerLayout) findViewById(R.id.drawer_layout);
        ActionBarDrawerToggle mDrawerToggle = new ActionBarDrawerToggle(
            this,  mDrawerLayout, mToolbar,
            R.string.navigation_drawer_open, R.string.navigation_drawer_close
        );
        mDrawerLayout.setDrawerListener(mDrawerToggle);

        getSupportActionBar().setDisplayHomeAsUpEnabled(true);
        getSupportActionBar().setHomeButtonEnabled(true);
    }

所有其他的事情都会保持不变

对于有问题的用户

Drawerlayout

overlaying工具栏

---

将android:layout_marginTop=“？attr/actionBarSize”添加到抽屉内容的根布局中

我创建了一个具有类似功能的小应用程序

主要活动

public class MyActivity extends ActionBarActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_my);

        DrawerLayout drawerLayout = (DrawerLayout) findViewById(R.id.drawer);
        android.support.v7.widget.Toolbar toolbar = (android.support.v7.widget.Toolbar) findViewById(R.id.toolbar);
        ActionBarDrawerToggle actionBarDrawerToggle = new ActionBarDrawerToggle(
                this,
                drawerLayout,
                toolbar,
                R.string.open,
                R.string.close
        )

        {
            public void onDrawerClosed(View view)
            {
                super.onDrawerClosed(view);
                invalidateOptionsMenu();
                syncState();
            }

            public void onDrawerOpened(View drawerView)
            {
                super.onDrawerOpened(drawerView);
                invalidateOptionsMenu();
                syncState();
            }
        };
        drawerLayout.setDrawerListener(actionBarDrawerToggle);

        //Set the custom toolbar
        if (toolbar != null){
            setSupportActionBar(toolbar);
        }

        getSupportActionBar().setDisplayHomeAsUpEnabled(true);

        actionBarDrawerToggle.syncState();
    }
}

我对那项活动的看法

<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MyActivity"
    android:id="@+id/drawer"
    >

    <!-- The main content view -->
    <FrameLayout
        android:id="@+id/content_frame"
        android:layout_width="match_parent"
        android:layout_height="match_parent" >
        <include layout="@layout/toolbar_custom"/>
    </FrameLayout>
    <!-- The navigation drawer -->
    <ListView
        android:layout_marginTop="?attr/actionBarSize"
        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="#457C50"/>


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

我的自定义工具栏XML

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

<android.support.v7.widget.Toolbar
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:id="@+id/toolbar"
    android:background="?attr/colorPrimaryDark">
    <TextView android:text="U titel"
        android:textAppearance="@android:style/TextAppearance.Theme"
        android:textColor="@android:color/white"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        />
</android.support.v7.widget.Toolbar>

我的主题风格

<resources>
    <style name="AppTheme" parent="Base.Theme.AppCompat"/>

    <style name="AppTheme.Base" parent="Theme.AppCompat">
        <item name="colorPrimary">@color/primary</item>
        <item name="colorPrimaryDark">@color/primaryDarker</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/white</item>
    </style>

    <color name="primary">#457C50</color>
    <color name="primaryDarker">#580C0C</color>
</resources>

@颜色/原色
@颜色/原色较深
真的
假的
@样式/抽屉箭头样式
真的
@android：彩色/白色
#457C50
#580C0C

我在values-v21中的风格

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <style name="AppTheme" parent="AppTheme.Base">
        <item name="android:windowContentTransitions">true</item>
        <item name="android:windowAllowEnterTransitionOverlap">true</item>
        <item name="android:windowAllowReturnTransitionOverlap">true</item>
        <item name="android:windowSharedElementEnterTransition">@android:transition/move</item>
        <item name="android:windowSharedElementExitTransition">@android:transition/move</item>
    </style>
</resources>

真的
真的
真的
@android：过渡/移动
@android：过渡/移动

要回答问题的更新部分：要设置抽屉图标/箭头的样式，您有两个选项：

设置箭头本身的样式 为此，请在主题中覆盖

drawerRowStyle

，如下所示：

<style name="AppBaseTheme" parent="Theme.AppCompat.Light">
    <item name="drawerArrowStyle">@style/MyTheme.DrawerArrowToggle</item>
</style>
<style name="MyTheme.DrawerArrowToggle" parent="Widget.AppCompat.DrawerArrowToggle">
    <item name="color">@android:color/holo_purple</item>
    <!-- ^ this will make the icon purple -->
</style>

这里需要注意的一点是，当使用带有

工具栏的自定义布局时，而不是使用stock ActionBar实现（例如，如果您使用
抽屉布局
-
导航视图
-
工具栏
组合来实现材质样式的抽屉效果，在半透明状态栏下它是可见的），
actionBarTheme
属性显然不是自动拾取的（因为默认的
ActionBar
属性是由
AppCompatActivity
处理的），所以对于自定义的
工具栏
不要忘记手动应用主题：

<!--inside your custom layout with DrawerLayout
and NavigationView or whatever -->
<android.support.v7.widget.Toolbar
        ...
        app:theme="?actionBarTheme">



--这将解析为AppCompat的默认
ThemeOverlay.AppCompat.ActionBar
，或者如果在派生主题中设置了属性，则解析为覆盖

PS关于
drawerArrowStyle
覆盖和
spinBars
属性的一点评论——许多来源建议将其设置为
true
，以获得抽屉/箭头动画。问题是，
spinBars
在AppCompat中默认为
true
（查看
Base.Widget.AppCompat.drawerRowToggle.Common
样式），您根本不必重写
actionBarTheme
，就可以让动画正常工作。即使覆盖动画并将属性设置为
false
，也会得到动画，这只是一个不同的、不太扭曲的动画。这里最重要的是使用
ActionBarDrawerToggle
，这是吸引精美动画绘图的原因。
我在我的应用程序bc中使用v4，我不需要支持api 15之前的设备。所以如果我想让它工作，我就必须使用v7 actionbar抽屉开关？如果我这样做了，我是否必须将所有样式转换为AppCompat，将片段活动转换为actionbar活动等等？或者我可以实现v7中的抽屉切换。现在我使用v7来查看卡片。如果我不支持低于15的api，我应该使用v4吗？我想我需要v7用于卡片视图。材质设计的所有支持库兼容性都在v7 appcompat中实现，如果您想支持该样式，建议您更新问题，如果您不介意看一看，这实际上是一个关于样式的单独问题。我建议将该部分作为一个整体提交另一个问题（请随意添加带有链接的评论）。@mraviator-yep:更改XML，然后创建并附加v7
ActionBarDrawerToggle
。AppCompat制造商提供的产品具有丰富的功能
<style name="AppBaseTheme" parent="Theme.AppCompat.Light">
    <item name="drawerArrowStyle">@style/MyTheme.DrawerArrowToggle</item>
</style>
<style name="MyTheme.DrawerArrowToggle" parent="Widget.AppCompat.DrawerArrowToggle">
    <item name="color">@android:color/holo_purple</item>
    <!-- ^ this will make the icon purple -->
</style>

<style name="AppBaseTheme" parent="Theme.AppCompat.Light">
    <item name="actionBarTheme">@style/MyTheme.ActionBar</item>
</style>
<style name="MyTheme.ActionBar" parent="ThemeOverlay.AppCompat.ActionBar">
    <item name="android:textColorPrimary">@android:color/white</item>
    <!-- ^ this will make text and arrow white -->
    <!-- you can also override drawerArrowStyle here -->
</style>

<!--inside your custom layout with DrawerLayout
and NavigationView or whatever -->
<android.support.v7.widget.Toolbar
        ...
        app:theme="?actionBarTheme">