How to set Android ListView's cell height as half of cell width?

Question

I am trying to use constraint layout as below. But the aspect ratio is not respected in the actual layout. Instead, the height is actually wrapping the content inside

<android.support.constraint.ConstraintLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/content"

    android:layout_height="0dp"
    android:layout_width="match_parent"> 

        <!-- some content inside -->

</android.support.constraint.ConstraintLayout>

I then think it might be because I didn't set width="0dp" (let constraint decide the width). So I tried another way like below. But then the width becomes zero.

What is the correct way of doing it?

<android.support.constraint.ConstraintLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/content"

    android:layout_height="0dp"
    android:layout_width="0dp"
    app:layout_constraintStart_toEndOf="parent"
    app:layout_constraintEnd_toEndOf="parent"> 

        <!-- some content inside -->

</android.support.constraint.ConstraintLayout>

---

EDIT: working solution after inspired by Anddenver 's answer (with modification):

<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    xmlns:app="http://schemas.android.com/apk/res-auto">

    <FrameLayout
        android:background="@android:color/holo_green_dark"
        android:layout_width="0dp"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        android:layout_height="0dp"
        app:layout_constraintDimensionRatio="2:1">



    </FrameLayout>


</android.support.constraint.ConstraintLayout>

---

Further Edit:

It seems I need to wrap one more layer of constraint layout for my inner contents .... :

<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    xmlns:app="http://schemas.android.com/apk/res-auto">

    <FrameLayout
        android:background="@android:color/holo_green_dark"
        android:layout_width="0dp"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        android:layout_height="0dp"
        app:layout_constraintDimensionRatio="2:1">

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


            <actual contents here..../>

        </android.support.constraint.ConstraintLayout>




    </FrameLayout>


</android.support.constraint.ConstraintLayout>

Or, just remove the FrameLayout, and wrap ConstraintLayout inside a ConstraintLayout:

<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    xmlns:app="http://schemas.android.com/apk/res-auto">

    <android.support.constraint.ConstraintLayout
        android:background="@android:color/holo_green_dark"
        android:layout_width="0dp"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        android:layout_height="0dp"
        app:layout_constraintDimensionRatio="2:1">

contents here...

        </android.support.constraint.ConstraintLayout>

</android.support.constraint.ConstraintLayout>

Answer 1

You need inner view for that, for example:

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

<FrameLayout
        android:background="@color/colorPrimary"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        app:layout_constraintDimensionRatio="1:1">

    <YOUR CONTENT>

</FrameLayout>

Answer 2

对于ListView，您需要膨胀自定义list_item.xml

，它应该为H,2:1，以将高度限制为2:1的宽高比。

默认的android.R.layout.simple_list_item_1只是一个TextView：

<?xml version="1.0" encoding="utf-8"?>
<TextView
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@android:id/text1"
    android:layout_height="0dp"
    android:layout_width="0dp"
    app:layout_constraintDimensionRatio="H,2:1"
    ...
    />

请参见DimensionConstraints。