flex绘制不同的渐变颜色的对象

Question

我希望有一个矩形，在flex中有三种不同的颜色。我使用了填充和渐变等火花组件，但却无法像这样并排获得三种颜色。

黑 - 红 - 黑比值0.2 0.8 0.2。我只能使用两种颜色，但不是这个比例。此外，我想要矩形而不是渐变的纯色。

<s:Rect id="rectangle1" height="100" width="300">
    <s:fill>
        <s:LinearGradient>
            <s:GradientEntry color="black" ratio="0.5"    alpha="1"/>
            <s:GradientEntry color="red"  ratio="0.5" alpha="1"/>
    </s:LinearGradient> 
    </s:fill>
</s:Rect>

Answer 1

你不是说你想要3个矩形吗？你想要一个渐变，但是你说你想要纯色（没有渐变）。

你的意思是这样吗？

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
               xmlns:s="library://ns.adobe.com/flex/spark"
               xmlns:mx="library://ns.adobe.com/flex/mx"
               minWidth="955"
               minHeight="600">

    <s:Rect id="rectangle1"
            height="15"
            width="300">
        <s:fill>
            <s:SolidColor color="0x0" />
        </s:fill>
    </s:Rect>

    <s:Rect id="rectangle2"
            top="15"
            height="70"
            width="300">
        <s:fill>
            <s:SolidColor color="0xff0000" />
        </s:fill>
    </s:Rect>

    <s:Rect id="rectangle3"
            top="85"
            height="15"
            width="300">
        <s:fill>
            <s:SolidColor color="0x0" />
        </s:fill>
    </s:Rect>

</s:Application>

否则，您可以像这样完成目标：

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
               xmlns:s="library://ns.adobe.com/flex/spark"
               xmlns:mx="library://ns.adobe.com/flex/mx"
               minWidth="955"
               minHeight="600">

    <s:Rect id="rectangle1"
            height="100"
            width="300">
        <s:fill>
            <s:LinearGradient rotation="90">
                <s:GradientEntry color="0x0" ratio="0" />
                <s:GradientEntry color="0x0" ratio=".2" />
                <s:GradientEntry color="0xff0000" ratio=".2" />
                <s:GradientEntry color="0xff0000" ratio=".8" />
                <s:GradientEntry color="0x0" ratio=".8" />
            </s:LinearGradient>
        </s:fill>
    </s:Rect>

</s:Application>