ActionBar的主页图标和标题之间的填充

112

有人知道如何在ActionBar的主页图标和标题之间设置填充吗?


17
欢迎来到黑客的世界:Android。如果我们需要其他 UI 技术和应用程序编程中的这个功能,即使是新手也应该能够找到这个简单的东西。然而在 Android 中,它真的很神秘。他们有意将这个功能隐藏起来,使它变得复杂,只是为了让 Android 成为一个黑客的世界。我不知道他们的最终目的是什么。 - King King
1
这个问题和回答提供了在工具栏内使用属性实现此目的的方法(支持v7)。 - Eli
1
Android比iOS更糟糕。 - Borzh
22个回答

102

编辑:确保将此可绘制对象设置为LOGO,而不是像一些评论者那样设置为应用程序图标。

只需创建一个XML可绘制对象并将其放入资源文件夹“drawable”中(不带任何密度或其他配置)。

<?xml version="1.0" encoding="utf-8"?>
<layer-list
    xmlns:android="http://schemas.android.com/apk/res/android" >

    <item
        android:drawable="@drawable/my_logo"
        android:right="10dp"/>


</layer-list>

最后一步是将此新的可绘制对象设置为清单中的标志(或在您的活动中的 Actionbar 对象上设置)

祝你好运!


1
这个解决方案存在一个大问题。我使用了它,@Alesqui是正确的——应用程序图标改变并变小了……你可以更改图标,但由于不同手机的dp不同,因此这个解决方案在生产应用中行不通。 - Johan S
3
请确保将此可绘制对象设置为“LOGO”,而不是您的应用程序图标。祝好运! - Cliffus
1
我也看到了扭曲。如果我像上面那样应用右填充,图像的右侧将被裁剪。 - Neil
1
有趣的解决方案,但对我无效 - 我可以通过这种方式添加额外的填充或裁剪标志图像 - 不好(4.3) - Dori
1
@Cliffus - 不错的解决方案。我的要求是将标志移到左边,所以我使用了:android:left="-4dp"。 - TharakaNirmana
显示剩余8条评论

70

我采用了Cliffus的答案,并在我的ActionBar样式定义中指定了logo-drawable,例如在res/style.xml中像这样:

<item name="android:actionBarStyle">@style/MyActionBar</item>

<style name="MyActionBar" parent="@android:style/Widget.Holo.Light.ActionBar">
        <item name="android:background">#3f51b5</item>
        <item name="android:titleTextStyle">@style/ActionBar.TitleText</item>
        <item name="android:textColor">#fff</item>
        <item name="android:textSize">18sp</item>
        <item name="android:logo">@drawable/actionbar_space_between_icon_and_title</item>
</style>

在res/drawable/actionbar_space_between_icon_and_title.xml中,可绘制对象看起来像Cliffus的一个(这里是使用默认应用启动器图标):

<?xml version="1.0" encoding="utf-8"?>
<layer-list
    xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:drawable="@drawable/ic_launcher"
        android:right="20dp"/>
</layer-list>
在android_manifest.xml中,你仍然可以设置不同的应用图标(‘桌面’上的启动器图标)。这里定义的任何不同的logo都会在没有操作栏的活动中可见。

为什么它在Android 5.1上没有生效? - Logan Guo
抱歉,在5.1版本中我无法对此发表意见。我转而使用更灵活的工具栏控件。如果还没有这样做,我建议在StackOverflow上开一个新问题,并写一些更详细的细节,包括你在(小于)5.1版本中的工作情况以及不起作用的地方,以及你尝试了什么但没有解决方案。 - Minsky
谢谢@Minsky,我从你的回答中获得了灵感来解决我的问题,我将如何解决放在下面的答案中 :) - Context
如果使用了mipmap会怎样? - Yura Shinkarev

55

我也遇到了类似的问题,在我的情况下,我必须根据内容在每个活动中动态设置标题。

所以这对我有用。

actionBar.setTitle("  " + yourActivityTitle);

如果你只需要调整间距,这是我能想到的最简单的解决方案。


13
为什么要踩我?我认为这不是错误的回答,只是另一种方式而已。 - Rahul Sainani
3
@idratherbeintheair,我同意这并不是最“干净”的方式,现在只说它是最简单的。但是当你指出一个问题时,请发布一个替代解决方案。我遇到了这个问题,这就是我在我的应用程序中使用的方法,所以我分享了出来。 - Rahul Sainani
3
真的吗?这个解决方案在不同DPI的屏幕上可能效果不同。 - Roman Bugaian
5
我不会选择这个解决方案,因为我真的需要在我的应用程序中使用更稳定的东西,但是我想问所有那些说“这不够简洁”的人,天哪,问题的“简洁解决方案”在哪里?所有那些徽标设置和设置填充的Hack看起来对我也不是很干净!只要读一下评论,就能知道有多少人遇到了问题。如果设置android:paddingLeft在标题上,则会更加干净,如果它起作用的话。因为出于某种原因它并没有像应该的那样工作,所以我们被迫在黑暗中发明Hack。因此,并不存在所谓的“不简洁”。 - Varvara Kalinina
1
更加简洁的解决方案是在布局XML中使用app:titleMarginStart属性。 - LarsH
显示剩余4条评论

40
这是我如何设置主页图标和标题之间的填充。
ImageView view = (ImageView)findViewById(android.R.id.home);
view.setPadding(left, top, right, bottom);

我找不到一种通过ActionBar xml样式自定义的方法。也就是说,以下XML代码无法生效:

<style name="ActionBar" parent="android:style/Widget.Holo.Light.ActionBar">        
    <item name="android:titleTextStyle">@style/ActionBarTitle</item>
    <item name="android:icon">@drawable/ic_action_home</item>        
</style>

<style name="ActionBarTitle" parent="android:style/TextAppearance.Holo.Widget.ActionBar.Title">
    <item name="android:textSize">18sp</item>
    <item name="android:paddingLeft">12dp</item>   <!-- Can't get this padding to work :( -->
</style>

然而,如果您想通过xml实现这一点,这两个链接可能会帮助您找到解决方案:

https://github.com/android/platform_frameworks_base/blob/master/core/res/res/values/styles.xml

这是在操作栏中显示主页图标所使用的实际布局。 https://github.com/android/platform_frameworks_base/blob/master/core/res/res/layout/action_bar_home.xml


1
@Dushyanth,我刚试了一下,但在ImageView上显示空指针异常。在动作栏中,我同时具有homeUpIndicator和home图标。 - Krishna Shrestha
1
这仅适用于API> = 11,因为android.R.id.home是在API 11中引入的。我使用actionbarcompat在蜂窝前设备上也有操作栏。如何在那里处理它? - tobias
有点小技巧。请参考下面Cliffus的答案,那里有更简洁的解决方案。 - dhaag23
主页间距不再使用padding设置,似乎从api 17开始使用marginEnd - 这可能会破坏此解决方案。请参见下面的代码: - Dori
@tobias,R.id.home始终存在,即使在第11级之前也是如此。它只是不可用。 - oscarthecat

32

在Material Design中,这是一个常见的问题,因为您可能希望将工具栏标题与下面片段中的内容对齐。为了做到这一点,您可以通过在toolbar.xml布局中使用属性contentInsetStart="72dp"来覆盖默认填充"12dp"。

toolbar.xml

<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.Toolbar
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@color/app_theme_color"
    app:contentInsetStart="72dp"/>

然后在你的活动中调用

Toolbar toolbar = (Toolbar) activity.findViewById(R.id.toolbar);
toolbar.setTitle("Title Goes Here");

然后你最终得到了这个:

工具栏


这在我的情况下根本不起作用。请告诉我设置活动的样式。 - Nitin Mesta
11
这是正确的方法。还有一个 app:titleMarginStart="dimension" 来直接调整标题的位置。 - Markus Rubey
我认为对于大多数用户来说,这将是“正确”的答案。非常好用,谢谢! - Taras
1
如果问题是关于主页图标和标题之间的填充,那么这怎么能是“正确”的答案呢?这里没有提到主页图标(也没有提到徽标或任何变体)。如果contentInsetStart在主页图标和标题之间放置空间,答案至少可以这样说。我刚才用contentInsetStart进行的测试似乎将空格放在了徽标之前(尽管这与主页图标不同)。 - LarsH

32
如果你使用的是来自AppCompat的工具栏(android.support.v7.widget.Toolbar,版本号>=24,2016年6月),可以使用以下值来更改图标和标题之间的内边距:
如果您正在使用来自AppCompat的工具栏(android.support.v7.widget.Toolbar, >= 版本 24,2016年6月),则可以使用以下值更改图标和标题之间的边距:
  app:contentInsetStartWithNavigation="0dp"

为了改善我的答案,您可以直接在活动中使用工具栏,也可以为您的工具栏创建一个新的布局文件。在这种情况下,您只需要使用include属性导入工具栏的@id,在每个需要的视图上使用它即可。

<android.support.v7.widget.Toolbar
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="?attr/actionBarSize"
    android:elevation="4dp"
    app:contentInsetLeft="0dp"
    app:contentInsetStart="0dp"
    app:contentInsetStartWithNavigation="0dp">
</android.support.v7.widget.Toolbar>
您可以在activity.xml上导入您的布局。
<include
        layout="@layout/toolbar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"/>

太好了。如果您能提供相关的XML示例以澄清放置位置,那就更好了。(我知道该把这行代码放在哪里) - John Pang
@JohnPang,我详细说明了我的答案,希望能帮助你理解如何使用这个属性。 - tryp
@Bolein95 你是否使用了支持库?为了能够帮助你,请提供更多信息。 - tryp
值得注意的是,这个参数是在设计库的第24个版本中引入的。因此,如果你被困在Eclipse的第23个版本(就像我昨天之前一样...),你将无法访问它。 - FlorianT
@FloriantT 谢谢您的精确指导,我已经根据您的评论更新了我的答案。 - tryp

30

对我而言,只有以下组合适用,已在API 18到24进行过测试

app:contentInsetLeft="0dp"
app:contentInsetStart="0dp"
app:contentInsetStartWithNavigation="0dp"

在 "app" 中的位置是:xmlns:app="http://schemas.android.com/apk/res-auto"

例如。

 <android.support.v7.widget.Toolbar
                android:id="@+id/toolbar"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                android:background="@color/SE_Life_Green"
                app:contentInsetLeft="0dp"
                app:contentInsetStart="0dp"
                app:contentInsetStartWithNavigation="0dp"
                >
                .......
                .......
                .......
            </android.support.v7.widget.Toolbar>

1
非常感谢。@Ajit - shahid17june
1
太好了。如果您能提供相关的XML示例以澄清放置位置,那就更好了。(我知道该把这行代码放在哪里) - John Pang
你好 @JohnPang,你可以像上面展示的那样将它放在你的布局工具栏中。 - Ajit

6

使用titleMarginStart对我而言是可行的。Xamarin示例:

<android.support.v7.widget.Toolbar
  xmlns:app="http://schemas.android.com/apk/res-auto"
  android:id="@+id/toolbar"
  android:layout_height="wrap_content"
  android:layout_width="match_parent"
  android:minHeight="?attr/actionBarSize"
  android:background="?attr/colorPrimary"
  app:titleMarginStart="24dp"/>

设置logo的方法如下:

mToolbar = FindViewById<SupportToolbar>(Resource.Id.toolbar);
SetSupportActionBar(mToolbar);
SupportActionBar.SetLogo(Resource.Drawable.titleicon32x32);
SupportActionBar.SetDisplayShowHomeEnabled(true);
SupportActionBar.SetDisplayUseLogoEnabled(true);
SupportActionBar.Title = "App title";

4

我之前在标题前使用了 \t,它对我有用。


2

我正在使用自定义图像来代替我的应用程序标志右侧的默认标题文本。这是通过编程设置的,如下所示:

    actionBar.setDisplayHomeAsUpEnabled(true);
    actionBar.setDisplayUseLogoEnabled(true);
    actionBar.setCustomView(R.layout.include_ab_txt_logo);
    actionBar.setDisplayShowCustomEnabled(true);

对我来说,上面的建议有问题,@Cliffus的建议由于其他人在评论中概述的问题而无法为我工作,而@dushyanth编程填充设置可能在过去起作用,但我认为自API 17以来使用android:layout_marginEnd="8dip"设置间距后,手动设置填充应该没有效果。请查看他发布到git的链接以验证其当前状态。
对我来说,一个简单的解决方案是在我的自定义视图中在操作栏上设置负边距,如下所示android:layout_marginLeft="-14dp"。快速测试表明它适用于我在2.3.3和4.3上使用ActionBarCompat 希望这能帮助某人!

@Diri,能否再加些内容?我们能不能把动作栏放在上、下、左、右位置? - Amitsharma
@amitsharma - 我不确定你的意思是什么 - 你是指将操作栏从屏幕顶部移动吗?如果是这样,我认为你需要创建一个自定义的操作栏视图来实现这个功能 - 不过听起来可能不是很好的用户体验 :) - Dori
在这种情况下,我不知道你的意思是“你能添加更多吗?我们可以将操作栏放在上方、下方、左侧或右侧吗?” - Dori

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接