android - programacion - ¿Cómo puedo colocar un botón entre dos diseños?

listview con botones android studio

Question

Estoy tratando de colocar un botón entre dos diseños.

Además, no quiero tener que hacer esto con un margen si puedo evitarlo, cuando comienzas a lidiar con diferentes tamaños de pantalla. Se rompe el margen. (En esta imagen, intento posicionar el botón verde entre dos diseños)

    <?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_height="fill_parent"
    android:layout_width="fill_parent"
    android:background="@color/busy_white">

    <LinearLayout
        android:orientation="vertical"
        android:layout_height="wrap_content"
        android:layout_width="fill_parent"
        android:gravity="center">

        <ImageButton
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/profile_default_round"
            android:background="@drawable/ring_status_clock_in"/>

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="John Doe"/>

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Manager"/>

    </LinearLayout>

    <RelativeLayout
        android:orientation="horizontal"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:background="@color/translucent_black_90"
        android:padding="16dp">

        <LinearLayout
            android:orientation="vertical"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:gravity="center"
            android:layout_alignParentLeft="true">

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Today Total"/>

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="08:32"/>

        </LinearLayout>

        <LinearLayout
            android:orientation="vertical"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:gravity="right"
            android:layout_alignParentRight="true">

            <TextView
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:text="Week Total"
                android:gravity="right"/>

            <TextView
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:text="24:32"
                android:gravity="center"/>

        </LinearLayout>

        <LinearLayout
            android:orientation="vertical"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="-40dp">

        </LinearLayout>

        </RelativeLayout>

    <include layout="@layout/dashboard_clock_in_button" />

</LinearLayout>

Answer 1

Creo que deberías intentar utilizar RelativeLayout en el que pondrás tus dos diseños y tu botón. Pero si desea colocar el botón en la parte superior de los dos diseños, debe colocarlo en su RelativeLayout último debido al orden z, y luego usar el atributo XML android:centerInParent .

Entonces su diseño sería algo como lo siguiente:

<RelativeLayout ...
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <LinearLayout ...
        android:id="@+id/myLayout1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true" > <!-- Or wherever you want to position this layout -->
        ...
    </LinearLayout>
    <LinearLayout ...
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@id/myLayout1" > <!-- Or wherever you want to position this layout -->
        ...
    </LinearLayout>
    <Button ...
        android:layout_centerInParent="true" />
</RelativeLayout>

Answer 2

Este tipo de IU requiere la superposición de varias capas.
Entonces FrameLayout es el héroe aquí.

Para dar una idea básica de lo que deseamos lograr, podemos bocetar la pantalla y decidir ubicaciones
FL es el contenedor principal que será un FrameLayout.
Necesitas hacer un botón de altura fija. Digamos que BL es de altura bl dp.
Simplemente proporcione un MarginBottom de longitud bl / 2 dp a LinearLayout LL .
Donde LL es el contenedor que contendría la imagen de perfil y las obras.

El archivo de diseño se verá así

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@android:color/white"
    android:orientation="vertical"
    tools:context=".MainActivity">

    <LinearLayout
        android:id="@+id/ConcernedPortionofScreen"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="0.4"
        android:orientation="vertical">

        <!-- Parent FrameLayout ''FL'' -->
        <FrameLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent">

            <!-- This is Layout ''LL''
                 This is where you will place your image & the nice bg
            -->
            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_marginBottom="25dp"
                android:background="#b2ebf2" />

            <!-- BL = 50dp -->
            <Button
                android:layout_width="100dp"
                android:layout_height="50dp"
                android:layout_gravity="bottom|center_horizontal"
                android:background="#558b2f"
                android:text="@android:string/ok"
                android:textSize="18sp"
                android:textColor="@android:color/white" />
        </FrameLayout>
    </LinearLayout>

    <LinearLayout
        android:id="@+id/RestofScreen"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="0.6"
        android:orientation="vertical" />

</LinearLayout>

La salida se verá así