Question

我有一个皮肤类，其主机组件是一个切换按钮。我需要能够在它周围添加边框，但只能在顶部，左侧和右侧添加边框，据我所知，您必须使用：<s:Line>组件。所以我补充道：

<s:Line   left="0" top="0" right="0">
    <s:stroke>

        <s:LinearGradientStroke  rotation="180" weight="2" caps="square">
            <s:GradientEntry color="0xffffff" 
                             alpha="0"
                             alpha.selectedStates="1"/>

            <s:GradientEntry color="0xffffff" 
                             alpha="0" 
                             alpha.selectedStates="1" />
        </s:LinearGradientStroke>

    </s:stroke>
</s:Line>

这适用于顶线，但我似乎无法获得左右线。我尝试过：这是左侧的，但它不起作用（没有显示行）：

<s:Line   left="0" top="0">
    <s:stroke>

        <s:LinearGradientStroke  rotation="90" weight="2" caps="square">
            <s:GradientEntry color="0xffffff" 
                             alpha="0"
                             alpha.selectedStates="1"/>

            <s:GradientEntry color="0xffffff" 
                             alpha="0" 
                             alpha.selectedStates="1" />
        </s:LinearGradientStroke>

    </s:stroke>
</s:Line>

如何在按钮周围实现3条线？

Answer 1

<!-- TOP -->
    <s:Line   left="0" top="0"  right="0"> 
        <s:stroke>

            <s:LinearGradientStroke  rotation="180" weight="1" caps="round" >
                <s:GradientEntry color="0xffffff" 
                                 alpha="0"
                                 alpha.selectedStates="1"/>

                <s:GradientEntry color="0xffffff" 
                                 alpha="0" 
                                 alpha.selectedStates="1" />
            </s:LinearGradientStroke>

        </s:stroke>
    </s:Line>


    <!-- LEFT -->
    <s:Line   left="0" top="0"  bottom="0"> 
        <s:stroke>

            <s:LinearGradientStroke  rotation="180" weight="1" caps="round" >
                <s:GradientEntry color="0xffffff" 
                                 alpha="0"
                                 alpha.selectedStates="1"/>

                <s:GradientEntry color="0xffffff" 
                                 alpha="0" 
                                 alpha.selectedStates="1" />
            </s:LinearGradientStroke>

        </s:stroke>
    </s:Line>


    <!-- RIGHT -->
    <s:Line   right="0" top="0"  bottom="0"> 
        <s:stroke>

            <s:LinearGradientStroke  rotation="180" weight="1" caps="round" >
                <s:GradientEntry color="0xffffff" 
                                 alpha="0"
                                 alpha.selectedStates="1"/>

                <s:GradientEntry color="0xffffff" 
                                 alpha="0" 
                                 alpha.selectedStates="1" />
            </s:LinearGradientStroke>

        </s:stroke>
    </s:Line>

仅在按钮的3面上使用Flex Spark边框

1 个答案: