Question

我在其中有一个组2图形，我将组的垂直布局中的间隙设置为0但是在2个图形之间仍然存在1个像素的间隙。知道怎么摆脱这个吗？

<?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:Group>
        <s:layout>
            <s:VerticalLayout gap="0"/>
        </s:layout>
        <s:Graphic height="100">
            <s:Path data="M 50 0 L 50 100 Z" height="100">
                <s:stroke>
                    <s:SolidColorStroke color="#333333"/>
                </s:stroke>
            </s:Path>
        </s:Graphic>
        <s:Graphic height="1">
            <s:Path data="M 0 0 L 100 0 Z" height="1">
                <s:stroke>
                    <s:SolidColorStroke color="#333333"/>
                </s:stroke>
            </s:Path>
        </s:Graphic>
    </s:Group>
</s:Application>

Answer 1

你的问题的简单答案是差距似乎来自你给第一幅图形的明确高度。只需将其移除，间隙就会消失。

（IMO）更好的答案是，这个代码对于创建简单的图形似乎有点费解。

没有理由将每行包裹在Graphics类中。您可以扩展Graphic以创建独立的，可重用的图形类。
有一个Line类用于绘制直线。比使用Path

如果你绝对需要VerticalLayout，你可以像这样重写代码：

<s:Group>
    <s:layout>
        <s:VerticalLayout gap="0" horizontalAlign="center" />
    </s:layout>
    <s:Line height="100">
        <s:stroke>
            <s:SolidColorStroke color="#333333" />
        </s:stroke>
    </s:Line>
    <s:Line width="100">
        <s:stroke>
            <s:SolidColorStroke color="#333333" />
        </s:stroke>
    </s:Line>
</s:Group>

但如果你出于某种原因并不真的需要它，它甚至可以简化为：

<s:Group>
    <s:Line height="100" horizontalCenter="0">
        <s:stroke>
            <s:SolidColorStroke color="#333333" />
        </s:stroke>
    </s:Line>
    <s:Line width="100" bottom="0">
        <s:stroke>
            <s:SolidColorStroke color="#333333" />
        </s:stroke>
    </s:Line>
</s:Group>

Flex：图形之间的差距

1 个答案: