Android 如何右对齐工具栏上的图像

Question

我在 activity 中使用 ToolBar。我想右对齐用户的个人资料图片。我已经使用了 android:layout_alignParentRight="true" 但它不起作用。

1. XML

<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent">

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

    <!--Top Toolbar-->
    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar_top"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:background="#3f5e7e"
        android:elevation="6dp"
        android:minHeight="?attr/actionBarSize"
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
        app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
        >
    <com.sevenhorse.View.CircularImageView
        android:id="@+id/profile"
        android:layout_width="40sp"
        android:layout_height="40sp"
        android:layout_alignParentRight="true"
        android:foregroundGravity="right"
        />
       <!-- android:layout_centerVertical="true"-->
    </android.support.v7.widget.Toolbar>

    <android.support.design.widget.TabLayout
        android:id="@+id/tab_layout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/toolbar_top"
        android:background="#fbae38"
        android:elevation="6dp"
        android:minHeight="?attr/actionBarSize"
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
        app:tabGravity="fill"
        app:tabMode="fixed"/>


    <android.support.v4.view.ViewPager
        android:id="@+id/pager"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_above="@+id/reltv_footer"
        android:layout_below="@+id/tab_layout"></android.support.v4.view.ViewPager>

    <RelativeLayout
        android:id="@+id/reltv_footer"
        android:layout_width="match_parent"
        android:layout_height="50sp"
        android:layout_alignParentBottom="true"
        android:background="#2b4d72">

        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentRight="true"
            android:layout_centerVertical="true"
            android:padding="20sp" />

        <ImageView
            android:id="@+id/img_Profile"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentRight="true"
            android:layout_centerVertical="true"
            android:background="#2b4d72"
            android:padding="15sp"
            android:src="@drawable/more_option" />

        <View
            android:id="@+id/img_view"
            android:layout_width="3sp"
            android:layout_height="fill_parent"
            android:layout_toLeftOf="@+id/img_Profile"
            android:background="#335980" />

        <LinearLayout
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:layout_toLeftOf="@+id/img_view"
            android:background="#2b4d72"
            android:gravity="left"
            android:orientation="horizontal">

            <ImageView
                android:id="@+id/home"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentRight="true"
                android:layout_centerVertical="true"
                android:background="#203b58"
                android:padding="15sp"
                android:src="@drawable/home" />

            <View
                android:layout_width="2sp"
                android:layout_height="fill_parent"
                android:layout_toLeftOf="@+id/img_Profile"
                android:background="#203b58" />

            <ImageView
                android:id="@+id/friendrequest"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentRight="true"
                android:layout_centerVertical="true"
                android:padding="15sp"
                android:src="@drawable/friend_req" />

            <View
                android:layout_width="2sp"
                android:layout_height="fill_parent"
                android:layout_toLeftOf="@+id/img_Profile"
                android:background="#203b58" />

            <ImageView
                android:id="@+id/message"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentRight="true"
                android:layout_centerVertical="true"
                android:padding="15sp"
                android:src="@drawable/meg" />

            <View
                android:layout_width="2sp"
                android:layout_height="fill_parent"
                android:layout_toLeftOf="@+id/img_Profile"
                android:background="#203b58" />

            <ImageView
                android:id="@+id/notification"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentRight="true"
                android:layout_centerVertical="true"
                android:padding="15sp"
                android:src="@drawable/footer_notification" />
        </LinearLayout>
    </RelativeLayout>

    <RelativeLayout
        android:id="@+id/reltv_Menu"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_above="@+id/reltv_footer"
        android:layout_alignParentRight="true"
        android:background="#ffffff"
        android:visibility="gone">

        <ListView
            android:id="@+id/listviewmoroption"
            android:layout_width="200sp"
            android:layout_height="wrap_content"
            android:divider="#6d6d6d"
            android:dividerHeight="1sp"></ListView>
    </RelativeLayout>
</RelativeLayout>

<FrameLayout
    android:id="@+id/content_frame"
    android:layout_width="match_parent"
    android:layout_height="match_parent" />

<LinearLayout
    android:id="@+id/left_drawer"
    android:layout_width="wrap_content"
    android:layout_height="match_parent"
    android:layout_gravity="right"
    android:background="@android:color/white"
    android:choiceMode="singleChoice"
    android:orientation="vertical">

    <include layout="@layout/cust_rightnavigationdrawer" />
</LinearLayout>

2.ScreenShot

如何将图像与工具栏的右端对齐？

Answer 1

您只能在 RelativeLayout 中使用 android:layout_alignParentRight="true"，而 Toolbar 是一个简单的 ViewGroup。为了实现对齐，在Toolbar里面加一个RelativeLayout然后把ImageView移到里面：

<android.support.v7.widget.Toolbar
        ...
        >
    <RelativeLayout
        ...>
        <com.sevenhorse.View.CircularImageView
            ...
            android:layout_alignParentRight="true"
            ...
        />

    </RelativeLayout>

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

Answer 2

尽量给android:layout_gravity="right"

<com.sevenhorse.View.CircularImageView
        android:id="@+id/profile"
        android:layout_width="40sp"
        android:layout_height="40sp"
        android:foregroundGravity="right"
        android:layout_gravity="right"
        android:layout_alignParentRight="true"
        />

Answer 3

你可以在其中放置任何布局，如线性布局、框架布局，它都可以正常工作

布局宽度应与父级匹配

Answer 4

在工具栏中添加 RelativeLayout 然后使用 android:layout_alignParentRight="true" 和 CircularImageView

<!--Top Toolbar-->
<android.support.v7.widget.Toolbar
    android:id="@+id/toolbar_top"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentTop="true"
    android:background="#3f5e7e"
    android:elevation="6dp"
    android:minHeight="?attr/actionBarSize"
    android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
    app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
    >

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <com.sevenhorse.View.CircularImageView
            android:id="@+id/profile"
            android:layout_width="40sp"
            android:layout_height="40sp"
            android:layout_alignParentRight="true"
            android:foregroundGravity="right"
            />
           <!-- android:layout_centerVertical="true"-->

   </RelativeLayout>

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

Answer 5

接受的答案仅在 layout_width="match_parent" 时有效，但此操作还 overshadows/hides 工具栏标题。 同时显示图像和工具栏标题的唯一方法是将相对布局的宽度设置为固定长度，这对大多数人来说并不理想人们。即使这样，相对布局 也不会右对齐 .

我的解决方法
将相对布局宽度设置为 layout_width="match_parent"（这会隐藏工具栏标题），然后在其中添加一个普通的 textview 和 alignParentStart="true"
然后在主要 activity 中，将 toolbar.setTitle("my_title") 替换为 textView.setText("my_title")

即

<androidx.appcompat.widget.Toolbar android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@color/colorPrimary"
    android:minHeight="?attr/actionBarSize"
    android:theme="@style/AppTheme.AppBarOverlay"
    app:popupTheme="@style/AppTheme.PopupOverlay">
    <RelativeLayout android:id="@+id/toolbar_item_container"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <!--The Title Bar -->
        <TextView android:id="@+id/title_bar"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            style="@style/heading"
            android:textColor="@color/white"
            android:layout_alignParentStart="true" />

        <!--The Inbox-->
        <RelativeLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:clickable="true"
            android:focusable="true"
            android:foreground="?android:attr/selectableItemBackground"
            android:layout_marginEnd="@dimen/layout_margin"
            android:layout_toLeftOf="@+id/switchhouse_panel">
            <ImageView android:id="@+id/house_admin_messages"
                android:layout_width="25dp"
                android:layout_height="25dp"
                android:cropToPadding="true"
                android:scaleType="centerCrop"
                app:srcCompat="@drawable/ic_email_white_24dp"
                android:layout_alignParentTop="true"/>
            <ImageView
                android:layout_width="wrap_content"
                android:layout_height="20dp"
                android:background="@drawable/circle_custom"
                android:backgroundTint="@color/green"
                android:cropToPadding="true"
                android:layout_marginStart="20dp"/>
        </RelativeLayout>

        <!--The Switch-->
        <RelativeLayout android:id="@+id/switchhouse_panel"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:clickable="true"
            android:focusable="true"
            android:foreground="?android:attr/selectableItemBackground"
            android:layout_marginStart="@dimen/layout_margin"
            android:layout_alignParentRight="true">
            <ImageView android:id="@+id/house_cover_thumbnail"
                android:layout_width="30dp"
                android:layout_height="30dp"
                android:background="@drawable/circle_custom"
                android:cropToPadding="true"
                android:scaleType="centerCrop"
                android:layout_alignParentTop="true"/>
            <ImageView
                android:layout_width="20dp"
                android:layout_height="20dp"
                android:background="@drawable/circle_custom"
                android:padding="3dp"
                app:srcCompat="@drawable/ic_cached_black_24dp"
                android:cropToPadding="true"
                android:layout_marginStart="20dp"/>
        </RelativeLayout>
    </RelativeLayout>
</androidx.appcompat.widget.Toolbar>

主要Activity

TextView title_bar = findViewById(R.id.title_bar);
title_bar.setText("Manage Property");

Android 如何右对齐工具栏上的图像

How to right Align the image on the Toolbar in Android

android

android-layout

android-toolbar