Change Constraintlayout to LinearLayout

Viewed 2174

:)

I want to change my constraintlayout to a LinearLayout. I tried it with the green (second area) and it worked perfectly. Unfortunately, the top part doesn't work as well as the bottom part. The problem is that the red area always occupies the entire area and does not go to the toolbar. How can I make the height of the red area only up to the toolbar + distance? I don't want to change something "more" in my Toolbar XML, otherwise the layout on all other pages is wrong. Is there an option that allows android: layout_height = "match_parent- toolbar"?

I would like it to end up looking like the second picture. The red area should be at a distance from the toolbar and be at a maximum. So no matter how much content is in the red area, it should always be as large as possible by far. How can I do that? I'm really looking forward to helpful answers! Thanks in advance.

My current status:

What I want to achieve:

My try

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#ececec"
    android:orientation="horizontal">

    <androidx.cardview.widget.CardView
        android:id="@+id/cardViewMiddle"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_gravity="center"
        android:layout_marginBottom="8dp"
        android:elevation="8dp"
        android:layout_marginTop="20dp"
        android:layout_marginEnd="8dp"
        android:layout_marginStart="8dp"
        android:gravity="center"
        app:cardBackgroundColor="@color/Red"
        app:cardCornerRadius="15dp">

    </androidx.cardview.widget.CardView>

</LinearLayout>

XML

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#ececec">

    <androidx.cardview.widget.CardView
        android:id="@+id/cardViewMiddle"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_gravity="center"
        android:layout_marginBottom="8dp"
        android:elevation="8dp"
        android:layout_marginEnd="8dp"
        android:layout_marginStart="8dp"
        android:gravity="center"
        app:cardBackgroundColor="@color/Red"
        app:cardCornerRadius="15dp"
        app:layout_constraintBottom_toTopOf="@+id/cardViewCheckout"
        app:layout_constraintTop_toTopOf="parent">

    </androidx.cardview.widget.CardView>

    <androidx.cardview.widget.CardView
        android:id="@+id/cardViewCheckout"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_alignParentStart="true"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true"
        android:layout_marginStart="24dp"
        android:layout_marginEnd="24dp"
        android:layout_marginBottom="10dp"
        android:elevation="8dp"
        app:cardBackgroundColor="#fff"
        app:cardCornerRadius="15dp">


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

                <LinearLayout
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:orientation="horizontal"
                    android:layout_marginTop="5sp"
                    android:layout_marginBottom="5sp"
                    android:layout_gravity="center">

                    <TextView
                        android:id="@+id/textViewSumme"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:text="Summe "
                        android:layout_gravity="center"/>
                    <TextView
                        android:id="@+id/textViewSumme2"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:text="0,00"
                        android:layout_gravity="center"/>

                </LinearLayout>

                <Button
                    android:id="@+id/btn_user_geldaufladen"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_marginLeft="10dp"
                    android:layout_marginRight="10dp"
                    android:background="@drawable/button_order_checkout"
                    android:backgroundTint="#04C3B1"
                    android:elevation="16dp"
                    android:text="AUFLADEN"
                    android:textColor="#FFFFFF"
                    android:textStyle="bold"
                    android:layout_marginBottom="10sp"/>

            </LinearLayout>



    </androidx.cardview.widget.CardView>


</androidx.constraintlayout.widget.ConstraintLayout>

Toolbar

<androidx.coordinatorlayout.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".UserHomeActivity">

    <com.google.android.material.appbar.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:theme="@style/AppTheme.AppBarOverlay">

        <androidx.appcompat.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="45dp"
            android:background="?attr/colorPrimary"
            app:popupTheme="@style/AppTheme.PopupOverlay" />

    </com.google.android.material.appbar.AppBarLayout>

    <include layout="@layout/user_content_main"


        />

</androidx.coordinatorlayout.widget.CoordinatorLayout>
2 Answers

Try this.

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

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="#ececec"
        android:padding="16dp"
        android:orientation="vertical"
        android:layout_below="@+id/appBar"
        android:weightSum="10">

        <androidx.cardview.widget.CardView
            android:id="@+id/cardViewMiddle"
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="7"
            android:layout_gravity="center"
            android:layout_marginBottom="8dp"
            android:elevation="8dp"
            android:layout_marginEnd="24dp"
            android:layout_marginStart="24dp"
            android:gravity="center"
            app:cardBackgroundColor="#f00"
            app:cardCornerRadius="15dp"
            app:layout_constraintBottom_toTopOf="@+id/cardViewCheckout"
            app:layout_constraintTop_toTopOf="parent">

        </androidx.cardview.widget.CardView>

        <androidx.cardview.widget.CardView
            android:id="@+id/cardViewCheckout"
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="3"
            android:layout_marginStart="24dp"
            android:layout_marginEnd="24dp"
            android:layout_marginBottom="10dp"
            android:elevation="8dp"
            app:cardBackgroundColor="#fff"
            app:cardCornerRadius="15dp">


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

                <LinearLayout
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:orientation="horizontal"
                    android:layout_marginTop="5sp"
                    android:layout_marginBottom="5sp"
                    android:layout_gravity="center">

                    <TextView
                        android:id="@+id/textViewSumme"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:text="Summe "
                        android:layout_gravity="center"/>
                    <TextView
                        android:id="@+id/textViewSumme2"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:text="0,00"
                        android:layout_gravity="center"/>

                </LinearLayout>

                <Button
                    android:id="@+id/btn_user_geldaufladen"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_marginLeft="10dp"
                    android:layout_marginRight="10dp"
                    android:background="@color/colorPrimaryDark"
                    android:backgroundTint="#04C3B1"
                    android:elevation="16dp"
                    android:text="AUFLADEN"
                    android:textColor="#FFFFFF"
                    android:textStyle="bold"
                    android:layout_marginBottom="10sp"/>

            </LinearLayout>



        </androidx.cardview.widget.CardView>


    </LinearLayout>
    <com.google.android.material.appbar.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/appBar"
        >

        <androidx.appcompat.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="45dp"
            android:background="?attr/colorPrimary"
            />

    </com.google.android.material.appbar.AppBarLayout>
</RelativeLayout>

enter image description here

Could you try to replace your (include) tag with this:

<include layout="@layout/user_content_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
app:layout_behavior="com.google.android.material.appbar.AppBarLayout$ScrollingViewBehavior"
    />
Related