Flex içinde satırSpan için davranış davranışı

Question

Grid bileşeniyle esnek çalışırken çalışırken bazı gariplikler yaşıyorum, her GridRow'un bir kenarlığı olduğu gibi alanları hizalamak için bir ızgara kullanan aşağıdaki forma sahibim.

Sorunum (GridRow sınırları doğru attı gitmek, 4 satır yayılan TextArea dikkate alınmalıdır!) Sınır birden fazla satır yayılan GridItems aracılığıyla hala görünür olmasıdır Bunu düzeltmek için nasıl

Herhangi bir fikir?

Answer 1

Sorun şu ki, Izgara çizildiğinde, her satırı yukarıdan aşağıya ve her satırın içinde kalanları sağa doğru çekiyor. Bu nedenle, satır aralığı < mx: TextArea > öğesinin ilk önce, sonraki ve sonraki satırların içine doğru çekileceği şekilde çizilir.

Görebildiğim en hızlı yol, satırdaki öğenin yerleşimini temel alarak sol ve sağ kenarları atlayarak < mx: GridItem > s satır sınırlarını çizmek olacaktır. Bunun gibi bir şey:

<?xml version="1.0" encoding="utf-8"?> 
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"> 
    <mx:Style> 
     Grid { 
      background-color: white; 
      horizontal-gap: 0; 
     } 
     GridItem { 
      padding-top: 5; 
      padding-left: 5; 
      padding-right: 5; 
      padding-bottom: 5; 
      background-color: #efefef; 

      border-style: solid; 
      border-thickness: 1; 
      border-color: black; 
     } 
     .left { 
      border-sides: top, bottom, left; 
     } 
     .right { 
      border-sides: top, bottom, right; 
     } 
     .center { 
      border-sides: top, bottom; 
     } 
    </mx:Style> 
    <mx:Grid> 
     <mx:GridRow> 
      <mx:GridItem styleName="left"> 
       <mx:Label text="Label"/> 
      </mx:GridItem> 
      <mx:GridItem styleName="center"> 
       <mx:ComboBox/> 
      </mx:GridItem> 
      <mx:GridItem styleName="center"> 
       <mx:Label text="Label"/> 
      </mx:GridItem> 
      <mx:GridItem styleName="right"> 
       <mx:ComboBox/> 
      </mx:GridItem> 
     </mx:GridRow> 
     <mx:GridRow> 
      <mx:GridItem styleName="left"> 
       <mx:Label text="Label"/> 
      </mx:GridItem> 
      <mx:GridItem styleName="center"> 
       <mx:TextInput/> 
      </mx:GridItem> 
      <mx:GridItem colSpan="2" rowSpan="3"> 
       <mx:VBox width="100%" height="100%"> 
        <mx:Label text="Label"/> 
        <mx:TextArea width="100%" height="100%"/> 
       </mx:VBox> 
      </mx:GridItem> 
     </mx:GridRow> 
     <mx:GridRow> 
      <mx:GridItem styleName="left"> 
       <mx:Label text="Label"/> 
      </mx:GridItem> 
      <mx:GridItem styleName="center"> 
       <mx:TextInput/> 
      </mx:GridItem> 
     </mx:GridRow> 
     <mx:GridRow> 
      <mx:GridItem styleName="left"> 
       <mx:Label text="Label"/> 
      </mx:GridItem> 
      <mx:GridItem styleName="center"> 
       <mx:TextInput/> 
      </mx:GridItem> 
     </mx:GridRow> 
    </mx:Grid> 
</mx:Application>