Android RelativeLayout 中的 TextView 无法正常运行

Question

所以我有一个包含多个小部件的自定义 Header 视图。我的想法是使用 ImageView（图标）对齐 parent 开始和 ImageButton（菜单）对齐 parent 结束的框架布局。此外，ImageView 右侧的 TextView（标题）。它们应该始终可见。

在 ImageView(icon) 的右侧应该有一个 TextView（标题），其文本应该根据右侧其他小部件的可见性展开。

所以从左到右的顺序是这样的：ImageView（图标）- TextView（标题）- ImageView（未读消息）- ImageView（电池）- ImageButton（菜单）

问题是，来自 TextView 的文本位于其右侧的小部件后面，就像它在这张图片上可见：

这是我的 xml 预览：

这是实际的 xml:

<RelativeLayout 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"
android:layout_width="match_parent"
android:layout_height="58dp"
android:background="@color/view_controller_header">

<FrameLayout
    android:id="@+id/frame"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentStart="true"
    android:layout_centerInParent="true"
    android:layout_gravity="center"
    android:layout_margin="10dp">

    <ImageView
        android:id="@+id/imageViewIC"
        android:layout_width="@dimen/view_controller_header_icon_width"
        android:layout_height="@dimen/view_controller_header_icon_height"
        android:layout_gravity="center" />

    <TextView
        android:id="@+id/textViewKK"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:focusable="false"
        android:gravity="center"
        android:padding="10dp"
        android:shadowColor="@color/text_shadow"
        android:shadowDx="-1"
        android:shadowDy="-1"
        android:shadowRadius="1"
        android:textColor="@color/main_text_color"
        android:textSize="@dimen/view_controller_header_kk_texSize"
        android:visibility="gone" />

    <ProgressBar
        android:id="@+id/progressBarVC"
        style="?android:attr/progressBarStyleSmall"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:visibility="gone" />

</FrameLayout>

<TextView
    android:id="@+id/textViewDName"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_centerVertical="true"
    android:layout_gravity="center"
    android:layout_marginRight="@dimen/view_controller_header_margin2"
    android:layout_toRightOf="@id/frame"
    android:ellipsize="end"
    android:fontFamily="sans-serif"
    android:gravity="center|left"
    android:maxLines="2"
    android:textColor="@color/main_text_color"
    android:textSize="17sp"
    tools:text="This is the text that is too long .........." />


<ImageButton
    android:id="@+id/imgSubMenu"
    android:layout_width="50dp"
    android:layout_height="match_parent"
    android:layout_alignParentEnd="true"
    android:layout_gravity="center"
    android:background="?android:selectableItemBackground"
    android:scaleType="center"
    android:src="@drawable/ic_more_vert_white_24dp" />

<LinearLayout
    android:id="@+id/bat"
    android:layout_width="wrap_content"
    android:layout_height="match_parent"
    android:layout_toStartOf="@id/imgSubMenu"
    android:gravity="center"
    android:orientation="horizontal">

    <ImageView
        android:id="@+id/imageViewBattery"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_margin="3dp"
        android:layout_weight="1"
        android:scaleType="centerInside"
        android:visibility="visible"
        app:srcCompat="@drawable/ic_battery_full" />

    <TextView
        android:id="@+id/textViewBattery"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:visibility="visible"
        tools:text="100%" />

</LinearLayout>

<TextView
    android:id="@+id/unreadMessages"
    android:layout_width="22dp"
    android:layout_height="22dp"
    android:layout_centerInParent="true"
    android:layout_toStartOf="@id/bat"
    android:background="@color/color_widget_security_back_red"
    android:gravity="center"
    android:textStyle="bold"
    android:visibility="visible"
    tools:text="2" />

任何想法，为什么这段文字在那些小部件后面？如果电池和未读消息可见，我希望它调整大小，比如它分成两行而不是一行，或者显示...如果它太长..

Answer 1

可能您忘记添加如下属性文本：

android:layout_toLeftOf

android:layout_toLeftOf="@+id/imgSubMenu"

根据您的要求，您希望显示从右到左图标和从左到右菜单图标的文本，但是您添加了一个相对引用到右而不是左，因此它与右侧菜单图标重叠

Android RelativeLayout 中的 TextView 无法正常运行

Android TextView inside RelativeLayout not acting properly

android

textview

android-layout

android-relativelayout