如何在LinearLayout中重疊布局/視圖？

Question

我想創建如下布局：

Layout1和Layout2是嵌套在父LinearLayout的任何類型的布局。 使用layout_weight可以為兩個子布局提供50％的高度，而LinearLayout是必需的。

紅色正方形應該是與Layout1和Layout2重疊並且位於兩個布局之間的中心的Buttons 。

當然，可以通過使用RelativeLayout作為父代來實現，但是隨后我將放棄使用layout_weight的可能性...

如果我繼續使用LinearLayout ，似乎不可能讓按鈕與其他兩個布局重疊。

此外，按鈕不能是這兩種布局的同級，而是需要嵌套在負責水平定位的通用容器布局內（例如，具有水平方向的LinearLayout ）。

任何想法如何解決這個問題？

我已經嘗試將按鈕放在Layout1 （或Layout2 ）內，將它們放在底部下方，並使用android:clipChildren=false ，但這沒有任何效果。 簡單地將按鈕切成兩半。

編輯：在兩個布局50/50之間拆分高度只是一種版本。 另一個視圖使用相同的基本布局，但在兩個布局之間將高度划分為70/30。 按鈕應始終位於兩個布局之間的中心。 對不起，您沒有早點指出這一點。

布局代碼：

<!-- parent/root layout -->
<LinearLayout
    ...
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    ... >

    <!-- Layout1 -->
    <LinearLayout 
        android:layout_weight="1"
        ... />

    <!-- Buttons -->
    <LinearLayout             
        android:orientation="horizontal"
        ... >

        <Button ... />
        <Button ... />
        <Button ... />

    </LinearLayout>


    <!-- Layout2 -->
    <LinearLayout 
        android:layout_weight="1"
        ... />


</LinearLayout>

Answer 1

50％線性一個50％線性兩個

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

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

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:background="@color/colorAccent">

    </LinearLayout>
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:background="@color/colorPrimary">

    </LinearLayout>


</LinearLayout>

    <LinearLayout
        android:layout_centerInParent="true"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <View
            android:layout_weight="1"
            android:layout_width="50dp"
            android:layout_height="50dp"
             />
        <View
            android:layout_weight="1"
            android:layout_width="50dp"
            android:layout_height="50dp"
            android:background="#000" />
        <View
            android:layout_weight="1"
            android:layout_width="50dp"
            android:layout_height="50dp"
            />
        <View
            android:layout_weight="1"
            android:layout_width="50dp"
            android:layout_height="50dp"
            android:background="#000" />
        <View
            android:layout_weight="1"
            android:layout_width="50dp"
            android:layout_height="50dp"
            />
        <View
            android:layout_weight="1"
            android:layout_width="50dp"
            android:layout_height="50dp"
            android:background="#000" />
        <View
            android:layout_weight="1"
            android:layout_width="50dp"
            android:layout_height="50dp"
            />


    </LinearLayout>

</RelativeLayout>

================================================== =========================

線性70％一個30％線性兩個

閉上雙眼即可復制並粘貼

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/activity_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:weightSum="10"
    tools:context="com.ncrypted.myapplication.MainActivity">

    <LinearLayout
        android:layout_weight="6"
        android:id="@+id/linear1"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:background="@color/colorAccent"
        android:orientation="vertical">

    </LinearLayout>

    <RelativeLayout
        android:layout_weight="2"
        android:id="@+id/relative1"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:background="@color/colorAccent">

        <LinearLayout
            android:orientation="vertical"
            android:layout_width="match_parent"
            android:layout_height="match_parent">
            <View
                android:layout_width="match_parent"
                android:layout_height="0dp"
                android:background="@color/colorAccent"
                android:layout_weight="1" />
            <View
                android:layout_width="match_parent"
                android:layout_height="0dp"
                android:background="@color/colorPrimary"
                android:layout_weight="1" />


        </LinearLayout>
        <LinearLayout
            android:layout_centerInParent="true"
            android:layout_width="match_parent"
            android:layout_height="wrap_content">
            <View
                android:layout_weight="1"
                android:layout_width="50dp"
                android:layout_height="50dp"
                 />
            <View
                android:layout_weight="1"
                android:layout_width="50dp"
                android:layout_height="50dp"
                android:background="#000" />
            <View
                android:layout_weight="1"
                android:layout_width="50dp"
                android:layout_height="50dp"
                />
            <View
                android:layout_weight="1"
                android:layout_width="50dp"
                android:layout_height="50dp"
                android:background="#000" />
            <View
                android:layout_weight="1"
                android:layout_width="50dp"
                android:layout_height="50dp"
                />
            <View
                android:layout_weight="1"
                android:layout_width="50dp"
                android:layout_height="50dp"
                android:background="#000" />
            <View
                android:layout_weight="1"
                android:layout_width="50dp"
                android:layout_height="50dp"
                />
        </LinearLayout>

    </RelativeLayout>

    <LinearLayout
        android:layout_weight="2"
        android:id="@+id/linear2"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:background="@color/colorPrimary"
        android:orientation="vertical">

    </LinearLayout>

</LinearLayout>

Answer 2

嗯，如果除了在問題中描述的那些限制之外，您沒有其他限制，可以采用以下方法：

<!-- parent/root layout -->
<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent">

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

        <!-- Layout1 -->
        <LinearLayout 
            android:layout_weight="1"
             ... />

        <!-- Layout2 -->
        <LinearLayout 
            android:layout_weight="1"
            ... />

    </LinearLayout>

    <!-- Buttons -->
    <LinearLayout 
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_centerVertical="true"            
        android:orientation="horizontal"
        android:background="@android:color/transparent"
        ... >

        <Button ... />
        <Button ... />
        <Button ... />

    </LinearLayout>

</RelativeLayout>

Answer 3

在這里，這是僅使用Linearlayout的解決方案。

關鍵是：按鈕由兩部分組成。 半頂半底。 負邊距表示按鈕高度的一半。

但是，請不要使用此代碼。 使用ConstraintLayout的GuideLine 。 它具有百分比選項，因此您可以實現所需的幾乎翻滾的布局。

<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/activity_test"
    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:layout_weight="0.5"
        android:background="#d3d3d3">

        <ImageView
            android:id="@+id/imageView1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom"
            android:layout_marginBottom="-25dp"
            android:layout_weight="1"
            android:src="@mipmap/ic_launcher"/>

        <ImageView
            android:id="@+id/imageView2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom"
            android:layout_marginBottom="-25dp"
            android:layout_weight="1"
            android:src="@mipmap/ic_launcher"/>

        <ImageView
            android:id="@+id/imageView3"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom"
            android:layout_marginBottom="-25dp"
            android:layout_weight="1"
            android:src="@mipmap/ic_launcher"/>

    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_weight="0.5"
        android:background="#Ed1c24">

        <ImageView
            android:id="@+id/imageView4"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="top"
            android:layout_marginTop="-25dp"
            android:layout_weight="1"
            android:src="@mipmap/ic_launcher"/>

        <ImageView
            android:id="@+id/imageView5"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="top"
            android:layout_marginTop="-25dp"
            android:layout_weight="1"
            android:src="@mipmap/ic_launcher"/>

        <ImageView
            android:id="@+id/imageView6"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="top"
            android:layout_marginTop="-25dp"
            android:layout_weight="1"
            android:src="@mipmap/ic_launcher"/>
    </LinearLayout>


</LinearLayout>

Answer 4

在這里您可以使用：根據您的要求放置圖像視圖

<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/activity_test"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:gravity="center">

    <LinearLayout
        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:background="#e2e2"
            android:layout_weight="1"
            >

        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:background="#Ed1c24"
            android:layout_weight="1"
            >

        </LinearLayout>
    </LinearLayout>

    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@mipmap/ic_launcher"
        android:id="@+id/imageView"
        android:layout_marginStart="48dp"
        android:layout_centerVertical="true"
        />

    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@mipmap/ic_launcher"
        android:id="@+id/imageView1"
        android:layout_toEndOf="@+id/imageView"
        android:layout_marginStart="48dp"
        android:layout_centerVertical="true"
        />

    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@mipmap/ic_launcher"
        android:id="@+id/imageView3"
        android:layout_toEndOf="@+id/imageView1"
        android:layout_marginStart="38dp"
        android:layout_centerVertical="true"
        />


</RelativeLayout>