【问题标题】:Flat ConstraintLayout with layout_constraintHeight_min for each row doesn't work每行带有 layout_constraintHeight_min 的 Flat ConstraintLayout 不起作用
【发布时间】:2019-05-01 01:27:23
【问题描述】:

我有一个我认为很常见的用例:屏幕上有多行信息。我希望实现这些视图而不必使用嵌套的 ViewGroups。每行应该有一个最小高度,但如果内容大于最小高度,则展开。内容应垂直嵌套。

看起来这个简化的例子应该可以工作:

<?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">

    <TextView
        android:id="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Row"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintTop_toTopOf="@+id/view"
        app:layout_constraintBottom_toBottomOf="@+id/view"/>

    <View
        android:id="@+id/view"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:background="#8800ff00"
        app:layout_constraintHeight_min="100dp"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintBottom_toBottomOf="@id/textView"/>

</android.support.constraint.ConstraintLayout>

我没有为每一行创建一个 ViewGroup,而是有一个带有约束的平面布局。每行的视图设置行高并且可以单击。行内的视图是布局层次结构中的兄弟,但它们在该行的视图中间垂直居中。由于我已经指定了app:layout_constraintHeight_min 并将 View 的底部锚定到内容的底部,它应该随着内容的增长而增长。

但是有一个问题:

ConstraintLayout 在行上方添加了不需要的间距!请注意,行上方不需要的间距等于内容底部与行底部之间的正确间距。

我的理论是这样的:由于 View 的底部锚定在内容的底部(TextView),它想要紧紧地粘在它旁边并紧挨着它。如果我强迫它移得更远,它会添加类似下边距的东西来实现这一点,它会添加类似的上边距以保持对称。

如何让它停止?如果不是因为顶部不需要的间距,我会拥有我需要的东西。也许有一些特殊的 ConstraintLayout 技巧,一些神奇的属性来修复这种行为。或者也许有一种完全不同的方式来使用 ConstraintLayout 来完成我想要的 UI。

我意识到使用固定高度的行会更简单,但如果内容可以增长,我不喜欢这样做。

我可以将我的 UI 更改为每行都有一个嵌套的 ConstraintLayout,但在我努力使复杂的布局完全平坦、没有多层 ViewGroups 之后,我宁愿不这样做。但是如果我找不到更好的解决方案,我会这样做,我希望在这里找到。

【问题讨论】:

  • 所以基本上你想要“wrap_content”和 min_height。
  • 文本视图的底部被约束到绿色视图的底部,但绿色视图的底部被约束到文本视图的底部。这是一个循环依赖,它正在不愉快地解决而不是抛出错误。看起来您希望绿色视图看起来像一个视图组。如果没有绿色视图,是否所有小部件都正确放置并且绿色视图只是一个包装器,或者小部件是否依赖于绿色视图的放置?该问题的答案将推动答案。
  • @TheLibrarianCz ConstraintLayout 相当于那个,是的。但是要使用wrap_content 需要额外的ViewGroups,我说过我试图避免这种情况。我尝试过使用layout_constraintHeight_default = wrap,但还没有找到让它做我想做的事情的方法。如果您有解决方案,我将不胜感激。
  • @Cheticamp 我提供的是对问题的最小可能演示。是的,绿色视图是必要的。是的,它就像一个 ViewGroup,但不是一个 ViewGroup。绿色视图有助于管理行的高度并使整个行区域可点击。如果有其他方法可以实现我列出的目标,我愿意接受建议。
  • 经过实验和研究,我找不到这个问题的答案。我放弃了,可悲的是,我正在将我完美的平面布局重构为每一行都有一个嵌套的 ConstraintLayout。也许 ConstraintLayout 的未来版本会处理这种常见的用例。

标签: android android-layout android-constraintlayout


【解决方案1】:

我认为删除最小高度并在 TextView 中添加一些边距可以做到这一点,如果可能,您可以使用约束而不是使用 match_parent

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.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">

    <TextView
        android:id="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_margin="50dp"
        android:text="Row is not column"
        android:textColor="#283858"
        app:layout_constraintBottom_toBottomOf="@+id/view"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="@+id/view"/>

    <View
        android:id="@+id/view"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:background="#8800ff00"
        app:layout_constraintBottom_toBottomOf="@id/textView"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"/>

</androidx.constraintlayout.widget.ConstraintLayout>

【讨论】:

  • 感谢您的回答!问题是,在这种情况下,我需要精确地强制执行最小高度——我的实际用例比这个例子更复杂。
  • 所以我认为即使没有内容,它也会占用一些最小高度
猜你喜欢
  • 1970-01-01
  • 2020-01-28
  • 2014-08-07
  • 2019-02-20
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2020-09-04
  • 1970-01-01
相关资源
最近更新 更多