Constraintlayout 中的 Cardview 调整大小不符合预期

Question

我在使用此布局时遇到了问题，因为它无法正常工作。 CardView 中的 textview 会影响其他视图和卡片的大小。

但是当我看到 xml 时，其他元素不受 textview 大小的限制（或者我只是卡住了，看不到它）。

这是我的xml。在设计时，它工作正常，但在运行时，卡片宽度会调整大小。有什么想法吗？：

<?xml version="1.0" encoding="utf-8"?>
 
<androidx.cardview.widget.CardView
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:id="@+id/card_view"
android:layout_gravity="center"
android:layout_width="match_parent"
android:layout_height="wrap_content"
card_view:cardBackgroundColor="#C6C6C6"
card_view:cardCornerRadius="10dp"
card_view:cardElevation="5dp"
card_view:cardUseCompatPadding="true">

<androidx.constraintlayout.widget.ConstraintLayout
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="10dp">

<ImageView
    android:id="@+id/company_logo"
    android:layout_width="68dp"
    android:layout_height="68dp"
    android:layout_alignParentStart="true"
    android:layout_alignParentTop="true"
    android:layout_marginStart="8dp"
    android:layout_marginTop="8dp"
    android:src="@drawable/aguas_cartagena"
    android:contentDescription="@string/company_logo"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent" />

<TextView
    android:id="@+id/company_name"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentTop="true"
    android:layout_marginStart="8dp"
    android:layout_toEndOf="@+id/company_logo"
    android:text="XXX"
    android:textSize="24sp"
    app:layout_constraintStart_toEndOf="@+id/company_logo"
    app:layout_constraintTop_toTopOf="@+id/company_logo" />

<TextView
    android:id="@+id/pay_date"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_below="@+id/company_name"
    android:layout_marginTop="8dp"
    android:layout_toEndOf="@+id/company_logo"
    android:text="Fecha pago: 14-Abr-2020"
    app:layout_constraintStart_toStartOf="@+id/company_name"
    app:layout_constraintTop_toBottomOf="@+id/company_name" />

<ImageView
    android:id="@+id/icon_status"
    android:layout_width="32dp"
    android:layout_height="32dp"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintTop_toTopOf="@+id/company_name"
    app:srcCompat="@android:drawable/presence_online" />

<TextView
    android:id="@+id/pay_value"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginTop="8dp"
    android:text="$ 999.999.999"
    app:layout_constraintEnd_toEndOf="@+id/icon_status"
    app:layout_constraintTop_toBottomOf="@+id/company_name" />
 
</androidx.constraintlayout.widget.ConstraintLayout>
 
</androidx.cardview.widget.CardView>

编辑： 对于有同样问题的人，我在这个 post 中找到了解决方案（第二个接受的答案）： Use RelativeLayout as the immediate parent to CardView.

Answer 1

使用 thias xml 代码

    <androidx.cardview.widget.CardView
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:id="@+id/card_view"
android:layout_gravity="center"
android:layout_width="match_parent"
android:layout_height="wrap_content"
card_view:cardBackgroundColor="#C6C6C6"
card_view:cardCornerRadius="10dp"
card_view:cardElevation="5dp"
card_view:cardUseCompatPadding="true">

<androidx.constraintlayout.widget.ConstraintLayout
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:padding="10dp">

    <ImageView
        android:id="@+id/company_logo"
        android:layout_width="68dp"
        android:layout_height="68dp"
        android:layout_alignParentStart="true"
        android:layout_alignParentTop="true"
        android:layout_marginStart="8dp"
        android:layout_marginTop="8dp"
        android:src="@drawable/ic_phone"
        android:contentDescription="company_logo"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintBottom_toBottomOf="parent"/>

    <TextView
        android:id="@+id/company_name"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:layout_marginStart="8dp"
        android:text="XXX"
        android:textSize="24sp"
        app:layout_constraintStart_toEndOf="@+id/company_logo"
        app:layout_constraintTop_toTopOf="@+id/company_logo"
        app:layout_constraintRight_toRightOf="parent"/>

    <TextView
        android:id="@+id/pay_date"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="8dp"
        android:layout_toEndOf="@+id/company_logo"
        android:text="Fecha pago: 14-Abr-2020"
        app:layout_constraintStart_toStartOf="@+id/company_name"
        app:layout_constraintTop_toBottomOf="@+id/company_name" />

    <ImageView
        android:id="@+id/icon_status"
        android:layout_width="32dp"
        android:layout_height="32dp"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintTop_toTopOf="parent"


        app:srcCompat="@android:drawable/presence_online" />

    <TextView
        android:id="@+id/pay_value"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="8dp"
        android:text="$ 999.999.999"
        app:layout_constraintEnd_toEndOf="@+id/icon_status"
        app:layout_constraintTop_toBottomOf="@+id/company_name" />

</androidx.constraintlayout.widget.ConstraintLayout>

Answer 2

使用这个Layout it Will never overlap 很好测试：-

<?xml version="1.0" encoding="utf-8"?>
<androidx.cardview.widget.CardView
        xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        xmlns:card_view="http://schemas.android.com/apk/res-auto"
        xmlns:tools="http://schemas.android.com/tools"
        android:id="@+id/card_view"
        android:layout_gravity="center"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        card_view:cardBackgroundColor="#C6C6C6"
        card_view:cardCornerRadius="10dp"
        card_view:cardElevation="5dp"
        card_view:cardUseCompatPadding="true">

    <androidx.constraintlayout.widget.ConstraintLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:padding="10dp">

        <ImageView
                android:id="@+id/company_logo"
                android:layout_width="68dp"
                android:layout_height="68dp"
                android:layout_alignParentStart="true"
                android:layout_alignParentTop="true"
                android:layout_marginStart="8dp"
                android:layout_marginTop="8dp"
                android:src="@drawable/ic_phone"
                android:contentDescription="company_logo"
                app:layout_constraintLeft_toLeftOf="parent"
                app:layout_constraintTop_toTopOf="parent"
                app:layout_constraintBottom_toBottomOf="parent"/>

        <TextView
                android:id="@+id/company_name"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_alignParentTop="true"
                android:layout_marginStart="8dp"
                android:text="XXX"
                android:textSize="24sp"
                app:layout_constraintEnd_toStartOf="@+id/icon_status"
                app:layout_constraintRight_toRightOf="parent"
                app:layout_constraintStart_toEndOf="@+id/company_logo"
                app:layout_constraintTop_toTopOf="@+id/company_logo" />

        <TextView
                android:id="@+id/pay_date"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginTop="8dp"
                android:layout_toEndOf="@+id/company_logo"
                android:text="Fecha pago: 14-Abr-2020"
                app:layout_constraintEnd_toStartOf="@+id/pay_value"
                app:layout_constraintStart_toStartOf="@+id/company_name"
                app:layout_constraintTop_toBottomOf="@+id/company_name" />

        <ImageView
                android:id="@+id/icon_status"
                android:layout_width="32dp"
                android:layout_height="32dp"
                app:layout_constraintEnd_toEndOf="parent"
                app:layout_constraintTop_toTopOf="parent"


                app:srcCompat="@android:drawable/presence_online" />

        <TextView
                android:id="@+id/pay_value"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginTop="8dp"
                android:text="$ 999.999.999"
                app:layout_constraintEnd_toEndOf="@+id/icon_status"
                app:layout_constraintTop_toBottomOf="@+id/company_name" />

    </androidx.constraintlayout.widget.ConstraintLayout>

</androidx.cardview.widget.CardView>

Answer 3

对于遇到同样问题的人，我在这个 post 中找到了解决方案（第二个接受的答案）： Use RelativeLayout as the immediate parent to CardView

解决方案是将 Cardview 布局包含在 RelativeLayout 中：

<RelativeLayout 
    android:layout_width="match_parent" ... >
    <CardView 
        android:layout_width="match_parent" ... >
    </CardView>
</RelativeLayout>

Constraintlayout 中的 Cardview 调整大小不符合预期

Cardview in Contraint Layout resizing not as supposed

android

android-cardview