如何在工具栏中居中ImageView?
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了如何在工具栏中居中ImageView?相关的知识,希望对你有一定的参考价值。
试图在我的工具栏中居中一个徽标。当我导航到下一个活动时,会出现“up ADVance”图标,它会将我的徽标略微向右推。如何在不删除可用性图标的情况下将我的徽标保留在工具栏的中心?
这是我的工具栏标签
<android.support.v7.widget.Toolbar
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="wrap_content"
android:background="@color/primaryColor"
android:paddingTop="@dimen/app_bar_top_padding"
app:popupTheme="@style/ThemeOverlay.AppCompat.Dark"
app:theme="@style/CustomToolBarTheme">
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:src="@drawable/ic_android_logo"
android:layout_gravity="center"
android:paddingBottom="3dp"/>
</android.support.v7.widget.Toolbar>
在javadoc,它说:
一个或多个自定义视图。应用程序可能会向工具栏添加任意子视图。它们将出现在布局中的这个位置。如果子视图的Toolbar.LayoutParams指示CENTER_HORIZONTAL的重力值,则在测量完所有其他元素后,视图将尝试以工具栏中剩余的可用空间为中心。
这意味着除非您创建自定义toolbar
或删除icon
,否则您无法执行此操作。
你可以这样做,因为它适合我:
<android.support.v7.widget.Toolbar
android:id="@+id/mainToolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?attr/colorPrimary"
android:minHeight="@dimen/abc_action_bar_default_height_material">
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:gravity="center">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/headerLogo"
android:contentDescription="@string/app_name" />
</RelativeLayout>
</android.support.v7.widget.Toolbar>
您可以通过编程方式执行,这是我设法在工具栏中完全居中徽标的唯一方法。
添加到您的活动:
@Override
public void onWindowFocusChanged(boolean hasFocus){
// set toolbar logo to center programmatically
Toolbar toolbar = (Toolbar) findViewById(R.id.main_toolbar);
ImageView logo = (ImageView) findViewById(R.id.logo);
int offset = (toolbar.getWidth() / 2) - (logo.getWidth() / 2);
// set
logo.setX(offset);
}
和您的toolbar_main.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/main_toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="@color/bg_yellow"
android:elevation="4dp"
android:fontFamily="@string/font_family_thin"
app:contentInsetStartWithNavigation="0dp"
android:layout_gravity="center_horizontal">
<TextView
android:id="@+id/title_toolbar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fontFamily="@string/font_family_light"
android:textColor="@color/text_dark_xxx"
android:textSize="@dimen/text_default"
android:layout_centerVertical="true"
/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:srcCompat="@drawable/logo"
android:id="@+id/logo"
android:paddingTop="5dp" />
</android.support.v7.widget.Toolbar>
我回答这个问题有点迟,但是有很好的解决方案
<android.support.design.widget.AppBarLayout 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="wrap_content"
android:theme="@style/AppTheme.AppBarOverlay">
<FrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:contentInsetStart="0dp"
app:contentInsetEnd="0dp"
app:popupTheme="@style/AppTheme.PopupOverlay">
</android.support.v7.widget.Toolbar>
<RelativeLayout
android:layout_width="match_parent"
android:gravity="center"
android:layout_height="wrap_content">
<ImageView
android:layout_width="wrap_content"
android:layout_height="?attr/actionBarSize"
android:contentDescription="@string/app_name"
android:id="@+id/logoImageView"
android:layout_centerInParent="true"
android:adjustViewBounds="true"
android:src="@drawable/toolbar_background" />
</RelativeLayout>
</FrameLayout>
</android.support.design.widget.AppBarLayout>
这是我的toolbar_background.xml drawable
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape android:shape="rectangle">
<solid android:color="@color/colorPrimary" />
</shape>
</item>
<item>
<bitmap
android:src="@drawable/splash" android:gravity="center"
/>
</item>
将图像设置为工具栏的背景,而不是子视图。
<android.support.v7.widget.Toolbar
android:id="@+id/detail_toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:minHeight="?android:attr/listPreferredItemHeight"
android:background="@drawable/my_image"
app:theme="@style/CustomToolBarTheme">
对于使用矢量绘图或SVG图像的开发人员。 这可以是工具栏的背景,drawable_toolbar_background.xml
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape android:shape="rectangle">
<solid android:color="@color/primary"/>
</shape>
</item>
<item
android:width="@dimen/toolbar_app_icon_width"
android:height="@dimen/toolbar_app_icon_height"
android:drawable="@drawable/ic_app_logo"
android:gravity="center"/>
</layer-list>
是的,您必须修复drawable中项目的宽度和高度,尽管矢量drawable已经具有固定大小。 这是你的工具栏视图,
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@drawable/drawable_toolbar_background"
android:minHeight="?attr/actionBarSize"
android:theme="?attr/actionBarTheme"/>
您需要将AppBarLayout小部件与工具栏小部件一起使用,并将contentInsetStart
设置为0dp
。否则工具栏将在开始时大约8dp的填充(如果需要,插入导航按钮)
这是工作代码:
<android.support.design.widget.AppBarLayout
android:id="@+id/appBar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentStart="true"
android:layout_alignParentTop="true"
android:fitsSystemWindows="false"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:contentInsetStart="0dp"
app:popupTheme="@style/ThemeOverlay.AppCompat.Light">
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="left"
android:adjustViewBounds="true"
android:scaleType="centerInside"
android:src="@drawable/company_logo" />
</android.support.v7.widget.Toolbar>
</android.support.design.widget.AppBarLayout>
此外,请确保使用?attr/actionBarSize
作为工具栏的高度,因为这是默认的actionBar高度,并将调整为所有不同的屏幕尺寸。
即使存在菜单操作,最简单的解决方案是:
<androi以上是关于如何在工具栏中居中ImageView?的主要内容,如果未能解决你的问题,请参考以下文章
ImageView 不能在 RelativeLayout 中居中
如何在 Android 中单击 ImageView 时从一个片段移动到另一个片段?
Sencha Touch:如何在底部停靠的工具栏中居中对齐两个按钮?