问题标签 [intrinsic-content-size]
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.
ios - UITableView 内的内部内容大小的 UICollectionView
让我先说在过去的几个月里我花了大约 100 个小时搜索 Google 和 StackOverflow 试图回答这个问题。我已经遵循了许多教程,但无法解决我的问题。每一个都是一个重大的失望,令人沮丧。
期待
现实
问题
我有一个包含 UIView 的 UITableView。UIView 具有自动布局约束,将其固定在单元格边缘 15pt 处,然后我给它一个阴影和圆角。在那个 UIView 里面,我有几个标签,然后是一个 UICollectionView 和一个堆栈视图。
我的 UICollectionView 的高度一直为 0,我不知道如何使它具有内在大小。我似乎可以让它正确显示的唯一方法是通过情节提要内的自动布局强制它具有特定的高度(这是我为截取此屏幕截图所做的)。不幸的是,强迫这样的高度是不现实的,原因有两个:
- 高度根据设备的宽度而变化。由于图像是正方形,因此高度松散地(但不完全)是设备宽度的一半。
- 如果没有图像,则集合视图的高度应为 0。
看起来应该可以在这里使用流布局的内在内容大小。
故事板
约束
我在每个标签、集合视图和堆栈视图之间有大约 15pt 的空间(因此,垂直空间)。集合视图原型单元格中有一个图像视图。图像视图的顶部、底部、尾部和前导空间都设置为集合视图单元格的 0,并且比例为 1:1。
集合视图布局
为了实现一张大图和四张小图的布局,我使用了 SNCollectionViewLayout。
数据源/委托
在我的控制器中viewDidLoad
,我estimatedRowHeight
将 UITableView 设置为 400,并将 设置rowHeight
为UITableView.automaticDimension
.
在 tableView cellForRowAt 中,我将一个可重用的自定义UITableViewCell
类出列,在表格视图单元格上设置各种出口,并为表格视图单元格调reloadData()
用集合视图。在情节提要中,我将表格视图单元格设置为集合视图的数据源和委托。
在表格视图单元格的awakeFromNib
函数中,我设置了圆角半径、阴影,并使用以下代码在集合视图上进行流布局(您可以在他们的示例中看到):
我还SNCollectionViewLayoutDelegate
通过编写以下函数实现了可选协议:
这个函数就是为什么第一张图像的高度和宽度是其余图像的两倍。
研究
为了弄清楚这一点,我检查了collectionView.collectionViewLayout.collectionViewContentSize
表格视图单元格的 cellForRowAt 和 willDisplay 方法。无论哪种情况,它都是 (0,0)。
我还尝试在集合视图单元格的 cellForItemAt 和 willDisplay 中检查它。除非我向集合视图添加高度约束以使其变高,否则这些日志行甚至不会打印,但是我没有一个好的方法可以将高度降低到应有的水平,并且任何时候我我试过了,我得到了冲突的约束警告和非常不稳定的拉伸视图(例如堆栈视图被完全压扁)。
在测试中,我强制设置了一个足够大的高度约束以使集合视图适合,当这种情况发生时,它会正确呈现并且集合视图内容大小是正确的,所以我知道它能够跟踪(可以看到在这里)。
有没有人对此有任何见解?如果您有任何要研究的细节,我很乐意提供更多代码。我试图给出全貌,同时尽可能短(我知道它很长)。
我觉得这个问题与表格视图单元格内的集合视图有关。
提前致谢。
macos - 自定义文本视图的自动布局支持
这个问题是关于使用约束和视图的intrinsicContentSize 来支持可变高度的自定义文本视图以进行自动布局。在您单击“复制”按钮之前,请听我说完。
我有一个自定义文本视图(从头开始,继承自 NSView)。它支持许多常见的 NSTextView 功能,这里最相关的是多行并根据可用宽度布置其内容。它构建的应用程序将这些文本视图中的几个加载到表格视图的每一行中。问题是没有根据它的内在内容大小正确设置高度。
我创建了一个简化问题的示例项目。它使用具有固定数量和大小的字符的“伪”文本视图,用于确定所需的宽度/高度。在示例中,有一列的表格视图,其单元格视图只有一个子视图,即 PseudoTextView。文本视图被固定在其单元格视图的边缘,并带有一点填充。如何让系统识别文本视图应该遵守定义宽度的约束,同时允许文本视图在高度上增长,并被单元格视图紧紧包裹?这是文本视图代码:
此版本根据视图的框架返回适当的大小。这显然不起作用,因为它是在布局的 updateConstraints 阶段在尚未设置框架时访问的。我也尝试使用 NSView.noIntrinsicMetric 作为宽度,但这会将文本视图驱动为零宽度并且高度永远不会恢复。我还做了很多其他尝试,但我不会全部让你厌烦。
NSTextField 做了一些不同的事情(假设“可编辑”关闭,“包装”打开)。它的 intrinsicContentSize 在一行上报告文本的全宽(即使它比可用宽度长得多),但它以某种方式调整为正确的宽度。调整大小后,intrinsicContentWidth 仍会报告完整的单行宽度,但会调整高度以适应多行。在我无法预测的地方有一些魔法。
我已经阅读了相关文档的每一行。如果有关于该主题的博客文章,我可能已经阅读过。如果关于这个话题有关于 SO 的问题,我可能已经读过了。如果你写了一本关于这个主题的书,我可能已经买了。所有这些消息来源都在取笑我遇到的问题,但没有一个能回答如何处理这种特殊情况的问题。绝望的。
更新:
在阅读了 Jonathon Mah 的一篇旧博客文章 ( http://devetc.org/code/2014/07/07/auto-layout-and-views-that-wrap.html ) 之后,我创建了一个使用他的方法的示例。这是另一个模仿他的技术并正常工作的项目。这是应用程序的顶部。这是一个使用滑块调整的固定容器视图。拼凑是自定义视图的伪字符,其背景是粉红色。
但是,当插入到自调整大小的表格视图中时,自定义视图会正确匹配其单元格的宽度,但不会调整单元格以尊重固有高度。如果您将自定义视图的底部约束更改为可选的(例如,使用 >= 关系),自定义视图会缩小到正确的高度,但单元格视图保持固定。如何说服单元格视图缩小其高度以尊重其子视图的intrinsicContentSize.height?
xcode - 如何让我的 SwiftUI UIViewRepresentable 在预览中尊重intrinsicContentSize?
当我在 SwiftUI 中创建视图并在 Xcode 预览中呈现它时,使用PreviewLayout.sizeThatFits
,预览会根据其内容调整其大小。当我使用 导入 UIKIt 视图UIViewRepresentable
时,它会出现一个完整的设备大小的框架。
有没有办法让 SwiftUI 尊重intrinsicContentSize
子UIView
类?
ios - iOS 13 beta 中 WKWebView 的内在内容大小问题
我试图在加载 WKWeb 视图时获取它的高度,并使用委托方法更改表格视图中单元格的高度。下面的代码在 iOS 12 之前运行良好。
当我尝试在 iOS 13 beta 中运行时,单元格高度不断增加,因为内在大小每次都增加一。
有没有办法阻止这种情况?
swift - 不占用全屏宽度时获取UILabel宽度?
我想获得在自定义 TableView 单元中添加为子视图的 UILabel 的宽度。下面列出了我正在使用的 TableView 类:
但是,从上面的代码中,当我为 customLabel UILabel 分配 rightAnchor 约束时,Xcode 没有返回我正在寻找的 UILabel 的正确宽度。
我知道我只为 UILabel 指定了顶部和左侧约束。我也知道 UILabel 默认情况下具有内在布局,它可以根据 UILabel 的内容决定所需的高度。但是,我想知道我是否没有将上面代码中定义的 customUILabel 的 numberOfLines 设置为 0(即,我只希望 UILabel 中的文本只占一行)。我可以在文本被截断之前获得 customUILabel 的宽度吗?
让我进一步解释一下,如果我的 customLabel 有很多文本,它将占据屏幕的整个宽度然后被截断。但是,如果它不包含很多文本,那么它的宽度将小于屏幕的宽度。这正是我有兴趣获得的,用于显示其中小文本的 UILabel 的宽度?
问候,沙迪。
css - 无效的属性名称:flex-basis:1 0 max-content
我将该flex
属性应用于页面上的多个 div,并在 Chrome 中查看得到以下信息:
悬停时的消息是Invalid property name
。
对于它的价值,我的代码如下:
我认为Chrome 支持,max-content
所以不确定为什么会这样?我的浏览器是最新的,如果我将它放入.flex-basis
任何解释或建议都非常感谢,即使(尤其是)我遗漏了一些简单的东西:)
ios - UITextView 类,从 Objective-C 到 Swift 的 intrinsicContentSize 问题
我一直在Objective-C中工作,我使用Swift的时间很短。我在Objective-CUITextView
中有一个课程,我正在研究该方法。intrinsicContentSize
Objective-C
现在我正在尝试将我的 Objective-C 代码转换为 Swift,但我遇到了这个函数的问题......
text.lenght
似乎给了我一个
类型错误的值 '(UITextRange) -> String? 没有成员“长度”
css - Flexbox 容器缩小到最小高度以下:max-content
我正在开发一个 flexbox 侧边栏菜单,但似乎在flex: 0 1 auto
具有固有大小min-height
的容器之间遇到冲突,导致容器缩小到允许的最小值以下。
JSFiddle 链接(与下面的片段相同)
摘要/预期行为
- 菜单跨越整个垂直屏幕空间,由任意数量的
minimizable-group
容器组成,这些容器整齐地堆叠在一起。 - 每个组都有一个
flex: none
标题/标题和一个灵活的容器minimizable-group-content
- 有两种组内容类型:
.unshrinkable
对于应该对用户完全可见的重要控制元素(片段中的红色框).shrinkable
对于潜在的巨大列表,允许缩小到某个最小高度(片段中的蓝色框)
- 用户可以折叠每个可最小化的组(⮟ 按钮)——该部分目前工作正常。
问题
在片段中,您可以看到所有三个可最小化的组(全屏)。然而,第 2 组中不可收缩的内容被挤在一起,除非我折叠第 1 组或第 3 组
从开发控制台看,问题似乎出在minimizable-group-content
. 里面的红色.unshrinkable
框显示了一个合理的计算高度(18 像素),但是封装容器的计算高度只有 ~5px,并且无论我扔给它什么 CSS 都拒绝调整大小。
我可以设置任何其他属性来防止我的弹性盒子缩小到最小高度吗?或者我可以用不同的方法获得预期的行为吗?
(不相关的:
- 父 flexbox 容器忽略了孩子的 flexbox min-width - 也使用了它,但涵盖了完全相反的内容:元素不收缩
- https://github.com/philipwalton/flexbugs#flexbug-1 - 会匹配,但似乎已经修复了一个
- 最小内容和最大内容如何工作?- 对内在尺寸的解释 - 我认为我使用正确?
- Safari: flexbox 和 min-height -- 尝试过 fit-content/min-content/max-content,但似乎没有任何效果
片段
ios - 如何根据其 drawRect 方法制作 UIView 约束布局?
我想使用 UIView 来呈现字符串,而不是 UILabel。
UILabel 具有适合内在内容大小,用于约束自动布局。
使用 UIView 渲染 String,使用自动布局时其动态高度为零。
我可以给出customView
一个合适的矩形,通过计算字符串大小,填写布局部分代码。
只是想知道是否有其他方便的方法可以根据它的drawRect
方法制作 UIView 约束布局