0

我有以下标记：

<s:Group width="100%" height="100%"> 
    <s:BorderContainer borderWeight="3" borderColor="black" cornerRadius="5" width="100%" height="100%">
        <s:Path> 
            <s:stroke>
                <s:SolidColorStroke color="black" />
            </s:stroke>
            <s:data>M 14.153 14.788 C 13.856 15.25 13.161 15.628 12.612 15.628 L 0.766 15.628 C 0.216 15.628 -0.028 15.228 0.225 14.739 L 3.307 8.765 C 3.56 8.276 3.56 7.477 3.307 6.988 L 0.225 1.014 C -0.028 0.525 0.216 0.125 0.766 0.125 L 12.612 0.125 C 13.161 0.125 13.856 0.503 14.153 0.965 L 18.07 7.036 C 18.367 7.499 18.367 8.254 18.07 8.717 L 14.153 14.788 Z</s:data>
        </s:Path>
    </s:BorderContainer>
</s:Group>

我希望此容器中的路径根据容器调整大小。在 SVG 和 Silverlight 中，有“ViewBox”的概念，但我在 Flex 中找不到这个概念。

将宽度和高度设置为 100% 是可行的，但是当你有很多路径时，它需要大量的修补。另外，它的行为与您想要的不完全一样（尝试一下并调整浏览器的大小）

4

3 回答 3

0

我找到了我要找的东西。AutoFitArea 完全符合我的要求：

http://www.greensock.com/autofitarea/

于 2011-03-30T11:07:05.607 回答
0

您想以恒定的纵横比缩放路径吗？我设法这样做：

<s:BorderContainer id="container"
   borderWeight="3" borderColor="black" cornerRadius="5"
   width="100%" height="100%">
   <s:Path
       width="{Math.min(container.width - 10, container.height - 10)}"
       height="{Math.min(container.width - 10, container.height - 10)}">

它甚至更加修修补补，但它可以在运行时将属性绑定到这样的函数。

编辑：

我不想要恒定的纵横比。我希望它与容​​器一起成长。

然后你可以写这样的东西（没有经过完全测试）：

for each (var child:DisplayObject in container.children) {
    if (child is Path) {
        child.percentWidth = child.percentHeight = 100;
    }
}

在应用程序初始化上运行它，路径将缩放到容器（但不是在设计模式下）。

于 2010-11-04T18:51:41.923 回答
0

您可以将路径包装在s:Group中并设置 resizeMode （仅供参考，这与仅将路径包装在s:Graphic中的效果相同）：

<s:BorderContainer borderWeight="1" borderColor="black" cornerRadius="5" width="100%" height="100%" >
        <s:Group width="100%" height="100%" resizeMode="scale">
            <s:Path> 
                <s:stroke>
                    <s:SolidColorStroke color="black" scaleMode="none" />
                </s:stroke>
                <s:data>M 14.153 14.788 C 13.856 15.25 13.161 15.628 12.612 15.628 L 0.766 15.628 C 0.216 15.628 -0.028 15.228 0.225 14.739 L 3.307 8.765 C 3.56 8.276 3.56 7.477 3.307 6.988 L 0.225 1.014 C -0.028 0.525 0.216 0.125 0.766 0.125 L 12.612 0.125 C 13.161 0.125 13.856 0.503 14.153 0.965 L 18.07 7.036 C 18.367 7.499 18.367 8.254 18.07 8.717 L 14.153 14.788 Z</s:data>
            </s:Path>
        </s:Group>
    </s:BorderContainer>

如果您正在寻找，笔画上的 scaleMode 将检查线宽。

我不确定为什么路径仍然在右侧和底部显示一些填充，但是将路径宽度和高度设置为 100% 时它有点不规则。可能需要仔细检查路径数据。

于 2012-03-20T20:56:49.603 回答