【问题标题】:AppCompat v21 Toolbar changing logo sizeAppCompat v21 工具栏更改徽标大小
【发布时间】:2015-01-23 23:40:01
【问题描述】:

我正在从之前的操作栏迁移到 appcompat v21 中的新工具栏功能。我仍然想将徽标保留在操作栏(工具栏)的左上角。为此,我在布局中添加了支持工具栏,并为它创建了一个新的工具栏。

    app:theme="@style/NewToolBarStyle"

我正在以编程方式添加日志,因为应用程序中有一些逻辑。

            actionBar.setLogo(R.drawable.myicon);

参考我的新风格(暂时空着):

<style name="NewToolBarStyle" parent="@style/ThemeOverlay.AppCompat.Dark.ActionBar">
</style>

但是结果显示的图像对于我要查找的内容来说太大了,我想知道如何减小图标的大小。

有什么方法(样式、布局或编程)可以减小徽标的大小吗?

【问题讨论】:

    标签: android android-5.0-lollipop android-appcompat


    【解决方案1】:

    根据@brightstar 的建议,我想进一步开发答案。

    在新工具栏中控制徽标大小和位置的最佳方法是不使用它。这个概念完全不同,您需要做的是从头开始创建一个工具栏。所以你需要做出决定,要么使用 actionBar 给出的布局,要么包含所有新内容,包括标题。

    如果您停止使用徽标但继续使用标题,您最终会看到徽标超出了标题创建和良好的情况。

    所以,下面是一个示例:

    <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
            android:layout_width="match_parent"
            android:layout_height="wrap_content">
    <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/my_toolbar"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@drawable/action_bar_background"
            app:theme="@style/NewToolBarStyle"
            android:minHeight="?attr/actionBarSize" />
    <RelativeLayout 
        android:layout_width="fill_parent"
        android:layout_height="fill_parent" >
    
        <TextView
            android:id="@+id/text_title"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerVertical="true"
            android:layout_marginLeft="17dp"
            android:textSize="20sp"
            android:layout_toRightOf="@+id/logo_image"
            android:text="@string/app_name"
            android:textColor="@color/white" />
    
        <ImageView
            android:id="@+id/logo_image"
            android:layout_width="45dp"
            android:layout_height="45dp"
            android:layout_alignParentLeft="true"
            android:layout_centerVertical="true"
            android:scaleType="centerInside" />
    
    </RelativeLayout>
    </FrameLayout>
    

    您将此文件创建为 my_toolbar.xml。请注意以下细节:

    • 我没有包含 ImageView 的 src,因为我正在动态更改它。但可以添加它。
    • 我使用了相对布局来使图标和文本居中。
    • 我还需要添加主页按钮。

    稍后,如@brightstar 所述,您需要通过包含在布局的顶部包含,但是......请记住添加一个 id 以便您可以将所有其他视图引用到它。

     <include layout="@layout/toolbar_sharemup"
        android:id="@+id/including" />
    

    【讨论】:

    • 你的外层FrameLayout的目的是什么?在您的布局工具栏本身就足够了。此外,仅当您想要覆盖所包含项目的 id 时,才需要 include 中的 id。唯一真正需要的是在相对布局中使用它并且您想要相对于包含的项目定位其他项目;如果是这样,请确保包含 ID 和包含项目的 ID 匹配。
    • 我的 include 有一个 id,以便我可以相对定位其他项目。我包含了 FrameLayout,因为我无法在同一布局中同时包含相对布局和工具栏。您还有其他建议吗?
    【解决方案2】:

    材料设计中没有徽标图标:http://www.google.com/design/spec/layout/structure.html#,所以我想这不是经过良好测试的场景 - 或者只是(损坏)设计。您可以将 ImageView 添加为工具栏的子小部件,并使用它来显示任何图像。它将显示在所有其他内部小部件(如微调器)的右侧,但列表导航模式也已弃用。

    如果您坚持使用徽标,那么我的解决方法是确保工具栏的高度是固定的 - 这会处理错误的图标高度。即使在此之后,您也必须在工具栏内部徽标 ImageView 上将 setAdjustViewBounds 设置为 true - 否则它将创建较大的左右填充。

    这是我的工具栏的样子(高度设置为 ?attr/actionBarSize):

    <?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_height="?attr/actionBarSize"
        android:layout_width="match_parent"
        android:minHeight="?attr/actionBarSize"
        android:background="?attr/colorPrimary"
        app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
        app:popupTheme="@style/ThemeOverlay.AppCompat.Light">
    </android.support.v7.widget.Toolbar>
    

    在你的活动布局中引用它:

    <include layout="@layout/toolbar_actionbar"/>
    

    不要更改包含中的 layout_height。

    第二步,在logo图标上设置AdjustViewBounds(true):

        Drawable logo = getDrawable(iconRes);
        toolbar.setLogo(logo);
        for (int i = 0; i < toolbar.getChildCount(); i++) {
          View child = toolbar.getChildAt(i);
          if (child != null)
            if (child.getClass() == ImageView.class) {
              ImageView iv2 = (ImageView) child;
              if ( iv2.getDrawable() == logo ) {
                iv2.setAdjustViewBounds(true);
              }
            }
        }
    

    【讨论】:

    • 感谢您的建议。我想做的只是修改徽标的大小,使操作栏保持不变(使徽标比操作栏更小)。因此,按照您的想法,我采用了 iv2(我的徽标图像视图)并尝试修改徽标的参数,结果它崩溃了。你知道我能做到吗?
    • @TrebiaProject。如果您有崩溃然后查看 logcat/exceptions,但这是一种骇人听闻的方式,为什么不将 ImageView 添加为工具栏的子小部件?
    • 好吧...我不知道这样的事情是可能的。但这也意味着将标题更改为文本视图。 home键是怎么回事,你知道我怎样才能得到它的大小,这样我介绍的图像就不会重叠了吗?
    • 谢谢,对我来说图标太大了,用你的方法我可以改变填充: int padding = (int) (5 * getResources().getDisplayMetrics().density); iv2.setPadding(padding, padding, padding, padding);
    • 谢谢,这对于在使用非二次图像时摆脱错误的徽标布局非常有帮助。找到视图后不要忘记添加break 以避免不必要的循环;)
    猜你喜欢
    • 2015-02-04
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多