android 工作室：在 RoundedImageView 顶部居中 ProgressPar

Question

我正在开发一个聊天应用程序，用户可以在其中向其他用户发送 Texts/Images。因此，如果发件人是当前用户，则消息 (text/Image) 将出现在页面右侧。如果当前用户是接收者，则消息会出现在左侧。像这样：

我想在两边的图像中心添加进度条。（用于加载图像）。这是右边的XML：

<RelativeLayout
        android:layout_width="@dimen/_280sdp"
        android:layout_alignParentEnd="true"
        android:layout_height="wrap_content">

        <com.makeramen.roundedimageview.RoundedImageView
            android:id="@+id/imageIV"
            android:layout_width="200dp"
            android:layout_height="200dp"
            android:scaleType="centerCrop"
            android:layout_alignParentEnd="true"
            android:adjustViewBounds="true"
            app:riv_corner_radius="15dp"
            android:layout_below="@+id/date"
            android:src="@drawable/ic_baseline_image_24"
            />

        <ProgressBar
            android:visibility="gone"
            android:id="@+id/pb"
            android:layout_width="30dp"
            android:layout_height="30dp"
            android:layout_alignStart="@+id/imageIV"
            android:layout_alignBottom="@+id/imageIV"
            android:layout_alignParentTop="true"
            android:layout_alignParentEnd="true"
            android:layout_marginStart="85dp"
            android:layout_marginTop="85dp"
            android:layout_marginEnd="85dp"
            android:layout_marginBottom="85dp" />

        <LinearLayout
            android:orientation="vertical"
            android:id="@+id/message_wrapper"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_below="@+id/imageIV"
            android:padding="@dimen/_5sdp"
            android:layout_alignParentEnd="true"
            android:background="@drawable/background_right"
            android:layout_marginTop="10dip">
        <TextView
            android:id="@+id/show_message"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="hello"
            android:visibility="gone"
            android:textSize="18sp"
            android:textColor="#fff"
            android:paddingLeft="5dp"
            android:paddingRight="5dp"/>

        <TextView
            android:id="@+id/messageTime"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:paddingLeft="8dp"
            android:paddingRight="8dp"
            android:text="time"
            android:textColor="#fff"
            android:textSize="10dp" />

        </LinearLayout>
        <TextView
            android:id="@+id/date"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="date"
            android:layout_alignParentEnd="true"
            android:textColor="#AEAEAE"
            android:paddingEnd="@dimen/_5sdp"
            android:textSize="8dp" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/txt_seen"
            android:paddingTop="@dimen/_5sdp"
            android:layout_below="@+id/message_wrapper"
            android:layout_alignParentRight="true"
            android:layout_alignParentEnd="true"
            />
    </RelativeLayout>

这是左侧的XML：

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="@dimen/_280sdp"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:padding="5dp"
    android:id="@+id/messageLayout"
    android:layout_height="wrap_content">
    <de.hdodenhof.circleimageview.CircleImageView
        android:id="@+id/profile_image"
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:padding="@dimen/_3sdp"
        android:src="@drawable/pl"/>
    <com.makeramen.roundedimageview.RoundedImageView
        android:id="@+id/imageIV"
        android:layout_width="200dp"
        android:layout_height="200dp"
        android:scaleType="centerCrop"
        android:layout_toEndOf="@+id/profile_image"
        android:adjustViewBounds="true"
        app:riv_corner_radius="15dp"
        android:layout_below="@+id/date"
        android:src="@drawable/ic_baseline_image_24"
        />
    <ProgressBar
        android:id="@+id/pb"
        android:layout_width="30dp"
        android:layout_height="30dp"
        android:layout_alignStart="@+id/imageIV"
        android:layout_alignBottom="@+id/imageIV"
        android:layout_marginStart="85dp"
        android:layout_marginTop="85dp"
        android:layout_marginEnd="85dp"
        android:layout_marginBottom="85dp" />

    <LinearLayout
        android:id="@+id/message_wrapper"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:padding="@dimen/_5sdp"
        android:layout_below="@+id/imageIV"
        android:layout_toEndOf="@id/profile_image"
        android:background="@drawable/background_left"
        android:layout_marginTop="10dip">
        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:orientation="vertical">
    <TextView
        android:id="@+id/show_message"
        android:visibility="gone"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="5dp"
        android:textSize="18sp"
        android:text="Hello"
        android:paddingLeft="5dp"
        android:paddingRight="5dp"
        />

    <TextView
        android:id="@+id/messageTime"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="time"
        android:paddingLeft="8dp"
        android:paddingRight="8dp"
        android:textSize="8dp" />
    </LinearLayout>
    </LinearLayout>


    <TextView
        android:id="@+id/date"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="date"
        android:layout_toRightOf="@+id/profile_image"
        android:textColor="#AEAEAE"
        android:paddingRight="@dimen/_5sdp"
        android:textSize="8dp" />
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/txt_seen"
        android:paddingTop="@dimen/_5sdp"
        android:visibility="gone"
        android:layout_below="@+id/message_wrapper"
        />
</RelativeLayout>

我该怎么做？请帮忙

Answer 1

您可以为右侧布局添加额外的进度 layout_alignEnd/layout_alignTop 属性：

    <ProgressBar
    android:id="@+id/pb"
    android:layout_width="30dp"
    android:layout_height="30dp"
    android:layout_alignStart="@+id/imageIV"
    android:layout_alignBottom="@+id/imageIV"
    android:layout_alignEnd="@+id/imageIV"
    android:layout_alignTop="@+id/imageIV" />

和layout_alignTop/layout_alignEnd 左侧布局：

    <ProgressBar
    android:id="@+id/pb"
    android:layout_width="30dp"
    android:layout_height="30dp"
    android:layout_alignStart="@+id/imageIV"
    android:layout_alignBottom="@+id/imageIV"
    android:layout_alignTop="@+id/imageIV"
    android:layout_alignEnd="@+id/imageIV"
    />

android 工作室：在 RoundedImageView 顶部居中 ProgressPar

android studio: center ProgressPar on top of RoundedImageView

android-progressbar