【问题标题】:Strange whitespace on Android ToolbarAndroid工具栏上的奇怪空格
【发布时间】:2015-12-15 09:17:01
【问题描述】:

我正在努力将Toolbar 放在屏幕底部。隐藏工具栏标题后,标题仍然占用空间。

我的问题是:如何删除空格?


styles.xml

<resources>
    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
        <!-- Customize your theme here. -->
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>
        <item name="windowActionBar">false</item>
        <item name="windowNoTitle">true</item>
    </style>
</resources>

在我的活动中onCreate()

toolbar = (Toolbar)findViewById(R.id.bar_bottom);
setSupportActionBar(toolbar);
getSupportActionBar().setSubtitle("");
getSupportActionBar().setDisplayShowTitleEnabled(false);

在同一活动的onCreateOptionsMenuonOptionsItemSelected

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

@Override
public boolean onOptionsItemSelected(MenuItem item) {
    return super.onOptionsItemSelected(item);
}

在我的布局中:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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:paddingTop="@dimen/activity_vertical_margin"
    tools:context=".WelcomeActivity">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">
        <TextView
            android:id="@+id/lbl_test"
            android:layout_width="match_parent"
            android:layout_height="20sp"
            android:text=""
            />
    </LinearLayout>
    <android.support.v7.widget.Toolbar
        android:id="@+id/bar_bottom"
        android:layout_height="wrap_content"
        android:layout_width="match_parent"
        android:background="?attr/colorPrimary"
        android:layout_alignParentBottom="true"
         />
</RelativeLayout>

和菜单:

<?xml version="1.0" encoding="utf-8"?>
<menu 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"
    tools:context=".WelcomeActivity">
    <item
        android:id="@+id/btn_1"
        android:orderInCategory="100"
        android:title="Button 1"
        app:showAsAction="always" />
    <item
        android:id="@+id/btn_2"
        android:orderInCategory="200"
        android:title="Button 2"
        app:showAsAction="always" />
    <item
        android:id="@+id/btn_3"
        android:orderInCategory="300"
        android:title="Button 3"
        app:showAsAction="always" />
    <item
        android:id="@+id/btn_4"
        android:orderInCategory="400"
        android:title="Button 4"
        app:showAsAction="always" />
</menu>

【问题讨论】:

  • 我没有隐藏工具栏,我只是通过getSupportActionBar().setDisplayShowTitleEnabled(false);隐藏了工具栏标题
  • 将重力设置为工具栏为 android:gravity="start"
  • 菜单项总是从右边开始。
  • 我知道,但我希望 4 个菜单项均等地占据全宽。我怎样才能做到这一点?
  • @Raptor 如果您以这种方式使用工具栏,您将无法随意对齐内容。相反,您可以将自定义布局添加到您的工具栏,然后自己管理所有项目点击,而无需将其设置为 ActionBar(这很糟糕,因为您必须编写所有侦听器)。看来你的目标,比如G+底栏,只有这样才能实现。

标签: android android-toolbar


【解决方案1】:

也许我还不算太晚。

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">

<android.support.v7.widget.Toolbar
    android:id="@+id/actionbar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:minHeight="?attr/actionBarSize"
    app:theme="@style/Base.Theme.AppCompat.CompactMenu"
    android:layout_alignParentBottom="true">

    <LinearLayout
        android:id="@+id/toolbarMenuLayout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="horizontal"
        android:weightSum="3"
        android:gravity="center_horizontal">

        <ImageButton
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:clickable="true"
            android:scaleType="fitXY"
            android:src="@drawable/ic_action_location" />

        <ImageButton
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:clickable="true"
            android:scaleType="fitXY"
            android:src="@drawable/ic_action_refresh" />

        <ImageButton
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:clickable="true"
            android:scaleType="fitXY"
            android:src="@drawable/ic_action_settings" />

    </LinearLayout>

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

如果您使用经典模式中所述的工具栏,则无法随意对齐内容。正如您在上面的代码中所见,将自定义布局添加到您的工具栏,然后自己管理所有项目点击,而不将其设置为 ActionBar(这很糟糕,因为您当然必须编写所有侦听器和样式)。

顺便说一下,你会注意到工具栏总是在左边有一个填充:这是正常的,G+应用也有(在下面的截图中,你会在主页按钮的左侧)。

【讨论】:

  • @Raptor 很高兴为您提供帮助!
【解决方案2】:

据我所知,一旦您将 ToolBar 设置为 SupportActionBar,即使您将其设置为空字符串,它也会保留标题右侧的空间。

此外,当您删除标题并且没有图标或导航时,您实际上对 ActionBar 不感兴趣,而只是对工具栏感兴趣。为什么不如下扩展工具栏并使用,以便通过膨胀菜单添加到相同的项目将等距

public class SplitToolbar extends Toolbar {

    public SplitToolbar(Context context) {
        super(context);
    }

    public SplitToolbar(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    public SplitToolbar(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
    }

    @Override
    public void addView(View child, ViewGroup.LayoutParams params) {
        if (child instanceof ActionMenuView) {
            params.width = LayoutParams.MATCH_PARENT;
        }
        super.addView(child, params);
    }
}

如下实例化并扩展 XML

SplitToolbar toolbar = (SplitToolbar) findViewById(R.id.my_awesome_toolbar);
toolbar.inflateMenu(R.menu.menu_toolbar);

在布局 XML 中添加如下工具栏

<com.xxx.xxx.xxx.SplitToolbar
                android:id="@+id/my_awesome_toolbar"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:background="@color/primary" />

最后是相同的菜单 XML

<menu 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"
    tools:context=".XXXActivity">

    <item
        android:id="@+id/action_zoom2fit"
        android:icon="@drawable/ic_aspect_ratio_white_24dp"
        android:orderInCategory="100"
        android:title="@string/zoomfit"
        app:showAsAction="always" />
    <item
        android:id="@+id/action_card"
        android:icon="@drawable/ic_action_eject"
        android:orderInCategory="100"
        android:title="@string/showcard"
        app:showAsAction="always" />
    <item
        android:id="@+id/actionZoom2Track"
        android:icon="@drawable/ic_drive_eta_white_24dp"
        android:orderInCategory="100"
        android:title="@string/zoom2Tracked"
        app:showAsAction="always" />

</menu>

注意/免责声明:工具栏为此目的的扩展实际上源自我前一段时间在 StackOverflow 本身上找到的答案。我正试图找到相同的人来称赞这个人。一旦我找到它肯定会添加它。 我相信我是从这个线程中得到的 Evenly spaced menu items on Toolbar

【讨论】:

  • 谢谢,我会尝试并回复您。
  • 经过测试,部分运行良好。在 720x1280 分辨率下,只能显示 3 个菜单按钮(但它们的间距相等,很好!)。
猜你喜欢
  • 2016-02-10
  • 2019-05-04
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2016-05-20
  • 2015-06-27
  • 1970-01-01
相关资源
最近更新 更多