我想创建使用Flex组件框架自定义Flex组件：

I am trying to create a Custom Flex Component using the Flex Component framework:

的http://www.adobe.com/livedocs/flex/3/html/help.html?content=ascomponents_advanced_3.html.

所有优秀的组件使您可以使用使用百分比值来定义它们的尺寸：

All good components allow you to define their dimensions using percentage values using:

MXML：

的TextInput宽度=100％

TextInput width="100%"

或

动作脚本在运行时：

textinp.percentWidth = 100;

textinp.percentWidth = 100;

我的问题是你如何在措施落实百分比宽度/高度自定义组件（）方法？更具体地讲，这些百分比转换为像素值，在某个阶段，这是怎么做的？

My question is how do you implement percentage width/height in the measure() method of your custom component? More specifically, these percentages are converted to pixels values at some stage, how is this done?

推荐答案

方式Flex的布点工作原理是通过让每个组件布局其子女由家长指定的大小。 儿童确实包括通常的儿童 - 的getChildren（），numChildren的 - 以及那些部件，这使得向上的边界，处理等，这被称为铬和是getRawChildren（）的一部分

The way Flex layouting works is by letting each component lay out its children to a size specified by the parent. "Children" does include the usual children - getChildren(), numChildren - and also those components which makes up borders, handles, etc., which are called "chrome" and are part of getRawChildren().

Flex框架现在这样两个回路在所有组件（这实际上显示树的一部分）。第一种是自下而上的（第一个最深的嵌套元素），并调用measure（）方法。它应该计算部分将有多少空间（宽/高）取如果可以有，因为它希望尽可能多的空间，没有限制（个人认为：滚动条），并把它放入measuredWidth和measuredHeight属性。其次，它计算多少空间希望有尽可能降到最低，投入使用measuredMinHeight /使用measuredMinWidth。为了计算这种方式，边框粗细，镀铬和普通孩子们询问了他们的大小使用与getExplicitOrMeasuredHeight（）/宽（），并相加。这就是为什么它的深度优先。

The Flex framework now does two loops over all components (which are actually part of the display tree). The first is bottom up (deepest nested elements first) and call the measure() method. It should calculate how much space (width/height) the component would take if it can has as much space as it wants, no limits (think: scrollbars) and put it into the measuredWidth and measuredHeight properties. Secondly, it calculates how much space it wants to have as an absolute minimum, put into measuredMinHeight / measuredMinWidth. To calculate this, border thickness, chrome and regular children are asked about their sizes using getExplicitOrMeasuredHeight()/Width(), and added together. That's why it's depth-first.

第二个循环是做实际的布点。这将启动在树的顶端，和updateDisplayList被调用，用X / Y参数告诉成分多少尺寸它实际上确实有。基于此信息的组件会告诉它的直接孩子，他们应该（相对于他们的父母），他们应该多大 - child.move（X，Y）和child.setActualSize（W，H）

The second loop is to do the actual layouting. This starts at the top of the tree, and updateDisplayList is called, with x/y parameters telling the component how much size it actually does have. Based on this information the component will tell its direct children where they should be (relative to their parents) and how big they should be - child.move(x,y) and child.setActualSize(w,h)

所以，它实际上是谁需要相对大小考虑父容器。你的组件状态是理想的（最小尺寸，使一切都可以显示）和最小尺寸的测量（），并具有处理任何不慎的updateDisplayList（）。父组件需要有可用的空间，可以确保每个部件得到它的最小尺寸，然后将剩下的分配给所有组件。在这个阶段，它会看它的孩子们的percentWidth /高度属性。

So it's actually the parent container who takes relative sizes into account. Your component states it's ideal (minimum size so that everything can be displayed) and minimum sizes in measure() and has to deal with whatever it gets in its updateDisplayList(). The parent component takes the available space it has, makes sure that each component gets it's minimum size and will then distribute the rest to all components. In this phase, it will look at the percentWidth/Height properties of its children.

所以，如果你想要把你的组件在一个标准的Flex容器像HBox中，你不需要做任何特殊的百分比大小工作。

So if you want to put your component in a standard Flex container like HBox, you don't need to do anything special for percentage sizes to work.