使用其中心作为锚点调整面板大小

发布于 2024-11-19 17:06:18 字数 165 浏览 2 评论 0原文

我正在尝试使用调整大小效果并使用其中心作为锚点来调整面板大小。我一直在谷歌上搜索一些信息，我发现的唯一的是将horizontalCenter和verticalCenter设置为0，但这对我不起作用。面板不断从左上角/上角调整大小。

有人能更清楚地解释如何实现这一点吗？

提前致谢。

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

梦里寻她 2024-11-26 17:06:19

正如 Jonathan 所建议的，面板的父容器可能不使用 BasicLayout，而是使用一些液体布局（如 VerticalLayout）。当您使用液体布局时，您不能使用绝对位置属性，例如“x”、“y”、“horizontalCenter”、“verticalCenter”、“left”、“right”、“top”或“bottom”。它们将被简单地忽略，这当然是有道理的，因为对象必须相对于彼此放置。

不管怎样，这很完美：

<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
               xmlns:s="library://ns.adobe.com/flex/spark">

    <s:states>
        <s:State name="small" />
        <s:State name="big" />
    </s:states>

    <s:transitions>
        <s:Transition>
            <s:Resize target="{panel}" />
        </s:Transition>
    </s:transitions>

    <s:Panel id="panel" horizontalCenter="0" verticalCenter="0"
             width.small="200" height.small="100"
             width.big="400" height.big="200">

        <s:Button label="toggle size" 
                  click="currentState = currentState == 'small' ? 'big' : 'small'" />
    </s:Panel>

</s:Application>

As Jonathan suggests, the parent container of your Panel probably doesn't use a BasicLayout, but some liquid layout (like VerticalLayout). When you use a liquid layout you can not use absolute position attributes, like 'x', 'y', 'horizontalCenter', 'verticalCenter', 'left', 'right', 'top' or 'bottom'. They will simply be ignored, which of course makes sense because the objects have to be laid out relative to one another.

Anyway, this works perfectly:

<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
               xmlns:s="library://ns.adobe.com/flex/spark">

    <s:states>
        <s:State name="small" />
        <s:State name="big" />
    </s:states>

    <s:transitions>
        <s:Transition>
            <s:Resize target="{panel}" />
        </s:Transition>
    </s:transitions>

    <s:Panel id="panel" horizontalCenter="0" verticalCenter="0"
             width.small="200" height.small="100"
             width.big="400" height.big="200">

        <s:Button label="toggle size" 
                  click="currentState = currentState == 'small' ? 'big' : 'small'" />
    </s:Panel>

</s:Application>

回复收藏 0 原文

~没有更多了~