问题标签 [constraint-layout-chains]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
4 回答
28974 浏览

android - 在 ConstraintLayout 中对视图进行分组以将它们视为单个视图

我需要对ConstraintLayout. 我想将这些视图分组并继续编辑,而 Android Studio 中的布局设计器将它们视为单个视图。有没有办法做到这一点而不用ViewGroup(另一种布局)实际包装视图?如果需要这样的包装器,也许有一个包装器布局,它ConstraintLayout允许对对象进行分组,而无需创建像RelativeLayout

0 投票
5 回答
11752 浏览

android - ConstraintLayout 链和文本省略号 + 右侧的图像

2020 年 7 月更新:

在下面的答案中添加了信息,以更详细地解释为什么/做constrainedWidth/Height什么以及何时适用于使用它们。

2018 年 7 月更新:

如果您正在使用ConstraintLayout 1.1.0,则要使用的正确属性将app:layout_constrainedWidth="true"代替旧的app:layout_constraintWidth_default="wrap"(和高度对应物)。请参阅更新的答案。

2017 年 11 月更新:

如果您使用的是ConstraintLayout 1.0.0稳定版(或更高版本)(此时为 1.0.2),请参阅更新后的答案以获得更简单的解决方案,而无需嵌套布局。

原始问题:

使用ConstraintLayouts-Beta3于 2016 年 11 月 3 日发布。(来源

我正在尝试执行以下操作:

我通过这样的布局实现了这一点:

这看起来不错,但是当文本长于可用空间时……</p>

文本视图具有指定这些的样式:

所以它应该可以工作,但我不确定我需要什么约束才能让图像滑动到右边然后在那里让文本视图明白没有更多空间。

我错过了什么?

注意:如果我将 textview 的宽度设置为 0dp,它可以工作,但是图像总是在右边(水平偏差似乎被忽略了)

注意2:我也用beta2试过这个,事实上,看起来Beta3在可视化编辑器中有一个bug

更新:我试图在 Xcode/AutoLayout 中复制它:

这是短文本的外观

短文本

现在同样的布局,我只是在文本视图中输入一个长文本……</p>

长文本

如您所见,图像视图的轨迹(右)约束说:您是距右边距8 点或更多点。

它也固定在标签 (textView) 的左侧。

根据我刚刚从 Twitter 中了解到的情况,目前这在 Android 的 ConstraintLayout 上可能是不可能的: Source

0 投票
2 回答
10835 浏览

android-constraintlayout - 如何在 android studio 中通过设计添加约束布局的 Chains 功能

我在约束布局中有两个图像。我想在 android studio 的设计页面中使用链功能,但我找不到代表链功能的图标或菜单。

0 投票
1 回答
2265 浏览

android - ConstraintLayout beta5 wrap_content 没有正确换行

我在 RecyclerView 中有一个 ViewHolder 的 XML 布局。

此布局的根是一个 ConstraintLayout,其高度设置为wrap_content

在这个扁平的层次结构中,有 3 个文本视图和一个固定高度的图像视图;考虑到:

这是一个相对简单的布局。beta4这是它在设计器中的外观(最终在运行时,每个 recyclerView 单元格):

Beta4

为“繁文缛节”道歉,但这是 NDA 等等。

话虽如此,要素是:

3 个文本视图(带有漂亮紫色背景的红色胶带) 高度为 150dp 的 ImageView 是灰色的。

紫色背景应用于根 ConstraintLayout。都不错。

现在这就是它的外观,无需对 Beta 5 进行任何修改:

Beta5

如您所见,紫色(根)约束布局现在“混乱”,不再像以前那样包装内容。

我尝试过的事情:

  1. 添加app:layout_constraintHeight_default="wrap"到 ConstraintLayout (并且也传播)。没有什么不同。

  2. ImageView 有一个app:layout_constraintBottom_toBottomOf="parent"我尝试删除的约束,也没有任何区别。

  3. 恢复到 beta4 :)

作为记录,这是完整的布局(由于繁文缛节的原因,id 已被重命名,并且由于相同的原因,没有 tools:text 或类似内容)。其他方面的布局完全相同。

我应该做一些不同的事情吗?(我知道我可以用 RelativeLayout 替换它,并且可能会这样做,但无论如何……我相信ConstraintLayout!):)

0 投票
1 回答
2486 浏览

android - 约束布局隐藏带有链权重的视图

嗨,

我想让 2 个视图在 ConstraintLayout 中均匀分布屏幕宽度。使用链条和重量来实现这一目标。

现在我想隐藏右视图和左视图以填充宽度。

由于可见性行为,我认为这可以开箱即用

但是由于左侧按钮对右侧按钮有约束,因此它不会增长。

任何想法如何解决这个问题?

0 投票
16 回答
20259 浏览

android-layout - 无法在 Android Studio 中的两个视图/小部件之间形成链

当我在 Android Studio 中使用布局编辑器并尝试使用约束锚点在EditText 视图按钮 视图之间创建链(双向约束)时,它不会创建链。

如果我尝试将一个视图约束到另一个视图,它只会产生约束。

我正在尝试将EditText的右侧链接到Button的左侧。

这是我的布局编辑器的样子:

布局编辑器

0 投票
13 回答
73439 浏览

android - 如何在约束布局上实现重叠/负边距?

是否可以在约束布局上实现负边距以实现重叠?我试图让图像以布局为中心并有一个文本视图,使其与 x dp 重叠。我尝试设置负边距值但没有运气。如果有办法实现这一点,那就太好了。

0 投票
2 回答
9041 浏览

android - 在约束布局android中添加填充时视图消失

我正在尝试使用 ConstraintLayout 创建一个由四个圆圈组成的垂直链。它渲染得很好,直到我向 ConstraintLayout 添加填充,此时整个视图都丢失了。

我的布局文件内容如下

圈子.xml

我看到的输出是

带填充的结果视图

如果我删除

安卓:填充=“10dp”

从 ConstraintLayout 中,它按预期工作。

没有填充的结果视图

此外,如果我从圈 3 中删除左右约束,它工作正常。但是,这是我在我的应用程序中的一个非常精简的版本。我尝试从那里的 circle3 中删除左右约束,但它仍然无法正常工作。我需要那里的填充物。如果有人可以让我知道它为什么会这样,这将有助于解决最初的问题。

0 投票
0 回答
600 浏览

android-constraintlayout - 如何使用带有垂直居中行标签的 ConstraintLayout 创建方形网格?

我需要为左侧的行创建一个带有标签的方形网格。网格应使用设备上的全部可用空间,同时保持宽度=高度。因为这个网格有几行和几列自动调整,我认为使用自定义ConstraintLayout会满足这个要求。

在下面的代码中,它用于“纵向”布局,如​​果我将 SCFrame 视图的 layout_width 设置为

  • match_parent: 格子的大小和预期的一样,但是and字段gravity的并没有应用textView10textView11
  • wrap_content: 网格折叠到 0dpx0dp
  • 0dp:与 相同wrap_content,在我看来,这与ConstraintLayout“使用 0dp,相当于MATCH_CONSTRAINT”的文档不符
  • xxxdp: SCFrame 网格是正方形,width=xxxdp 和 height=xxxdp,and字段gravity的应用正确textView10textView11

我应该在以下代码中更改什么以获得一个正方形的网格并使用屏幕的整个宽度(无论使用什么设备并为标签列留出空间)并且gravity标签正确?

这是自定义 ConstraintLayout 的代码:

0 投票
3 回答
5568 浏览

android - ConstraintLayout GONE 视图占用空间

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

这是一个布局蓝图: 蓝图

蓝图说明:

  1. 标头被限制为top,leftright
  2. 下面的两个视图在 中,被限制在、和 上的packed chain标题以及和的父级上。topImageViewrightleftbottom

这是布局检查器的屏幕截图,其中突出显示的标题视图设置为GONE在此处输入图像描述

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

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

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

XML更新:

更新 2

经过额外的观察,这个问题只发生在调用notifyDataSetChangedin之后RecyclerView.Adapter。这是单击favorite其中一个项目的图标之前和之后的布局状态的屏幕截图。 在此处输入图像描述

截图说明:

  • 在左侧,ViewHolder可见header视图处于打开状态position: 2。以上项目显示正确。
  • 单击favorite图标(值为 242 的项目)后,ViewHolderonposition: 1是具有可见header视图的图标,而ViewHolderonposition: 2具有header视图设置为GONE. 我期待高度降低并具有与onViewHolder相同的高度。ViewHolderposition: 0

考虑到这ViewHolder已经header设置为VISIBLE以前的状态,它可能与回收有关,不确定。