Android开发:Toolbar中ActionMenuView菜单项对齐异常求助
解决Toolbar菜单项对齐怪异的问题
看起来你的问题出在Toolbar内部嵌套ActionMenuView的布局配置上,我帮你分析下原因并给出修复方案:
问题根源
- 你给Toolbar内部的ActionMenuView设置了
match_parent的宽度,还加了ConstraintLayout的约束属性,但Toolbar本质是FrameLayout的子类,这些约束在Toolbar内部是无效的,会导致布局计算混乱。 - ActionMenuView默认的菜单项排列方向是从右到左(和Toolbar默认的菜单位置一致),你设置的
android:gravity并不会改变它内部菜单项的排列逻辑,所以才会出现错位。 - 当Toolbar缩小时,宽度为
match_parent的ActionMenuView会和Toolbar的布局冲突,进一步加剧错位问题。
修复方案
1. 修改activity_main.xml布局
调整ActionMenuView的布局属性,去掉无效约束,让它正确靠左对齐:
<?xml version="1.0" encoding="utf-8"?> <android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" tools:context=".MainActivity"> <android.support.v7.widget.Toolbar android:id="@+id/toolbar" android:layout_width="match_parent" android:layout_height="?attr/actionBarSize" android:theme="@style/ActionBar" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toTopOf="parent"> <android.support.v7.widget.ActionMenuView android:id="@+id/toolbarLeft" android:layout_width="wrap_content" android:layout_height="match_parent" android:layout_gravity="start|center_vertical" app:menuGravity="start" /> </android.support.v7.widget.Toolbar> </android.support.constraint.ConstraintLayout>
关键修改点:
android:layout_width="wrap_content":让ActionMenuView只包裹自身菜单项的宽度,避免和Toolbar布局冲突。android:layout_gravity="start|center_vertical":让ActionMenuView本身在Toolbar内靠左垂直居中。app:menuGravity="start":ActionMenuView的专属属性,强制内部菜单项从左到右排列,覆盖默认的从右到左逻辑。
2. 可选:添加菜单项点击事件
如果需要处理菜单项的点击,你可以在onCreateOptionsMenu里给ActionMenuView设置点击监听:
@Override public boolean onCreateOptionsMenu(Menu menu) { Toolbar toolbar = findViewById(R.id.toolbar); ActionMenuView toolbarLeft = toolbar.findViewById(R.id.toolbarLeft); getMenuInflater().inflate(R.menu.menu_main_left, toolbarLeft.getMenu()); // 处理菜单项点击 toolbarLeft.setOnMenuItemClickListener(item -> { switch (item.getItemId()) { case R.id.actionAdd: // 执行Add操作 return true; case R.id.actionDetails: // 执行Details操作 return true; case R.id.actionLegend: // 执行Legend操作 return true; case R.id.actionSettings: // 执行Settings操作 return true; default: return false; } }); return true; }
额外说明
- 你的
menu_main_left.xml里app:showAsAction="always"的设置没问题,但如果Toolbar宽度过小,部分菜单项还是会进入溢出菜单,这是Android的默认行为,你可以根据需求改成ifRoom来优化。 styles.xml里的主题配置不需要修改,保持即可。
这样修改后,菜单项就能保持正确的垂直居中且靠左对齐的布局,无论Toolbar尺寸如何变化都不会出现怪异的错位了。
内容的提问来源于stack exchange,提问作者Dmitry
相关产品推荐
相关产品推荐

