如何使用 Appcompat v7 21、Toolbar 和 DrawerLayout 将 Burger 动画化为箭头
Posted
技术标签:
【中文标题】如何使用 Appcompat v7 21、Toolbar 和 DrawerLayout 将 Burger 动画化为箭头【英文标题】:How animate Burger to Arrow with Appcompat v7 21, Toolbar and DrawerLayout 【发布时间】:2014-12-15 14:40:41 【问题描述】:我正在使用带有 android.support.v4.widget.DrawerLayout 的 android.support.v7.widget.Toolbar。它工作正常,导航抽屉关闭时显示汉堡图标,抽屉打开时显示箭头图标。 我想在应用程序中的某些事件上禁用抽屉并将汉堡图标设置为箭头。我尝试将锁定模式设置为关闭,但 v7.app.ActionBarDrawerToggle 仍然显示 Burger 并打开 Drawer。
mDrawerLayout.setDrawerLockMode(DrawerLayout.LOCK_MODE_LOCKED_CLOSED);
有什么想法吗? 谢谢!
更新:
不,我可以更改图标的状态,并且可以启用/禁用抽屉,但动画不适用于这种方法:
@Override
protected void onCreate(Bundle savedInstanceState)
...
Toolbar toolbar = (Toolbar) findViewById(R.id.application_toolbar);
setSupportActionBar(toolbar);
mDrawerLayout = (DrawerLayout) findViewById(R.id.drawerLayout);
mDrawerToggle = new ActionBarDrawerToggle(this, mDrawerLayout, R.string.string1, R.string.string2)
public void onDrawerClosed(View view)
super.onDrawerClosed(view);
public void onDrawerOpened(View drawerView)
super.onDrawerOpened(drawerView);
;
//mDrawerLayout.setDrawerListener(mDrawerToggle); // not needed
...
@Override
public boolean onOptionsItemSelected(MenuItem item)
switch (item.getItemId())
case android.R.id.home:
if (mDrawerLayout.getDrawerLockMode(GravityCompat.START) == LOCK_MODE_UNLOCKED)
showDrawer();
else
handleBackButtonPress(); // On this stage the home button is a <-
...
private void setDrawerState(boolean isEnabled)
if (isEnabled)
mDrawerLayout.setDrawerLockMode(DrawerLayout.LOCK_MODE_UNLOCKED);
mDrawerToggle.onDrawerStateChanged(DrawerLayout.LOCK_MODE_UNLOCKED);
mDrawerToggle.syncState();
else
mDrawerLayout.setDrawerLockMode(DrawerLayout.LOCK_MODE_LOCKED_CLOSED);
mDrawerToggle.onDrawerStateChanged(DrawerLayout.LOCK_MODE_LOCKED_CLOSED);
mDrawerToggle.syncState();
抽屉位于工具栏的顶部。
【问题讨论】:
【参考方案1】:看看这里,它描述了你如何解决它。
https://***.com/a/26447144
主要部分如下:
<style name="AppTheme" parent="Theme.AppCompat.Light">
<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>
【讨论】:
谢谢,但我认为您误解了我的问题。我想完全禁用导航抽屉(在运行时)并显示箭头图标而不是汉堡。 我有同样的问题知道吗?【参考方案2】:我创建了一个具有类似功能的小应用程序
主活动
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();
我的那个 Activity 的 XML
<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_
android:layout_
tools:context=".MyActivity"
android:id="@+id/drawer"
>
<!-- The main content view -->
<FrameLayout
android:id="@+id/content_frame"
android:layout_
android:layout_ >
<include layout="@layout/toolbar_custom"/>
</FrameLayout>
<!-- The navigation drawer -->
<ListView
android:layout_marginTop="?attr/actionBarSize"
android:id="@+id/left_drawer"
android:layout_
android:layout_
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_
android:layout_
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_
android:layout_
/>
</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>
价值观中的我的风格-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>
【讨论】:
啊,我爱你。我努力获得该死的箭头动画。但是,看到我发现我的代码缺少这一行:drawerLayout.setDrawerListener(actionBarDrawerToggle);现在它就像一个魅力! 是否需要从ActionBarActivity扩展?以上是关于如何使用 Appcompat v7 21、Toolbar 和 DrawerLayout 将 Burger 动画化为箭头的主要内容,如果未能解决你的问题,请参考以下文章
缺少来自android appcompat v7-21.0.0的样式
使用Tab与新ToolBar(AppCompat v7-21)
使用带有新工具栏的选项卡 (AppCompat v7-21)
AppCompat v7 r21 在 values.xml 中返回错误?
如何更改工具栏导航和溢出菜单图标(appcompat v7)?
在 AppCompat 21 中使用 Light.DarkActionBar 主题更改 ActionBar 标题文本颜色