自定义 SkinnableContainer 皮肤边框

Question

我有一个 SkinnableContainer，我想为其添加边框。我已经创建了一个外观类，它成功地在容器的所有四个侧面周围创建了 1 像素边框，但是，我希望边框仅适用于容器的顶部和底部，而不是侧面（左、右）。我怎样才能实现这样的目标？我已附上我当前的皮肤类别。请帮忙！提前致谢。

<?xml version="1.0" encoding="utf-8"?>
<!-- containers\spark\mySkins\MyBorderSkin.mxml -->
<s:Skin xmlns:fx="http://ns.adobe.com/mxml/2009"
    xmlns:mx="library://ns.adobe.com/flex/mx"
    xmlns:s="library://ns.adobe.com/flex/spark" >

<fx:Metadata>
    [HostComponent("spark.components.SkinnableContainer")]
</fx:Metadata>

<!-- Define the skin states. -->
<s:states>
    <s:State name="normal" />
    <s:State name="disabled" />
</s:states>

<!-- Define a Rect to fill the area of the skin. -->
<s:Rect x="0" y="0"
        height="100%" width="100%">
    <s:stroke>
        <s:LinearGradientStroke weight="1"/>
    </s:stroke>         
</s:Rect>

<!-- Define the content area of the container. -->
<s:Group id="contentGroup"
         left="5" right="5" top="2" bottom="2">
    <s:layout>
        <s:VerticalLayout/>
    </s:layout>
</s:Group>        
</s:Skin>

Answer 1

使用类似：

<s:Line left="0" top="0" right="0">
    <s:stroke>
        <s:LinearGradientStroke weight="1"/>
    </s:stroke>
</s:Line>

<s:Line left="0" bottom="0" right="0">
    <s:stroke>
        <s:LinearGradientStroke weight="1"/>
    </s:stroke>
</s:Line>

代替 Rect 声明。