フレックス：グラフィックス間のギャップ

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>