Question

我想创建如下所示的布局：

Layout1和Layout2是一些嵌套在父LinearLayout中的任何类型的布局。 LinearLayout是必要的，可以使用layout_weight为子布局提供50％的高度。

红色方块应为Buttons，与Layout1和Layout2重叠，并在两个布局之间居中。

当然，这可以通过使用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％linearOne 50％linearTwo

    <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％linearOne 30％linearTwo

闭上眼睛复制并粘贴

<?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。

的解决方案

关键点是：按钮由两部分组成。半顶半底。减去边距意味着按钮高度的一半。

但是，请不要使用此代码。使用GuideLine of ConstraintLayout。它有百分比选项，因此您可以实现您想要的几乎外翻的布局。

<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>

如何重叠LinearLayout中的布局/视图？

4 个答案: