如何将所有操作项放在左侧，尽可能多 space ，但右侧溢出？
How to put all action items on the left, taking as much space as possible, and yet have overflow on the right?
背景
假设我有一个工具栏和多个操作项。有些可能是自定义的（例如：带有图像的 TextView）。
我需要做的是将它们全部向左对齐，而不是向右对齐，但溢出项仍然在右侧。
我也尽量space行动项目。
问题
None 我发现的作品
我试过的
1.For 对齐方式，我在 Whosebug 上找到了一些解决方案，可以在工具栏内添加视图，但是由于某些原因这不会很好地工作，因为按下一个项目没有显示效果在整个项目上（好像它的高度更小）。
我为此尝试的其他事情：
android:layoutDirection="ltr" - 不对操作项做任何事情android:gravity="left|start" - 相同
2.For space 问题，none 我试过的方法有效。我试图删除所有可能增加边距或填充的东西。
这是一个示例代码，展示了我如何测试这两个问题：
activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
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="com.example.user.myapplication.MainActivity">
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar" android:layout_width="match_parent" android:layout_height="?attr/actionBarSize"
android:layoutDirection="ltr" android:padding="0px" android:theme="@style/ThemeOverlay.AppCompat.ActionBar"
app:contentInsetEnd="0px" app:contentInsetEndWithActions="0px" app:contentInsetLeft="0px"
app:contentInsetRight="0px" app:contentInsetStart="0px" app:contentInsetStartWithNavigation="0px"
app:logo="@null" app:title="@null" app:titleMargin="0px" app:titleTextColor="#757575"
tools:ignore="UnusedAttribute" tools:title="toolbar"/>
</FrameLayout>
MainActivity.java
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Toolbar mainToolbar = findViewById(R.id.toolbar);
for (int i = 0; i < 10; ++i) {
final View menuItemView = LayoutInflater.from(this).inflate(R.layout.action_item, mainToolbar, false);
ImageView imageView = (ImageView) menuItemView.findViewById(android.R.id.icon);
String text = "item" + i;
final int itemIconResId = R.drawable.ic_launcher_background;
imageView.setImageResource(itemIconResId);
((TextView) menuItemView.findViewById(android.R.id.text1)).setText(text);
final OnClickListener onClickListener = new OnClickListener() {
@Override
public void onClick(final View view) {
//do something on click
}
};
menuItemView.setOnClickListener(onClickListener);
final MenuItem menuItem = mainToolbar.getMenu()
.add(text).setActionView(menuItemView).setIcon(itemIconResId)
.setOnMenuItemClickListener(new OnMenuItemClickListener() {
@SuppressLint("MissingPermission")
@Override
public boolean onMenuItemClick(final MenuItem menuItem) {
onClickListener.onClick(menuItemView);
return true;
}
});
MenuItemCompat.setShowAsAction(menuItem, MenuItem.SHOW_AS_ACTION_IF_ROOM);
}
}
}
action_item.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools"
android:layout_width="wrap_content" android:layout_height="match_parent"
android:background="?android:attr/selectableItemBackground" android:clickable="true" android:focusable="true"
android:focusableInTouchMode="false" android:gravity="center" android:orientation="horizontal">
<ImageView
android:id="@android:id/icon" android:layout_width="wrap_content" android:layout_height="wrap_content"
android:scaleType="center" tools:src="@android:drawable/sym_def_app_icon"/>
<TextView
android:id="@android:id/text1" android:layout_width="wrap_content" android:layout_height="wrap_content"
android:layout_marginLeft="6dp" android:layout_marginStart="6dp" android:gravity="center"
android:textColor="#c2555555" android:textSize="15sp" tools:text="text"/>
</LinearLayout>
这是我得到的：
问题
如何支持最大 space 工具栏的使用，并使操作项左对齐？
编辑：经过一些工作，我得到了部分工作的对齐解决方案：
activity_main.xml
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent" android:layout_height="wrap_content"
android:theme="@style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar" android:layout_width="match_parent" android:layout_height="?attr/actionBarSize"
android:background="#fff" android:gravity="center_vertical|start"
android:layoutDirection="ltr" android:padding="0px" android:theme="@style/ThemeOverlay.AppCompat.ActionBar"
app:contentInsetEnd="0px" app:contentInsetEndWithActions="0px" app:contentInsetLeft="0px"
app:contentInsetRight="0px" app:contentInsetStart="0px" app:contentInsetStartWithNavigation="0px"
app:logo="@null" app:title="@null" app:titleMargin="0px" app:titleTextColor="#757575"
tools:ignore="UnusedAttribute" tools:title="toolbar">
<android.support.v7.widget.ActionMenuView
android:id="@+id/amvMenu" android:layout_width="match_parent" android:layout_height="match_parent"/>
</android.support.v7.widget.Toolbar>
</android.support.design.widget.AppBarLayout>
在代码中，唯一的区别是我使用的是ActionMenuView的菜单，而不是Toolbar:
final ActionMenuView amvMenu = (ActionMenuView) toolbar.findViewById(R.id.amvMenu);
final Menu menu =amvMenu.getMenu();
...
final MenuItem menuItem = menu.add...
确实将溢出项目放在最右边，而操作项目放在左边。
但是，按下的效果不包括项目的整个高度，而且项目似乎比平时多 space。另外，我仍然没有弄清楚如何使用这里所有可能的 space：
编辑：
为了解决按压效果的问题，我所要做的就是将 android:minHeight="?attr/actionBarSize" 添加到循环中膨胀的项目中。
按压效果仍然奇怪的是，如果我添加一个普通的动作项（只是 text/icon，没有膨胀），它会产生微小的连锁反应，而动作项本身会占用很多 space 与我添加的相比。
这导致的另一个新问题是，点击溢出菜单附近的任何地方都会触发点击。
编辑：
此解决方案的另一个问题是，在某些情况下项目之间存在 spaces，例如在只有少数项目的情况下：
所以，简而言之，这个解决方案根本行不通。
所以如果我理解正确的话，你想在工具栏中添加一些动作。这些操作应该从左边开始，并占用所有可用的 space。
您是否愿意使用自定义视图（ImageView 等）代替 MenuItem 进行操作？
将水平 LinearLayout 添加到您的工具栏。并为所有children（动作）设置相同的权重。
<Toolbar>
<LinearLayout horizontal>
<ImageView layout_width="0dp" layout_weight="1" />
<ImageView layout_width="0dp" layout_weight="1" />
<ImageView layout_width="0dp" layout_weight="1" />
</LinearLayout>
</Toolbar>
您现在可以附加菜单以获得垂直 3 点操作。或者您可以在水平布局的末尾添加另一个固定宽度的 ImageView。
编辑：
这是我很快想到的解决方案。您当然需要稍微改进代码。该解决方案使用自定义 LinearLayout，它测量每个 child 并决定是否需要溢出菜单。它将再次重新测量每个 child 以给所有人相等的 space。
它使用 PopupWindow 显示菜单，使用简单的 OnClickListener 和回调来检查单击了哪个菜单项。
灵活菜单容器
public class FlexibleMenuContainer extends LinearLayout {
private List<FlexibleMenu.MenuItem> items;
private List<FlexibleMenu.MenuItem> drawableItems;
private List<FlexibleMenu.MenuItem> overflowItems;
private List<FlexibleMenu.MenuItem> overflowItemsTempContainer;
private ImageView overflow;
private int overflowViewSize;
private boolean isOverflowing;
public FlexibleMenuContainer(Context context) {
this(context, null);
}
public FlexibleMenuContainer(Context context, @Nullable AttributeSet attrs) {
this(context, attrs, 0);
}
public FlexibleMenuContainer(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
init(context, attrs);
}
private void init(Context context, @Nullable AttributeSet attrs) {
setOrientation(HORIZONTAL);
items = new ArrayList<>();
overflowItems = new ArrayList<>();
drawableItems = new ArrayList<>();
overflowItemsTempContainer = new ArrayList<>();
overflowViewSize = getResources().getDimensionPixelOffset(R.dimen.menu_more_size);
overflow = new ImageView(context);
overflow.setImageResource(R.drawable.ic_more_vert_white_24dp);
overflow.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
showOverflowMenu();
}
});
// overflow.setVisibility(GONE);
LinearLayout.LayoutParams params = new LayoutParams(overflowViewSize, overflowViewSize);
params.gravity = Gravity.CENTER_VERTICAL;
addView(overflow, params);
}
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
int widthRequired = 0;
isOverflowing = false;
overflowItems.clear();
drawableItems.clear();
if (items.size() == 0) {
return;
}
int availableWidth = MeasureSpec.getSize(widthMeasureSpec) - overflowViewSize;
for (int i=0; i<items.size(); i++) {
View child = items.get(i).getView();
measureChild(child, widthMeasureSpec, heightMeasureSpec);
widthRequired += child.getMeasuredWidth();
if (widthRequired > availableWidth) {
isOverflowing = true;
overflowItems.add(items.get(i));
} else {
drawableItems.add(items.get(i));
}
}
int drawableWidth = MeasureSpec.getSize(widthMeasureSpec) - (isOverflowing ? overflowViewSize : 0);
int childWidthMeasureSpec = MeasureSpec.makeMeasureSpec(drawableWidth/drawableItems.size(), MeasureSpec.EXACTLY);
for (int i=0; i<drawableItems.size(); i++) {
View child = drawableItems.get(i).getView();
child.measure(childWidthMeasureSpec, heightMeasureSpec);
}
}
@Override
protected void onLayout(boolean changed, int l, int t, int r, int b) {
int left = 0;
for (int i=0; i<drawableItems.size(); i++) {
View child = drawableItems.get(i).getView();
int height = Math.min(child.getMeasuredHeight(), b - t);
int top = (b - t - height)/2;
child.layout(left, top, left + child.getMeasuredWidth(), top + height);
left += child.getMeasuredWidth();
}
if (isOverflowing) {
overflow.layout(getMeasuredWidth() - overflowViewSize, t, getMeasuredWidth(), b);
}
// After opening the menu and dismissing it, the views are still laid out
for (int i=0; i<overflowItems.size(); i++) {
View child = overflowItems.get(i).getView();
if (child.getParent() == this) {
child.layout(0, 0, 0, 0);
}
}
}
public void addItem(FlexibleMenu.MenuItem item) {
items.add(item);
_addView(item.getView());
}
private void _addView(View view) {
LinearLayout.LayoutParams params = new LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT);
params.gravity = Gravity.CENTER_VERTICAL;
addView(view, getChildCount() - 1, params);
}
private void showOverflowMenu() {
if (overflowItems.size() == 0) {
return;
}
final ViewGroup contentView = prepareContentViewForPopup();
final PopupWindow popup = new PopupWindow(contentView, 400, 300, true);
popup.setOutsideTouchable(false);
popup.setFocusable(true);
popup.showAsDropDown(overflow);
popup.setOnDismissListener(new PopupWindow.OnDismissListener() {
@Override
public void onDismiss() {
contentView.removeAllViews();
for (int i=0; i<overflowItemsTempContainer.size(); i++) {
View view = overflowItemsTempContainer.get(i).getView();
_addView(view);
}
overflowItemsTempContainer.clear();
}
});
}
private ViewGroup prepareContentViewForPopup() {
overflowItemsTempContainer.clear();
LinearLayout layout = new LinearLayout(getContext());
layout.setBackgroundColor(ContextCompat.getColor(getContext(), R.color.colorAccent));
layout.setOrientation(VERTICAL);
for (int i=0; i<overflowItems.size(); i++) {
overflowItemsTempContainer.add(overflowItems.get(i));
View view = overflowItems.get(i).getView();
removeView(view);
layout.addView(view);
}
return layout;
}
}
灵活菜单
public class FlexibleMenu {
private final List<MenuItem> items;
private final MenuCallback callback;
public FlexibleMenu(List<MenuItem> items, MenuCallback callback) {
this.items = items;
this.callback = callback;
}
public void inflate(FlexibleMenuContainer container) {
for (int i=0; i<items.size(); i++) {
final MenuItem item = items.get(i);
container.addItem(item);
item.getView().setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
callback.onItemClicked(item);
}
});
}
}
public interface MenuCallback {
void onItemClicked(MenuItem item);
}
public static class MenuItem {
private final int id;
private final View view;
public MenuItem(int id, View view) {
this.id = id;
this.view = view;
}
public View getView() {
return view;
}
public int getId() {
return id;
}
}
}
布局
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
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"
android:orientation="vertical"
tools:context="com.fenchtose.flexiblemenu.MainActivity">
<android.support.v7.widget.Toolbar
android:layout_width="match_parent"
android:layout_height="56dp"
android:paddingStart="0dp"
android:background="@color/colorPrimary">
<com.fenchtose.flexiblemenu.FlexibleMenuContainer
android:id="@+id/menu_container"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</android.support.v7.widget.Toolbar>
<android.support.v7.widget.Toolbar
android:layout_width="match_parent"
android:layout_height="56dp"
android:paddingStart="0dp"
android:background="@color/colorPrimary">
<com.fenchtose.flexiblemenu.FlexibleMenuContainer
android:id="@+id/menu_container1"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</android.support.v7.widget.Toolbar>
<android.support.v7.widget.Toolbar
android:layout_width="match_parent"
android:layout_height="56dp"
android:paddingStart="0dp"
android:background="@color/colorPrimary">
<com.fenchtose.flexiblemenu.FlexibleMenuContainer
android:id="@+id/menu_container2"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</android.support.v7.widget.Toolbar>
</LinearLayout>
MainActivity
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
setupMenu(R.id.menu_container, 6);
setupMenu(R.id.menu_container1, 2);
setupMenu(R.id.menu_container2, 4);
}
private void setupMenu(int id, int size) {
FlexibleMenuContainer container = (FlexibleMenuContainer) findViewById(id);
FlexibleMenu menu = new FlexibleMenu(populate(size), new FlexibleMenu.MenuCallback() {
@Override
public void onItemClicked(FlexibleMenu.MenuItem item) {
Toast.makeText(MainActivity.this, "menu selected: " + item.getId(), Toast.LENGTH_SHORT).show();
}
});
menu.inflate(container);
}
private List<FlexibleMenu.MenuItem> populate(int size) {
List<FlexibleMenu.MenuItem> items = new ArrayList<>();
for (int i=0; i<size; i++) {
View view = createView("Menu Item " + (i + 1));
items.add(new FlexibleMenu.MenuItem(i, view));
}
return items;
}
private TextView createView(String text) {
TextView view = new TextView(this);
view.setText(text);
view.setGravity(Gravity.CENTER);
view.setTextColor(0xffffffff);
return view;
}
}
这是一个将菜单项左对齐同时将溢出菜单图标保持在右侧的解决方案。此解决方案使用 toolbar/action 栏的标准实现，但预计将如何布置操作视图，以便它们将按照我们希望的方式在工具栏中定位。
下面的大部分代码都是您提供的。我已将创建菜单项的 for 循环移动到 onCreateOptionsMenu() 中，这样我就可以利用已经是工具栏菜单结构一部分的 ActionMenuView 而不是添加另一个。
在 onCreateOptionsMenu() 中，随着菜单项被放置到菜单中，菜单项消耗的 space 的 运行 计数得到维护。只要有 space，菜单项就会被标记为 "shown" (MenuItem.SHOW_AS_ACTION_ALWAYS)。如果该项目将侵占为溢出菜单图标保留的区域，则该项目被放置但针对溢出菜单 (MenuItem.SHOW_AS_ACTION_NEVER)。
将所有视图放入菜单后，计算松弛度 space。这是屏幕上最后一个可见菜单项和溢出图标之间的区域（如果使用溢出）或最后一个可见项目和工具栏末尾之间（如果未使用溢出）。
一旦计算出松弛 space，就会创建一个 Space 小部件并将其放入菜单中。此小部件强制所有其他项目左对齐。
大部分更改已对 MainActivity.java 进行，但我可能在 XML 文件中更改了一两处。为了完整起见，我将它们包括在这里。
下面是一些结果的屏幕截图。
MainActivity.java
public class MainActivity extends AppCompatActivity {
private Toolbar mToolbar;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
mToolbar = findViewById(R.id.toolbar);
mToolbar.setTitle("");
setSupportActionBar(mToolbar); // Ensures that onCreateOptionsMenu is called
}
@Override
public boolean onCreateOptionsMenu(Menu menu) {
final float density = getResources().getDisplayMetrics().density;
final int overflowCellSize = (int) (OVERFLOW_CELL_WIDTH * density);
// Other than the overflow icon, this is how much real estate we have to fill.
int widthLeftToFill = mToolbar.getWidth() - overflowCellSize;
// slackWidth is what is left over after we are done adding our action views.
int slackWidth = -1;
for (int i = 0; i < 10; ++i) {
final View menuItemView =
LayoutInflater.from(this).inflate(R.layout.action_item, mToolbar, false);
ImageView imageView = menuItemView.findViewById(android.R.id.icon);
final int itemIconResId = R.drawable.ic_launcher_background;
imageView.setImageResource(itemIconResId);
final String text = "item" + i;
((TextView) menuItemView.findViewById(android.R.id.text1)).setText(text);
final View.OnClickListener onClickListener = new View.OnClickListener() {
@Override
public void onClick(final View view) {
Toast.makeText(MainActivity.this, text,
Toast.LENGTH_SHORT).show();
}
};
menuItemView.setOnClickListener(onClickListener);
final MenuItem menuItem = menu
.add(text).setActionView(menuItemView).setIcon(itemIconResId)
.setOnMenuItemClickListener(new MenuItem.OnMenuItemClickListener() {
@SuppressLint("MissingPermission")
@Override
public boolean onMenuItemClick(final MenuItem menuItem) {
onClickListener.onClick(menuItemView);
return true;
}
});
// How wide is this ActionView?
menuItemView.measure(View.MeasureSpec.UNSPECIFIED, View.MeasureSpec.UNSPECIFIED);
widthLeftToFill -= menuItemView.getMeasuredWidth();
if (widthLeftToFill >= 0) {
// The item will fit on the screen.
menuItem.setShowAsAction(MenuItem.SHOW_AS_ACTION_ALWAYS);
} else {
// The item will not fit. Force it to overflow.
menuItem.setShowAsAction(MenuItem.SHOW_AS_ACTION_NEVER);
if (slackWidth < 0) {
// Just crossed over the limit of space to fill - capture the slack space.
slackWidth = widthLeftToFill + menuItemView.getMeasuredWidth();
}
}
}
if (slackWidth < 0) {
// Didn't have enough action views to fill the width.
slackWidth = widthLeftToFill + overflowCellSize;
}
if (slackWidth > 0) {
// Create a space widget to consume the slack. This slack space widget makes sure
// that the action views are left-justified with the overflow on the right.
// As an alternative, this space could also be distributed among the action views.
Space space = new Space(this);
space.setMinimumWidth(slackWidth);
final MenuItem menuItem = menu.add("").setActionView(space);
menuItem.setShowAsAction(MenuItem.SHOW_AS_ACTION_ALWAYS);
}
return true;
}
private static final int OVERFLOW_CELL_WIDTH = 40; // dips
}
activity_main.xml
<FrameLayout 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:layoutDirection="ltr"
android:padding="0px"
android:theme="@style/ThemeOverlay.AppCompat.ActionBar"
app:contentInsetEnd="0px"
app:contentInsetEndWithActions="0px"
app:contentInsetLeft="0px"
app:contentInsetRight="0px"
app:contentInsetStart="0px"
app:contentInsetStartWithNavigation="0px"
app:logo="@null"
app:title="@null"
app:titleMargin="0px"
app:titleTextColor="#757575"
tools:ignore="UnusedAttribute"
tools:title="toolbar">
</android.support.v7.widget.Toolbar>
</FrameLayout>
action_item.xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:background="?android:attr/selectableItemBackground"
android:clickable="true"
android:focusable="true"
android:focusableInTouchMode="false"
android:gravity="center"
android:orientation="horizontal"
android:paddingLeft="8dp">
<ImageView
android:id="@android:id/icon"
android:layout_width="wrap_content"
android:layout_height="?attr/actionBarSize"
android:scaleType="center"
tools:src="@android:drawable/sym_def_app_icon" />
<TextView
android:id="@android:id/text1"
android:layout_width="wrap_content"
android:layout_height="?attr/actionBarSize"
android:layout_marginLeft="6dp"
android:layout_marginStart="6dp"
android:gravity="center"
android:textColor="#c2555555"
android:textSize="15sp"
tools:text="text" />
</LinearLayout>
更新：要在不将其设置为操作栏的情况下使用工具栏，请添加全局布局侦听器以等待工具栏设置。
MainActivity.java - 使用全局布局侦听器而不是操作栏
public class MainActivity extends AppCompatActivity {
private Toolbar mToolbar;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
mToolbar = findViewById(R.id.toolbar);
mToolbar.setTitle("");
// setSupportActionBar(mToolbar); // Ensures that onCreateOptionsMenu is called
mToolbar.getViewTreeObserver().addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {
@Override
public void onGlobalLayout() {
mToolbar.getViewTreeObserver().removeOnGlobalLayoutListener(this);
setupMenu(mToolbar.getMenu());
}
});
}
public boolean setupMenu(Menu menu) {
final float density = getResources().getDisplayMetrics().density;
int mOverflowCellSize = (int) (OVERFLOW_CELL_WIDTH * density);
// Other than the overflow icon, this is how much real estate we have to fill.
int widthLeftToFill = mToolbar.getWidth() - mOverflowCellSize;
// slackWidth is what is left over after we are done adding our action views.
int slackWidth = -1;
for (int i = 0; i < 10; ++i) {
final View menuItemView =
LayoutInflater.from(this).inflate(R.layout.action_item, mToolbar, false);
ImageView imageView = menuItemView.findViewById(android.R.id.icon);
final int itemIconResId = R.drawable.ic_launcher_background;
imageView.setImageResource(itemIconResId);
String text = "item" + i;
((TextView) menuItemView.findViewById(android.R.id.text1)).setText(text);
final View.OnClickListener onClickListener = new View.OnClickListener() {
@Override
public void onClick(final View view) {
Toast.makeText(MainActivity.this, text ,
Toast.LENGTH_SHORT).show();
}
};
menuItemView.setOnClickListener(onClickListener);
final MenuItem menuItem = menu
.add(text).setActionView(menuItemView).setIcon(itemIconResId)
.setOnMenuItemClickListener(new MenuItem.OnMenuItemClickListener() {
@SuppressLint("MissingPermission")
@Override
public boolean onMenuItemClick(final MenuItem menuItem) {
onClickListener.onClick(menuItemView);
return true;
}
});
// How wide is this ActionView?
menuItemView.measure(View.MeasureSpec.UNSPECIFIED, View.MeasureSpec.UNSPECIFIED);
widthLeftToFill -= menuItemView.getMeasuredWidth();
if (widthLeftToFill >= 0) {
// The item will fit on the screen.
menuItem.setShowAsAction(MenuItem.SHOW_AS_ACTION_ALWAYS);
} else {
// The item will not fit. Force it to overflow.
menuItem.setShowAsAction(MenuItem.SHOW_AS_ACTION_NEVER);
if (slackWidth < 0) {
// Just crossed over the limit of space to fill - capture the slack space.
slackWidth = widthLeftToFill + menuItemView.getMeasuredWidth();
}
}
}
if (slackWidth < 0) {
// Didn't have enough action views to fill the width.
slackWidth = widthLeftToFill + mOverflowCellSize;
}
if (slackWidth > 0) {
// Create a space widget to consume the slack. This slack space widget makes sure
// that the action views are left-justified with the overflow on the right.
// As an alternative, this space could also be distributed among the action views.
Space space = new Space(this);
space.setMinimumWidth(slackWidth);
final MenuItem menuItem = menu.add("").setActionView(space);
menuItem.setShowAsAction(MenuItem.SHOW_AS_ACTION_ALWAYS);
}
return true;
}
private static final int OVERFLOW_CELL_WIDTH = 40; // dips
}
以下示例应用通过引入方法 notifyMenuItemsChanged 将菜单创建与菜单的左对齐分开。在应用程序中，单击按钮以删除位置 1 的菜单项。
此代码与上面的代码基本相同，但是 Space 小部件需要一个 id，以便在菜单更改时可以将其删除以重新添加。
MainActivity.Java: 示例应用
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
final Toolbar toolbar = findViewById(R.id.toolbar);
toolbar.setTitle("");
findViewById(R.id.button).setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
Menu menu = toolbar.getMenu();
// Remove item at position 1 on click of button.
if (menu.size() > 1) {
menu.removeItem(menu.getItem(1).getItemId());
notifyMenuItemsChanged(toolbar);
}
}
});
toolbar.getViewTreeObserver().addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {
@Override
public void onGlobalLayout() {
toolbar.getViewTreeObserver().removeOnGlobalLayoutListener(this);
setupMenu(toolbar);
}
});
}
private void setupMenu(Toolbar toolbar) {
Menu menu = toolbar.getMenu();
// Since we are resetting the menu, get rid of what may have been placed there before.
menu.clear();
for (int i = 0; i < 10; ++i) {
final View menuItemView =
LayoutInflater.from(this).inflate(R.layout.action_item, toolbar, false);
ImageView imageView = menuItemView.findViewById(android.R.id.icon);
final int itemIconResId = R.drawable.ic_launcher_background;
imageView.setImageResource(itemIconResId);
String text = "item" + i;
((TextView) menuItemView.findViewById(android.R.id.text1)).setText(text);
final View.OnClickListener onClickListener = new View.OnClickListener() {
@Override
public void onClick(final View view) {
Toast.makeText(MainActivity.this, text ,
Toast.LENGTH_SHORT).show();
}
};
menuItemView.setOnClickListener(onClickListener);
menu.add(Menu.NONE, View.generateViewId(), Menu.NONE, text)
.setActionView(menuItemView)
.setIcon(itemIconResId)
.setOnMenuItemClickListener(new MenuItem.OnMenuItemClickListener() {
@SuppressLint("MissingPermission")
@Override
public boolean onMenuItemClick(final MenuItem menuItem) {
onClickListener.onClick(menuItemView);
return true;
}
});
}
// Now take the menu and left-justify it.
notifyMenuItemsChanged(toolbar);
}
/**
* Call this routine whenever the Toolbar menu changes. Take all action views and
* left-justify those that fit on the screen. Force to overflow those that don't.
*
* @param toolbar The Toolbar that holds the menu.
*/
private void notifyMenuItemsChanged(Toolbar toolbar) {
final int OVERFLOW_CELL_WIDTH = 40; // dips
final Menu menu = toolbar.getMenu();
final float density = getResources().getDisplayMetrics().density;
final int mOverflowCellSize = (int) (OVERFLOW_CELL_WIDTH * density);
// Other than the overflow icon, this is how much real estate we have to fill.
int widthLeftToFill = toolbar.getWidth() - mOverflowCellSize;
// slackWidth is what is left over after we are done adding our action views.
int slackWidth = -1;
MenuItem menuItem;
// Index of the spacer that will be removed/replaced.
int spaceIndex = View.NO_ID;
if (menu.size() == 0) {
return;
}
// Examine each MenuItemView to determine if it will fit on the screen. If it can,
// set its MenuItem to always show; otherwise, set the MenuItem to never show.
for (int i = 0; i < menu.size(); i++) {
menuItem = menu.getItem(i);
View menuItemView = menuItem.getActionView();
if (menuItemView instanceof Space) {
spaceIndex = menuItem.getItemId();
continue;
}
if (!menuItem.isVisible()) {
continue;
}
// How wide is this ActionView?
menuItemView.measure(View.MeasureSpec.UNSPECIFIED, View.MeasureSpec.UNSPECIFIED);
widthLeftToFill -= menuItemView.getMeasuredWidth();
if (widthLeftToFill >= 0) {
// The item will fit on the screen.
menuItem.setShowAsAction(MenuItem.SHOW_AS_ACTION_ALWAYS);
} else {
// The item will not fit. Force it to overflow.
menuItem.setShowAsAction(MenuItem.SHOW_AS_ACTION_NEVER);
if (slackWidth < 0) {
// Just crossed over the limit of space to fill - capture the slack space.
slackWidth = widthLeftToFill + menuItemView.getMeasuredWidth();
}
}
}
if (spaceIndex != View.NO_ID) {
// Assume that this is our spacer. It may need to change size, so eliminate it for now.
menu.removeItem(spaceIndex);
}
if (slackWidth < 0) {
// Didn't have enough action views to fill the width, so there is no overflow.
slackWidth = widthLeftToFill + mOverflowCellSize;
}
if (slackWidth > 0) {
// Create a space widget to consume the slack. This slack space widget makes sure
// that the action views are left-justified with the overflow on the right.
// As an alternative, this space could also be distributed among the action views.
Space space = new Space(this);
space.setMinimumWidth(slackWidth);
// Need an if for the spacer so it can be deleted later if the menu is modified.
// Need API 17+ for generateViewId().
menuItem = menu.add(Menu.NONE, View.generateViewId(), Menu.NONE, "")
.setActionView(space);
menuItem.setShowAsAction(MenuItem.SHOW_AS_ACTION_ALWAYS);
}
}
}
activity_main.xml: 示例应用
<LinearLayout 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"
android:orientation="vertical"
tools:context=".MainActivity">
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="Click the button to add/remove item #1 from the menu."/>
<Button
android:id="@+id/button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="Click to modify menu" />
</LinearLayout>
背景
假设我有一个工具栏和多个操作项。有些可能是自定义的（例如：带有图像的 TextView）。
我需要做的是将它们全部向左对齐，而不是向右对齐，但溢出项仍然在右侧。
我也尽量space行动项目。
问题
None 我发现的作品
我试过的
1.For 对齐方式，我在 Whosebug 上找到了一些解决方案，可以在工具栏内添加视图，但是由于某些原因这不会很好地工作，因为按下一个项目没有显示效果在整个项目上（好像它的高度更小）。
我为此尝试的其他事情：
android:layoutDirection="ltr"- 不对操作项做任何事情android:gravity="left|start"- 相同
2.For space 问题，none 我试过的方法有效。我试图删除所有可能增加边距或填充的东西。
这是一个示例代码，展示了我如何测试这两个问题：
activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
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="com.example.user.myapplication.MainActivity">
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar" android:layout_width="match_parent" android:layout_height="?attr/actionBarSize"
android:layoutDirection="ltr" android:padding="0px" android:theme="@style/ThemeOverlay.AppCompat.ActionBar"
app:contentInsetEnd="0px" app:contentInsetEndWithActions="0px" app:contentInsetLeft="0px"
app:contentInsetRight="0px" app:contentInsetStart="0px" app:contentInsetStartWithNavigation="0px"
app:logo="@null" app:title="@null" app:titleMargin="0px" app:titleTextColor="#757575"
tools:ignore="UnusedAttribute" tools:title="toolbar"/>
</FrameLayout>
MainActivity.java
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Toolbar mainToolbar = findViewById(R.id.toolbar);
for (int i = 0; i < 10; ++i) {
final View menuItemView = LayoutInflater.from(this).inflate(R.layout.action_item, mainToolbar, false);
ImageView imageView = (ImageView) menuItemView.findViewById(android.R.id.icon);
String text = "item" + i;
final int itemIconResId = R.drawable.ic_launcher_background;
imageView.setImageResource(itemIconResId);
((TextView) menuItemView.findViewById(android.R.id.text1)).setText(text);
final OnClickListener onClickListener = new OnClickListener() {
@Override
public void onClick(final View view) {
//do something on click
}
};
menuItemView.setOnClickListener(onClickListener);
final MenuItem menuItem = mainToolbar.getMenu()
.add(text).setActionView(menuItemView).setIcon(itemIconResId)
.setOnMenuItemClickListener(new OnMenuItemClickListener() {
@SuppressLint("MissingPermission")
@Override
public boolean onMenuItemClick(final MenuItem menuItem) {
onClickListener.onClick(menuItemView);
return true;
}
});
MenuItemCompat.setShowAsAction(menuItem, MenuItem.SHOW_AS_ACTION_IF_ROOM);
}
}
}
action_item.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools"
android:layout_width="wrap_content" android:layout_height="match_parent"
android:background="?android:attr/selectableItemBackground" android:clickable="true" android:focusable="true"
android:focusableInTouchMode="false" android:gravity="center" android:orientation="horizontal">
<ImageView
android:id="@android:id/icon" android:layout_width="wrap_content" android:layout_height="wrap_content"
android:scaleType="center" tools:src="@android:drawable/sym_def_app_icon"/>
<TextView
android:id="@android:id/text1" android:layout_width="wrap_content" android:layout_height="wrap_content"
android:layout_marginLeft="6dp" android:layout_marginStart="6dp" android:gravity="center"
android:textColor="#c2555555" android:textSize="15sp" tools:text="text"/>
</LinearLayout>
这是我得到的：
问题
如何支持最大 space 工具栏的使用，并使操作项左对齐？
编辑：经过一些工作，我得到了部分工作的对齐解决方案：
activity_main.xml
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent" android:layout_height="wrap_content"
android:theme="@style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar" android:layout_width="match_parent" android:layout_height="?attr/actionBarSize"
android:background="#fff" android:gravity="center_vertical|start"
android:layoutDirection="ltr" android:padding="0px" android:theme="@style/ThemeOverlay.AppCompat.ActionBar"
app:contentInsetEnd="0px" app:contentInsetEndWithActions="0px" app:contentInsetLeft="0px"
app:contentInsetRight="0px" app:contentInsetStart="0px" app:contentInsetStartWithNavigation="0px"
app:logo="@null" app:title="@null" app:titleMargin="0px" app:titleTextColor="#757575"
tools:ignore="UnusedAttribute" tools:title="toolbar">
<android.support.v7.widget.ActionMenuView
android:id="@+id/amvMenu" android:layout_width="match_parent" android:layout_height="match_parent"/>
</android.support.v7.widget.Toolbar>
</android.support.design.widget.AppBarLayout>
在代码中，唯一的区别是我使用的是ActionMenuView的菜单，而不是Toolbar:
final ActionMenuView amvMenu = (ActionMenuView) toolbar.findViewById(R.id.amvMenu);
final Menu menu =amvMenu.getMenu();
...
final MenuItem menuItem = menu.add...
确实将溢出项目放在最右边，而操作项目放在左边。
但是，按下的效果不包括项目的整个高度，而且项目似乎比平时多 space。另外，我仍然没有弄清楚如何使用这里所有可能的 space：
编辑：
为了解决按压效果的问题，我所要做的就是将 android:minHeight="?attr/actionBarSize" 添加到循环中膨胀的项目中。
按压效果仍然奇怪的是，如果我添加一个普通的动作项（只是 text/icon，没有膨胀），它会产生微小的连锁反应，而动作项本身会占用很多 space 与我添加的相比。
这导致的另一个新问题是，点击溢出菜单附近的任何地方都会触发点击。
编辑：
此解决方案的另一个问题是，在某些情况下项目之间存在 spaces，例如在只有少数项目的情况下：
所以，简而言之，这个解决方案根本行不通。
所以如果我理解正确的话，你想在工具栏中添加一些动作。这些操作应该从左边开始，并占用所有可用的 space。
您是否愿意使用自定义视图（ImageView 等）代替 MenuItem 进行操作？
将水平 LinearLayout 添加到您的工具栏。并为所有children（动作）设置相同的权重。
<Toolbar>
<LinearLayout horizontal>
<ImageView layout_width="0dp" layout_weight="1" />
<ImageView layout_width="0dp" layout_weight="1" />
<ImageView layout_width="0dp" layout_weight="1" />
</LinearLayout>
</Toolbar>
您现在可以附加菜单以获得垂直 3 点操作。或者您可以在水平布局的末尾添加另一个固定宽度的 ImageView。
编辑：
这是我很快想到的解决方案。您当然需要稍微改进代码。该解决方案使用自定义 LinearLayout，它测量每个 child 并决定是否需要溢出菜单。它将再次重新测量每个 child 以给所有人相等的 space。
它使用 PopupWindow 显示菜单，使用简单的 OnClickListener 和回调来检查单击了哪个菜单项。
灵活菜单容器
public class FlexibleMenuContainer extends LinearLayout {
private List<FlexibleMenu.MenuItem> items;
private List<FlexibleMenu.MenuItem> drawableItems;
private List<FlexibleMenu.MenuItem> overflowItems;
private List<FlexibleMenu.MenuItem> overflowItemsTempContainer;
private ImageView overflow;
private int overflowViewSize;
private boolean isOverflowing;
public FlexibleMenuContainer(Context context) {
this(context, null);
}
public FlexibleMenuContainer(Context context, @Nullable AttributeSet attrs) {
this(context, attrs, 0);
}
public FlexibleMenuContainer(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
init(context, attrs);
}
private void init(Context context, @Nullable AttributeSet attrs) {
setOrientation(HORIZONTAL);
items = new ArrayList<>();
overflowItems = new ArrayList<>();
drawableItems = new ArrayList<>();
overflowItemsTempContainer = new ArrayList<>();
overflowViewSize = getResources().getDimensionPixelOffset(R.dimen.menu_more_size);
overflow = new ImageView(context);
overflow.setImageResource(R.drawable.ic_more_vert_white_24dp);
overflow.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
showOverflowMenu();
}
});
// overflow.setVisibility(GONE);
LinearLayout.LayoutParams params = new LayoutParams(overflowViewSize, overflowViewSize);
params.gravity = Gravity.CENTER_VERTICAL;
addView(overflow, params);
}
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
int widthRequired = 0;
isOverflowing = false;
overflowItems.clear();
drawableItems.clear();
if (items.size() == 0) {
return;
}
int availableWidth = MeasureSpec.getSize(widthMeasureSpec) - overflowViewSize;
for (int i=0; i<items.size(); i++) {
View child = items.get(i).getView();
measureChild(child, widthMeasureSpec, heightMeasureSpec);
widthRequired += child.getMeasuredWidth();
if (widthRequired > availableWidth) {
isOverflowing = true;
overflowItems.add(items.get(i));
} else {
drawableItems.add(items.get(i));
}
}
int drawableWidth = MeasureSpec.getSize(widthMeasureSpec) - (isOverflowing ? overflowViewSize : 0);
int childWidthMeasureSpec = MeasureSpec.makeMeasureSpec(drawableWidth/drawableItems.size(), MeasureSpec.EXACTLY);
for (int i=0; i<drawableItems.size(); i++) {
View child = drawableItems.get(i).getView();
child.measure(childWidthMeasureSpec, heightMeasureSpec);
}
}
@Override
protected void onLayout(boolean changed, int l, int t, int r, int b) {
int left = 0;
for (int i=0; i<drawableItems.size(); i++) {
View child = drawableItems.get(i).getView();
int height = Math.min(child.getMeasuredHeight(), b - t);
int top = (b - t - height)/2;
child.layout(left, top, left + child.getMeasuredWidth(), top + height);
left += child.getMeasuredWidth();
}
if (isOverflowing) {
overflow.layout(getMeasuredWidth() - overflowViewSize, t, getMeasuredWidth(), b);
}
// After opening the menu and dismissing it, the views are still laid out
for (int i=0; i<overflowItems.size(); i++) {
View child = overflowItems.get(i).getView();
if (child.getParent() == this) {
child.layout(0, 0, 0, 0);
}
}
}
public void addItem(FlexibleMenu.MenuItem item) {
items.add(item);
_addView(item.getView());
}
private void _addView(View view) {
LinearLayout.LayoutParams params = new LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT);
params.gravity = Gravity.CENTER_VERTICAL;
addView(view, getChildCount() - 1, params);
}
private void showOverflowMenu() {
if (overflowItems.size() == 0) {
return;
}
final ViewGroup contentView = prepareContentViewForPopup();
final PopupWindow popup = new PopupWindow(contentView, 400, 300, true);
popup.setOutsideTouchable(false);
popup.setFocusable(true);
popup.showAsDropDown(overflow);
popup.setOnDismissListener(new PopupWindow.OnDismissListener() {
@Override
public void onDismiss() {
contentView.removeAllViews();
for (int i=0; i<overflowItemsTempContainer.size(); i++) {
View view = overflowItemsTempContainer.get(i).getView();
_addView(view);
}
overflowItemsTempContainer.clear();
}
});
}
private ViewGroup prepareContentViewForPopup() {
overflowItemsTempContainer.clear();
LinearLayout layout = new LinearLayout(getContext());
layout.setBackgroundColor(ContextCompat.getColor(getContext(), R.color.colorAccent));
layout.setOrientation(VERTICAL);
for (int i=0; i<overflowItems.size(); i++) {
overflowItemsTempContainer.add(overflowItems.get(i));
View view = overflowItems.get(i).getView();
removeView(view);
layout.addView(view);
}
return layout;
}
}
灵活菜单
public class FlexibleMenu {
private final List<MenuItem> items;
private final MenuCallback callback;
public FlexibleMenu(List<MenuItem> items, MenuCallback callback) {
this.items = items;
this.callback = callback;
}
public void inflate(FlexibleMenuContainer container) {
for (int i=0; i<items.size(); i++) {
final MenuItem item = items.get(i);
container.addItem(item);
item.getView().setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
callback.onItemClicked(item);
}
});
}
}
public interface MenuCallback {
void onItemClicked(MenuItem item);
}
public static class MenuItem {
private final int id;
private final View view;
public MenuItem(int id, View view) {
this.id = id;
this.view = view;
}
public View getView() {
return view;
}
public int getId() {
return id;
}
}
}
布局
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
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"
android:orientation="vertical"
tools:context="com.fenchtose.flexiblemenu.MainActivity">
<android.support.v7.widget.Toolbar
android:layout_width="match_parent"
android:layout_height="56dp"
android:paddingStart="0dp"
android:background="@color/colorPrimary">
<com.fenchtose.flexiblemenu.FlexibleMenuContainer
android:id="@+id/menu_container"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</android.support.v7.widget.Toolbar>
<android.support.v7.widget.Toolbar
android:layout_width="match_parent"
android:layout_height="56dp"
android:paddingStart="0dp"
android:background="@color/colorPrimary">
<com.fenchtose.flexiblemenu.FlexibleMenuContainer
android:id="@+id/menu_container1"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</android.support.v7.widget.Toolbar>
<android.support.v7.widget.Toolbar
android:layout_width="match_parent"
android:layout_height="56dp"
android:paddingStart="0dp"
android:background="@color/colorPrimary">
<com.fenchtose.flexiblemenu.FlexibleMenuContainer
android:id="@+id/menu_container2"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</android.support.v7.widget.Toolbar>
</LinearLayout>
MainActivity
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
setupMenu(R.id.menu_container, 6);
setupMenu(R.id.menu_container1, 2);
setupMenu(R.id.menu_container2, 4);
}
private void setupMenu(int id, int size) {
FlexibleMenuContainer container = (FlexibleMenuContainer) findViewById(id);
FlexibleMenu menu = new FlexibleMenu(populate(size), new FlexibleMenu.MenuCallback() {
@Override
public void onItemClicked(FlexibleMenu.MenuItem item) {
Toast.makeText(MainActivity.this, "menu selected: " + item.getId(), Toast.LENGTH_SHORT).show();
}
});
menu.inflate(container);
}
private List<FlexibleMenu.MenuItem> populate(int size) {
List<FlexibleMenu.MenuItem> items = new ArrayList<>();
for (int i=0; i<size; i++) {
View view = createView("Menu Item " + (i + 1));
items.add(new FlexibleMenu.MenuItem(i, view));
}
return items;
}
private TextView createView(String text) {
TextView view = new TextView(this);
view.setText(text);
view.setGravity(Gravity.CENTER);
view.setTextColor(0xffffffff);
return view;
}
}
这是一个将菜单项左对齐同时将溢出菜单图标保持在右侧的解决方案。此解决方案使用 toolbar/action 栏的标准实现，但预计将如何布置操作视图，以便它们将按照我们希望的方式在工具栏中定位。
下面的大部分代码都是您提供的。我已将创建菜单项的 for 循环移动到 onCreateOptionsMenu() 中，这样我就可以利用已经是工具栏菜单结构一部分的 ActionMenuView 而不是添加另一个。
在 onCreateOptionsMenu() 中，随着菜单项被放置到菜单中，菜单项消耗的 space 的 运行 计数得到维护。只要有 space，菜单项就会被标记为 "shown" (MenuItem.SHOW_AS_ACTION_ALWAYS)。如果该项目将侵占为溢出菜单图标保留的区域，则该项目被放置但针对溢出菜单 (MenuItem.SHOW_AS_ACTION_NEVER)。
将所有视图放入菜单后，计算松弛度 space。这是屏幕上最后一个可见菜单项和溢出图标之间的区域（如果使用溢出）或最后一个可见项目和工具栏末尾之间（如果未使用溢出）。
一旦计算出松弛 space，就会创建一个 Space 小部件并将其放入菜单中。此小部件强制所有其他项目左对齐。
大部分更改已对 MainActivity.java 进行，但我可能在 XML 文件中更改了一两处。为了完整起见，我将它们包括在这里。
下面是一些结果的屏幕截图。
MainActivity.java
public class MainActivity extends AppCompatActivity {
private Toolbar mToolbar;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
mToolbar = findViewById(R.id.toolbar);
mToolbar.setTitle("");
setSupportActionBar(mToolbar); // Ensures that onCreateOptionsMenu is called
}
@Override
public boolean onCreateOptionsMenu(Menu menu) {
final float density = getResources().getDisplayMetrics().density;
final int overflowCellSize = (int) (OVERFLOW_CELL_WIDTH * density);
// Other than the overflow icon, this is how much real estate we have to fill.
int widthLeftToFill = mToolbar.getWidth() - overflowCellSize;
// slackWidth is what is left over after we are done adding our action views.
int slackWidth = -1;
for (int i = 0; i < 10; ++i) {
final View menuItemView =
LayoutInflater.from(this).inflate(R.layout.action_item, mToolbar, false);
ImageView imageView = menuItemView.findViewById(android.R.id.icon);
final int itemIconResId = R.drawable.ic_launcher_background;
imageView.setImageResource(itemIconResId);
final String text = "item" + i;
((TextView) menuItemView.findViewById(android.R.id.text1)).setText(text);
final View.OnClickListener onClickListener = new View.OnClickListener() {
@Override
public void onClick(final View view) {
Toast.makeText(MainActivity.this, text,
Toast.LENGTH_SHORT).show();
}
};
menuItemView.setOnClickListener(onClickListener);
final MenuItem menuItem = menu
.add(text).setActionView(menuItemView).setIcon(itemIconResId)
.setOnMenuItemClickListener(new MenuItem.OnMenuItemClickListener() {
@SuppressLint("MissingPermission")
@Override
public boolean onMenuItemClick(final MenuItem menuItem) {
onClickListener.onClick(menuItemView);
return true;
}
});
// How wide is this ActionView?
menuItemView.measure(View.MeasureSpec.UNSPECIFIED, View.MeasureSpec.UNSPECIFIED);
widthLeftToFill -= menuItemView.getMeasuredWidth();
if (widthLeftToFill >= 0) {
// The item will fit on the screen.
menuItem.setShowAsAction(MenuItem.SHOW_AS_ACTION_ALWAYS);
} else {
// The item will not fit. Force it to overflow.
menuItem.setShowAsAction(MenuItem.SHOW_AS_ACTION_NEVER);
if (slackWidth < 0) {
// Just crossed over the limit of space to fill - capture the slack space.
slackWidth = widthLeftToFill + menuItemView.getMeasuredWidth();
}
}
}
if (slackWidth < 0) {
// Didn't have enough action views to fill the width.
slackWidth = widthLeftToFill + overflowCellSize;
}
if (slackWidth > 0) {
// Create a space widget to consume the slack. This slack space widget makes sure
// that the action views are left-justified with the overflow on the right.
// As an alternative, this space could also be distributed among the action views.
Space space = new Space(this);
space.setMinimumWidth(slackWidth);
final MenuItem menuItem = menu.add("").setActionView(space);
menuItem.setShowAsAction(MenuItem.SHOW_AS_ACTION_ALWAYS);
}
return true;
}
private static final int OVERFLOW_CELL_WIDTH = 40; // dips
}
activity_main.xml
<FrameLayout 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:layoutDirection="ltr"
android:padding="0px"
android:theme="@style/ThemeOverlay.AppCompat.ActionBar"
app:contentInsetEnd="0px"
app:contentInsetEndWithActions="0px"
app:contentInsetLeft="0px"
app:contentInsetRight="0px"
app:contentInsetStart="0px"
app:contentInsetStartWithNavigation="0px"
app:logo="@null"
app:title="@null"
app:titleMargin="0px"
app:titleTextColor="#757575"
tools:ignore="UnusedAttribute"
tools:title="toolbar">
</android.support.v7.widget.Toolbar>
</FrameLayout>
action_item.xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:background="?android:attr/selectableItemBackground"
android:clickable="true"
android:focusable="true"
android:focusableInTouchMode="false"
android:gravity="center"
android:orientation="horizontal"
android:paddingLeft="8dp">
<ImageView
android:id="@android:id/icon"
android:layout_width="wrap_content"
android:layout_height="?attr/actionBarSize"
android:scaleType="center"
tools:src="@android:drawable/sym_def_app_icon" />
<TextView
android:id="@android:id/text1"
android:layout_width="wrap_content"
android:layout_height="?attr/actionBarSize"
android:layout_marginLeft="6dp"
android:layout_marginStart="6dp"
android:gravity="center"
android:textColor="#c2555555"
android:textSize="15sp"
tools:text="text" />
</LinearLayout>
更新：要在不将其设置为操作栏的情况下使用工具栏，请添加全局布局侦听器以等待工具栏设置。
MainActivity.java - 使用全局布局侦听器而不是操作栏
public class MainActivity extends AppCompatActivity {
private Toolbar mToolbar;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
mToolbar = findViewById(R.id.toolbar);
mToolbar.setTitle("");
// setSupportActionBar(mToolbar); // Ensures that onCreateOptionsMenu is called
mToolbar.getViewTreeObserver().addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {
@Override
public void onGlobalLayout() {
mToolbar.getViewTreeObserver().removeOnGlobalLayoutListener(this);
setupMenu(mToolbar.getMenu());
}
});
}
public boolean setupMenu(Menu menu) {
final float density = getResources().getDisplayMetrics().density;
int mOverflowCellSize = (int) (OVERFLOW_CELL_WIDTH * density);
// Other than the overflow icon, this is how much real estate we have to fill.
int widthLeftToFill = mToolbar.getWidth() - mOverflowCellSize;
// slackWidth is what is left over after we are done adding our action views.
int slackWidth = -1;
for (int i = 0; i < 10; ++i) {
final View menuItemView =
LayoutInflater.from(this).inflate(R.layout.action_item, mToolbar, false);
ImageView imageView = menuItemView.findViewById(android.R.id.icon);
final int itemIconResId = R.drawable.ic_launcher_background;
imageView.setImageResource(itemIconResId);
String text = "item" + i;
((TextView) menuItemView.findViewById(android.R.id.text1)).setText(text);
final View.OnClickListener onClickListener = new View.OnClickListener() {
@Override
public void onClick(final View view) {
Toast.makeText(MainActivity.this, text ,
Toast.LENGTH_SHORT).show();
}
};
menuItemView.setOnClickListener(onClickListener);
final MenuItem menuItem = menu
.add(text).setActionView(menuItemView).setIcon(itemIconResId)
.setOnMenuItemClickListener(new MenuItem.OnMenuItemClickListener() {
@SuppressLint("MissingPermission")
@Override
public boolean onMenuItemClick(final MenuItem menuItem) {
onClickListener.onClick(menuItemView);
return true;
}
});
// How wide is this ActionView?
menuItemView.measure(View.MeasureSpec.UNSPECIFIED, View.MeasureSpec.UNSPECIFIED);
widthLeftToFill -= menuItemView.getMeasuredWidth();
if (widthLeftToFill >= 0) {
// The item will fit on the screen.
menuItem.setShowAsAction(MenuItem.SHOW_AS_ACTION_ALWAYS);
} else {
// The item will not fit. Force it to overflow.
menuItem.setShowAsAction(MenuItem.SHOW_AS_ACTION_NEVER);
if (slackWidth < 0) {
// Just crossed over the limit of space to fill - capture the slack space.
slackWidth = widthLeftToFill + menuItemView.getMeasuredWidth();
}
}
}
if (slackWidth < 0) {
// Didn't have enough action views to fill the width.
slackWidth = widthLeftToFill + mOverflowCellSize;
}
if (slackWidth > 0) {
// Create a space widget to consume the slack. This slack space widget makes sure
// that the action views are left-justified with the overflow on the right.
// As an alternative, this space could also be distributed among the action views.
Space space = new Space(this);
space.setMinimumWidth(slackWidth);
final MenuItem menuItem = menu.add("").setActionView(space);
menuItem.setShowAsAction(MenuItem.SHOW_AS_ACTION_ALWAYS);
}
return true;
}
private static final int OVERFLOW_CELL_WIDTH = 40; // dips
}
以下示例应用通过引入方法 notifyMenuItemsChanged 将菜单创建与菜单的左对齐分开。在应用程序中，单击按钮以删除位置 1 的菜单项。
此代码与上面的代码基本相同，但是 Space 小部件需要一个 id，以便在菜单更改时可以将其删除以重新添加。
MainActivity.Java: 示例应用
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
final Toolbar toolbar = findViewById(R.id.toolbar);
toolbar.setTitle("");
findViewById(R.id.button).setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
Menu menu = toolbar.getMenu();
// Remove item at position 1 on click of button.
if (menu.size() > 1) {
menu.removeItem(menu.getItem(1).getItemId());
notifyMenuItemsChanged(toolbar);
}
}
});
toolbar.getViewTreeObserver().addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {
@Override
public void onGlobalLayout() {
toolbar.getViewTreeObserver().removeOnGlobalLayoutListener(this);
setupMenu(toolbar);
}
});
}
private void setupMenu(Toolbar toolbar) {
Menu menu = toolbar.getMenu();
// Since we are resetting the menu, get rid of what may have been placed there before.
menu.clear();
for (int i = 0; i < 10; ++i) {
final View menuItemView =
LayoutInflater.from(this).inflate(R.layout.action_item, toolbar, false);
ImageView imageView = menuItemView.findViewById(android.R.id.icon);
final int itemIconResId = R.drawable.ic_launcher_background;
imageView.setImageResource(itemIconResId);
String text = "item" + i;
((TextView) menuItemView.findViewById(android.R.id.text1)).setText(text);
final View.OnClickListener onClickListener = new View.OnClickListener() {
@Override
public void onClick(final View view) {
Toast.makeText(MainActivity.this, text ,
Toast.LENGTH_SHORT).show();
}
};
menuItemView.setOnClickListener(onClickListener);
menu.add(Menu.NONE, View.generateViewId(), Menu.NONE, text)
.setActionView(menuItemView)
.setIcon(itemIconResId)
.setOnMenuItemClickListener(new MenuItem.OnMenuItemClickListener() {
@SuppressLint("MissingPermission")
@Override
public boolean onMenuItemClick(final MenuItem menuItem) {
onClickListener.onClick(menuItemView);
return true;
}
});
}
// Now take the menu and left-justify it.
notifyMenuItemsChanged(toolbar);
}
/**
* Call this routine whenever the Toolbar menu changes. Take all action views and
* left-justify those that fit on the screen. Force to overflow those that don't.
*
* @param toolbar The Toolbar that holds the menu.
*/
private void notifyMenuItemsChanged(Toolbar toolbar) {
final int OVERFLOW_CELL_WIDTH = 40; // dips
final Menu menu = toolbar.getMenu();
final float density = getResources().getDisplayMetrics().density;
final int mOverflowCellSize = (int) (OVERFLOW_CELL_WIDTH * density);
// Other than the overflow icon, this is how much real estate we have to fill.
int widthLeftToFill = toolbar.getWidth() - mOverflowCellSize;
// slackWidth is what is left over after we are done adding our action views.
int slackWidth = -1;
MenuItem menuItem;
// Index of the spacer that will be removed/replaced.
int spaceIndex = View.NO_ID;
if (menu.size() == 0) {
return;
}
// Examine each MenuItemView to determine if it will fit on the screen. If it can,
// set its MenuItem to always show; otherwise, set the MenuItem to never show.
for (int i = 0; i < menu.size(); i++) {
menuItem = menu.getItem(i);
View menuItemView = menuItem.getActionView();
if (menuItemView instanceof Space) {
spaceIndex = menuItem.getItemId();
continue;
}
if (!menuItem.isVisible()) {
continue;
}
// How wide is this ActionView?
menuItemView.measure(View.MeasureSpec.UNSPECIFIED, View.MeasureSpec.UNSPECIFIED);
widthLeftToFill -= menuItemView.getMeasuredWidth();
if (widthLeftToFill >= 0) {
// The item will fit on the screen.
menuItem.setShowAsAction(MenuItem.SHOW_AS_ACTION_ALWAYS);
} else {
// The item will not fit. Force it to overflow.
menuItem.setShowAsAction(MenuItem.SHOW_AS_ACTION_NEVER);
if (slackWidth < 0) {
// Just crossed over the limit of space to fill - capture the slack space.
slackWidth = widthLeftToFill + menuItemView.getMeasuredWidth();
}
}
}
if (spaceIndex != View.NO_ID) {
// Assume that this is our spacer. It may need to change size, so eliminate it for now.
menu.removeItem(spaceIndex);
}
if (slackWidth < 0) {
// Didn't have enough action views to fill the width, so there is no overflow.
slackWidth = widthLeftToFill + mOverflowCellSize;
}
if (slackWidth > 0) {
// Create a space widget to consume the slack. This slack space widget makes sure
// that the action views are left-justified with the overflow on the right.
// As an alternative, this space could also be distributed among the action views.
Space space = new Space(this);
space.setMinimumWidth(slackWidth);
// Need an if for the spacer so it can be deleted later if the menu is modified.
// Need API 17+ for generateViewId().
menuItem = menu.add(Menu.NONE, View.generateViewId(), Menu.NONE, "")
.setActionView(space);
menuItem.setShowAsAction(MenuItem.SHOW_AS_ACTION_ALWAYS);
}
}
}
activity_main.xml: 示例应用
<LinearLayout 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"
android:orientation="vertical"
tools:context=".MainActivity">
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="Click the button to add/remove item #1 from the menu."/>
<Button
android:id="@+id/button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="Click to modify menu" />
</LinearLayout>