2

有什么方法可以使用 Flex CSS 在此 BorderContainer 上设置填充？

<s:BorderContainer width="100%" height="100%">
   <s:layout>
      <s:VerticalLayout />
   </s:layout>

   <s:Label text="asdfasdf" />
</s:BorderContainer>

我试图避免添加额外的不必要的 VGroup。使用 CSS 设置填充无效。（我猜是因为 paddingLeft 不是 BorderContainer 上定义的样式。）

s|BorderContainer {
   paddingLeft: 10;
}

有没有办法用 CSS 修改布局的属性？我不想在很多地方硬编码填充。

4

2 回答 2

1

您可以将自定义样式添加到 BorderContainer 的外观。像这样的东西：

override protected function updateDisplayList(unscaledWidth:Number,
                                              unscaledHeight:Number):void {
    super.updateDisplayList(unscaledWidth, unscaledHeight);

    var paddingLeft:* = getStyle('paddingLeft');

    elementToPad.left = paddingLeft;
    //or
    layoutToPad.paddingLeft = paddingLeft;
    //or
    elementToPad.setStyle('paddingLeft', paddingLeft);
    //depending on what kind of element you wish to pad
}

这样，您可以使用单个 Skin 类通过 CSS 应用不同的填充，并且可以避免代码重复。
唯一的缺点是：您不会获得 IDE 支持，因为主机组件不会知道您添加的样式；如果您尝试在 MXML 中设置样式，编译器会抛出错误，但这是您首先要避免的。

于 2012-12-20T21:49:32.593 回答
0

定义一个自定义样式，其中指定填充。

   .myCustomStyle { paddingLeft: 10;}

在代码中，使用styleManager获取该样式值并将其设置为垂直布局

    <s:layout>
         <s:VerticalLayout paddingLeft= "value got from the style manager"/>
   </s:layout>
于 2012-12-19T07:47:32.660 回答