如何在两个布局上放置叠加图像视图？答案

【问题标题】：How place overlay imageview on two layouts?如何在两个布局上放置叠加图像视图？
【发布时间】：2018-05-17 16:42:27
【问题描述】：

我想构建以下屏幕，其中包含应用程序徽标、成功/失败图标图像、信息消息和确定按钮。

这是代码。我正在使用线性布局来实现这一点。

<LinearLayout
android:id="@+id/statusLinearLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:background="@android:color/white"
android:weightSum="2"
android:orientation="vertical"
xmlns:android="http://schemas.android.com/apk/res/android">
<RelativeLayout
    android:id="@+id/statusTopRelativeLayout"
    android:background="@android:color/holo_blue_bright"
    android:layout_width="match_parent"
    android:layout_height="0dp"
    android:orientation="vertical"
    android:layout_weight="1">
    <ImageView
        android:id="@+id/client_logo"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:contentDescription="@string/no_image_description"
        android:src="@drawable/client_logo"
        android:layout_centerVertical="true"
        android:layout_centerHorizontal="true"/>
</RelativeLayout>
<RelativeLayout
    android:id="@+id/statusBottomRelativeLayout"
    android:background="@android:color/holo_blue_light"
    android:layout_width="match_parent"
    android:layout_height="0dp"
    android:layout_weight="1">
    <TextView
        android:id="@+id/statusText"           
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="50dp"
        android:text="@string/statusText"
        android:textSize="50sp"/>
    <Button
        android:id="@+id/btnOk"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/statusText"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="50dp"            
        android:clickable="true"
        android:focusable="true"
        android:onClick="goToHomeScreen"
        android:paddingBottom="15dp"
        android:paddingTop="15dp"
        android:text="@string/ok"
        android:textColor="#ffffff"
        android:textSize="40sp"/>
</RelativeLayout>

如何在两个布局的顶部放置成功/失败图标图像？

【问题讨论】：

在线性（垂直）布局中添加 2 个布局。然后将此线性布局与图像一起添加到RelativeLayout 中。然后将线性布局和图像放在RelativeLayout 的中心。您在 RelativeLayout 中放置项目的顺序关系到哪个项目将位于另一个之上（如 z 轴）。

标签： android android-layout

【解决方案1】：

你可以使用约束让它变得简单

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    xmlns:app="http://schemas.android.com/apk/res-auto">

    <android.support.constraint.Guideline
        android:id="@+id/center"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:orientation="horizontal"
        app:layout_constraintGuide_percent="0.5"/>

    <ImageView
        android:layout_width="match_parent"
        android:layout_height="0dp"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintBottom_toTopOf="@id/center"
        android:background="#ffffff"/>

    <ImageView
        android:layout_width="match_parent"
        android:layout_height="0dp"
        app:layout_constraintTop_toTopOf="@id/center"
        app:layout_constraintBottom_toBottomOf="parent"
        android:background="#00ffff"/>

    <ImageView
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:background="#ff8801"
        app:layout_constraintTop_toTopOf="@id/center"
        app:layout_constraintBottom_toBottomOf="@id/center"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toEndOf="parent" />

</android.support.constraint.ConstraintLayout>

输出：

【讨论】：

【解决方案2】：

试试这个

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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="match_parent"
    android:orientation="vertical">


    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">

        <LinearLayout
            android:id="@+id/nilu"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:background="@color/colorPrimary"
            android:orientation="vertical"
            android:paddingBottom="30dp">


            <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:gravity="center"
                android:text="NILU" />

            <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:gravity="center"
                android:text="NILU" />

            <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:gravity="center"
                android:text="NILU" />


        </LinearLayout>

        <LinearLayout
            android:id="@+id/nilu2"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_below="@id/nilu"
            android:layout_weight="1"
            android:background="@color/colorAccent"
            android:orientation="vertical">


            <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:gravity="center"
                android:text="NILU" />

            <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:gravity="center"
                android:text="NILU" />

            <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:gravity="center"
                android:text="NILU" />

        </LinearLayout>
    </LinearLayout>


    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_centerInParent="true"
        android:orientation="horizontal">

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerInParent="true"
            android:src="@mipmap/ic_launcher_round" />


    </RelativeLayout>


</RelativeLayout>

输出

【讨论】：

谢谢，@Nilesh Rathod 对您的解决方案进行了细微更改，我已完成更改。

【解决方案3】：

父类相对布局

将子 LinearLayout 添加为 fillParent 并分配 weightsum 2. 添加两个每个布局有 1 个权重。（为每个添加单独的实现根据您的要求进行布局。）
在亲戚中添加第二个孩子布局为该好标志的图像视图/按钮并将其设置为中心父母。

这将解决您的问题

【讨论】：