ConstraintLayout shows bad layout on preview even though on blueprint is ok

657 views Asked by At

My layout looks likes this:

<android.support.v7.widget.CardView
    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="wrap_content"
    android:background="@color/silver"
    >

    <android.support.constraint.ConstraintLayout
        android:id="@+id/newsListItemView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        >

        <ImageView
            android:id="@+id/ivImage"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:adjustViewBounds="false"
            android:scaleType="centerCrop"
            android:src="@drawable/sample_picture"
            app:layout_constraintHorizontal_bias="0.43"
            app:layout_constraintLeft_toLeftOf="parent"
            app:layout_constraintRight_toRightOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            tools:layout_height="150dp">
        </ImageView>

        <ImageButton
            android:id="@+id/btnLike"
            android:layout_width="48dp"
            android:layout_height="48dp"
            android:layout_marginEnd="16dp"
            android:layout_marginTop="8dp"
            android:background="@drawable/bg_oval_vd_wrap"
            app:layout_constraintBottom_toBottomOf="@+id/ivImage"
            app:layout_constraintRight_toRightOf="parent"
            app:layout_constraintTop_toBottomOf="@+id/ivImage"
            app:srcCompat="@drawable/ic_hearth_off"/>

        <TextView
            android:id="@+id/tvDate"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginStart="16dp"
            android:layout_marginTop="8dp"
            android:text="TextView"
            app:layout_constraintLeft_toLeftOf="parent"
            app:layout_constraintTop_toBottomOf="@+id/btnLike"/>

        <TextView
            android:id="@+id/tvVotes"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginEnd="16dp"
            android:layout_marginTop="8dp"
            android:text="TextView"
            app:layout_constraintRight_toRightOf="parent"
            app:layout_constraintTop_toBottomOf="@+id/btnLike"/>

        <TextView
            android:id="@+id/tvContent"
            android:layout_width="288dp"
            android:layout_height="wrap_content"
            android:layout_marginBottom="16dp"
            android:layout_marginEnd="16dp"
            android:layout_marginStart="16dp"
            android:layout_marginTop="16dp"
            android:text="TextView"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintHorizontal_bias="0.52"
            app:layout_constraintLeft_toLeftOf="parent"
            app:layout_constraintRight_toRightOf="parent"
            app:layout_constraintTop_toBottomOf="@+id/tvDate"/>

    </android.support.constraint.ConstraintLayout>

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

Here is preview how it looks like:

enter image description here

As you can see layout on blueprint (right side) is rendered correctly. On preview (also on real device), like button (white button with hearth inside) has bad position even though it's outline is shown correctly. How can I fix it? Is it proper behaviour? I'm using ConstraintLatout beta 4. Should I report this to google?

1

There are 1 answers

2
amorenew On

i tried on a sample project and i didn't found the same issue as i think it's related to

    android:layout_width="0dp"
    android:layout_height="0dp"
    app:layout_constraintHorizontal_bias="0.43"
    app:layout_constraintTop_toTopOf="parent"
    tools:layout_height="150dp"

layout_constraintHorizontal_bias can work if you added layout_constraintBottom_toBottomOf="parent" but it's not achieving what you want

the better solution is to add
android:layout_height="150dp" not tools:layout_height="150dp" and remove app:layout_constraintHorizontal_bias="0.43"