需要弹性说明：宽度、最小（最大）宽度、显式宽度、显式最小（最大）宽度、测量宽度、测量最小宽度、百分比宽度

Posted 2023-02-16

【中文标题】需要弹性说明：宽度、最小（最大）宽度、显式宽度、显式最小（最大）宽度、测量宽度、测量最小宽度、百分比宽度

【英文标题】：Flex clarification needed: width, min(max)Width, explicitWidth, explicitMin(Max)Width, measuredWidth, measuredMinWidth, percentWidth

【发布时间】：2011-10-18 09:44:16

【问题描述】：

有没有人能够简单易懂地解释不同 Flex 尺寸属性的含义？

到目前为止我所拥有的：

实际尺寸

width 和 height。这是组件的实际（和最终）大小。如果没有明确设置，它将是通过应用所有布局规则和百分比大小来计算的大小。

显式尺寸

explicitWidth 和 explicitHeight。我们需要这两个属性来决定是需要计算实际大小还是可以从这些属性中复制。

测量尺寸

measuredWidth、measuredHeight、measuredMinWidth 和 measuredMinHeight。组件的默认大小。该组件应该在其measure() 挂钩中设置这些大小。仅当未设置显式大小时才应用默认大小（例如 width 或 explicitHeight）。仅在百分比尺寸的情况下才考虑最小/最大测量尺寸。计算的（实际）尺寸不能小于测量的最小尺寸。

百分比大小

percentWidth 和 percentHeight。明显的。

最小尺寸

minWidth，minHeight。返回组件的最小尺寸 - 明确设置或在measure() 中设置的默认最小尺寸。允许设置一个显式的最小尺寸来覆盖默认（测量的）最小尺寸。

显式最小尺寸

explicitMinWidth，explicitMinHeight。与显式大小相同的角色。如果设置，则使用这些值，否则使用默认（测量的）最小尺寸。

最大尺寸

maxWidth，maxHeight。返回组件的最大尺寸 - 显式设置或默认最大尺寸 10000。

显式最大尺寸

explicitMaxWidth，explicitMaxHeight。与显式大小或显式最小大小相同的角色。如果设置，这些值将用于确定上限大小边框，否则默认最大大小10000。

希望，还有更多尺寸属性需要讨论。

【参考方案1】：

Adobe's article 是一个很好的参考。底部的图表描述了维度和显式维度之间的差异，以及最大、最小和默认维度。

开发人员可以通过四种方式来调整组件大小：

自动

：让 Flex 通过不指定尺寸来选择尺寸

像素

：使用高度和宽度属性设置精确的像素大小

百分比

：将大小设置为父容器的百分比

约束

：创建基于约束的布局（通常通过将子组件的边或中心锚定到其容器的可视区域的某个部分来完成）

除非您正在创建自定义 Flex 组件，否则 height、width、percentHeight 和 percentWidth 属性是配置组件尺寸所需的唯一属性。

Flex SDK 团队的 Gordon Smith 是这样解释的：

出于与易用性考虑相关的历史原因， “宽度”属性具有双重作用。作为二传手，它设置 显式宽度。作为 getter，它返回实际宽度。

换句话说，听起来 height 和 width 为您管理这些较低级别的属性。

【讨论】：

如果没有“历史原因”，现在设置/获取“宽度”会做什么？

【参考方案2】：

相关链接：http://www.developmentarc.com/site/sites/default/files/understanding_the_flex_3_lifecycle_v1.0.pdf