layout_constraintGuide_percent doesnt work - android

Question

I'm using ConstraintLayout. I want to split the page in two colors and I want to have a layout that on whole screen with 70% of height.

this is my code:

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout 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 xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:weightSum="2"
        android:orientation="vertical" >

        <android.support.v7.widget.CardView android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            app:cardBackgroundColor="@color/wikitude_primary">

        </android.support.v7.widget.CardView>

        <LinearLayout android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="#fff"></LinearLayout>


    </LinearLayout>

    <android.support.constraint.Guideline
        android:layout_width="wrap_content"
        android:layout_height="0dp"
        android:id="@+id/guideline"
        android:orientation="vertical"
        app:layout_constraintGuide_percent="0.8"/>


</android.support.constraint.ConstraintLayout>

but app:layout_constraintGuide_percent doesn't work.

I want to make a view like this:

https://www.pinterest.com/pin/189995678015932713/

Answer 1

There are are few things wrong about your layout. Most notably, you don't set the constraints to the guideline. Try the following layout that produces this image in the Android Studio designer. I added the text view to identify the sections, but they are not needed otherwise.

activity_main.xml

<android.support.constraint.ConstraintLayout 
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:orientation="vertical"
        android:weightSum="2"
        app:layout_constraintBottom_toTopOf="@id/guideline"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent">

        <android.support.v7.widget.CardView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            app:cardBackgroundColor="@color/wikitude_primary">

            <TextView
                android:id="@+id/textView"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:text="CardView"
                android:textSize="24sp"
                android:textStyle="bold" />
        </android.support.v7.widget.CardView>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="#fff"
            android:gravity="center"
            android:orientation="vertical">

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Bottom LinearLayout"
                android:textSize="24sp"
                android:textStyle="bold" />
        </LinearLayout>

    </LinearLayout>

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


</android.support.constraint.ConstraintLayout>