ConstraintLayout GONE 视图占用空间答案

【问题标题】：ConstraintLayout GONE view occupies spaceConstraintLayout GONE 视图占用空间
【发布时间】：2017-09-26 14:14:09
【问题描述】：

我有一个ViewHolder，顶部是标题，并且该标题在特定情况下变得可见。在大多数其他情况下，标头设置为GONE。问题是，当标题设置为 GONE 时，仍然会计算其高度，而其他视图的 spread 不同（之间有更多空间）。

这是一个布局蓝图：

蓝图说明：

标头限制为top、left 和right。
下面的两个视图位于packed chain 中，被限制在top 上的标题、ImageView 到right 以及left 和bottom 的父级。

这是来自布局检查器的屏幕截图，其中突出显示的标题视图设置为GONE：

根据文档，当设置为GONE 时，标题视图应缩小到指向仍然应用其他视图的约束，但标题不应占用布局空间并影响ConstraintLayout 的高度设置为wrap_content。

在这个检查器屏幕截图中，不清楚实际发生了什么。标题不可见，底部视图显然被限制在父顶部，但标题仍然在检查器中显示为具有指定高度的全宽。

我不确定这是否是一个错误，或者我应该强制 ConstraintLayout 重新测量自己。

XML 更新：

<?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"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">


    <TextView
        android:id="@+id/list_item_step_conversion_tv_header"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:background="@color/gray_very_light"
        android:padding="@dimen/activity_vertical_margin"
        android:text="@string/favorites"
        android:textColor="@android:color/black"
        android:textSize="@dimen/default_text_size"
        android:textStyle="bold"
        android:visibility="gone"
        tools:visibility="visible"
        app:layout_constraintHorizontal_bias="0.0"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent"/>

    <TextView
        android:id="@+id/list_item_step_conversion_tv_title"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginEnd="16dp"
        android:layout_marginLeft="16dp"
        android:layout_marginRight="16dp"
        android:layout_marginStart="16dp"
        android:layout_marginTop="8dp"
        android:ellipsize="end"
        android:maxLines="1"
        android:textColor="@color/gray_dark"
        android:textSize="@dimen/medium_text_size"
        app:layout_constraintBottom_toTopOf="@+id/list_item_step_conversion_tv_description"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toLeftOf="@+id/list_item_step_conversion_iv_favorite"
        app:layout_constraintTop_toBottomOf="@+id/list_item_step_conversion_tv_header"
        app:layout_constraintVertical_chainStyle="packed"
        tools:text="Bicycling - light (10-11.9 mph)"/>

    <TextView
        android:id="@+id/list_item_step_conversion_tv_description"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginBottom="8dp"
        android:layout_marginLeft="0dp"
        android:layout_marginRight="16dp"
        android:layout_marginTop="4dp"
        android:ellipsize="end"
        android:maxLines="1"
        android:textColor="@android:color/black"
        android:textStyle="bold"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintHorizontal_bias="0.0"
        app:layout_constraintLeft_toLeftOf="@+id/list_item_step_conversion_tv_title"
        app:layout_constraintRight_toLeftOf="@+id/list_item_step_conversion_iv_favorite"
        app:layout_constraintTop_toBottomOf="@+id/list_item_step_conversion_tv_title"
        tools:text="182 steps/minute"/>

    <ImageView
        android:id="@+id/list_item_step_conversion_iv_favorite"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginBottom="0dp"
        android:layout_marginRight="24dp"
        android:layout_marginTop="0dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/list_item_step_conversion_tv_header"
        app:srcCompat="@drawable/ic_not_liked"/>    
</android.support.constraint.ConstraintLayout>

更新 2

经过额外观察，只有在RecyclerView.Adapter 中调用notifyDataSetChanged 后才会出现此问题。这是单击其中一项的favorite 图标之前和之后的布局状态的屏幕截图。

截图说明：

在左侧，ViewHolder 可见 header 视图位于 position: 2。以上项目显示正确。
点击favorite图标（值为242的项目）后，position: 1上的ViewHolder是可见的header视图，而ViewHolder上position: 2的header视图设置为GONE。我期望ViewHolder 的高度会降低，并且与position: 0 上的ViewHolder 具有相同的高度。

考虑到这个ViewHolder 在以前的状态下将header 设置为VISIBLE，它可能有回收的东西，不确定。

【问题讨论】：

同时发布您的 xml。
@Abbas 当然，已添加。
嗯。底部项目看起来像两个 TextView 使用的是扩展链样式而不是打包的样式。今天太晚了，我无法调查这个。希望我明天可以坐下来看看。这是基于一个设备并且看起来是一样的（除了突出显示视图的红色标记，当然）？而您使用的是 ConstraintLayout 1.0.2？
嘿 Wolfram，tnx 回复。我已经用额外的屏幕截图更新了这个问题，我认为仍然使用打包链，但回收视图的高度没有减少，项目之间的实际空间比预期的要大。当然是 1.0.2 版本。
@bajicdusko 我认为这里发生的情况是该元素被正确标记为已消失，因此其他两个元素 - 因为它们位于链中 - 被重新定位以利用空间，所以展开更多（请参阅您的原始屏幕截图）。基本上，它的行为就好像布局的 wrap_content 没有被尊重或调用。由于回收视图，我怀疑有些恶作剧。

标签： android android-constraintlayout constraint-layout-chains

【解决方案1】：

在通常调用binding.executePendingBindings() 之后，我通过在适配器的#getView 末尾调用view.requestLayout()* 解决了这个问题。

*我现在使用的是老式的Adapter，所以你应该搜索RecyclerView.Adapter的等价物，可能是#onBindViewHolder()

【讨论】：

【解决方案2】：

看起来布局实际上是正确的——忽略检查器中消失对象的框架，当一个小部件被标记为消失时，我们不会再次布局它，因为它会被简单地跳过（在 Studio 中，我们做，以提供一种更简单的方法来查看正在发生的事情，但在真实设备上这样做是没有意义的）。

您使用的是哪个版本的 ConstraintLayout？我似乎在这里得到了正确的行为：

将第一个元素标记为消失后：

【讨论】：

感谢 Nicolas 的回复。我已经用额外的解释稍微更新了这个问题。首次显示 RecyclerView 时布局行为正确。回收带有可见标题的 ViewHolder 时似乎存在问题。我希望我不会在这里遗漏一些明显的东西。请查看上面的更新 2 部分。我当然用的是 1.0.2 版本。

【解决方案3】：

对我有用的是将对象的初始可见性设置为“消失”并通过代码更改其可见性。

有些是这样的：

我的 xml：

<androidx.appcompat.widget.AppCompatTextView
    android:id="@+id/tvMyobject"
    style="@style/myStyle"
    tools:text="@string/dummy_text"
    android:textAlignment="center"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    app:layout_constraintTop_toBottomOf="@id/anyotherobject"
    android:visibility="gone"
/>

我的活动：

if (isSomethingToShow) {
    tvMyobject.setVisibility(View.VISIBLE);
    tvMyobject.setText(R.string.my_string_to_show);
}

【讨论】：