使用約束的佈局和比例佈局一起撓曲

我試圖使用基於百分比的佈局，基於contraint佈局沿實現以下佈局使用約束的佈局和比例佈局一起撓曲

我有3個帆布我的應用程序使用正確的設置百分比，但我設置的東西像top = 10 left = 10來創建「border border」沒有效果。

我該如何解決這個問題？

編輯

<containers:GradientVBox width="820" 
          height="625" 
          id="vbox"> 
     <containers:GradientCanvas width="100%" 
        height="25%" 
        id="wave" 
        click="collapseWaveform(event)" 
        buttonMode="true" cornerRadiusBottomLeft="16" 
          cornerRadiusBottomRight="16" 
          cornerRadiusTopLeft="8" 
          cornerRadiusTopRight="8" 
          gradientFrom="0xffffff" 
          gradientTo="0xf5f5f5" top="10" /> 
     <mx:HBox width="100%" 
       height="75%" 
       id="myhbox" 
       paddingTop="0"> 
      <containers:GradientCanvas width="50%" 
          height="100%" 
          alpha="1.0" 
          id="left" 
          buttonMode="true" cornerRadiusBottomRight="8" 
          cornerRadiusTopLeft="8" 
          cornerRadiusTopRight="8" 
          gradientFrom="0xffffff" 
          gradientTo="0xf5f5f5" left="10"> 
       <content:Content width="95%" 
           height="95%" 
           id="content" 
           verticalCenter="0" 
           horizontalCenter="1" 
           horizontalScrollPolicy="off" 
           resize="resizeIt()"> 
        <mx:ViewStack id="contentviewstack" 
            width="100%" 
            height="100%"> 

         <containers:ContentContainerSoundCloud id="soundcloudcontent" 
                   width="100%" 
                   height="100%" 
                   cornerRadius="5" 
                   borderThickness="0" 
                   borderStyle="solid"/> 
         <containers:ContentContainerLoopMasters id="loopmasterscontainer" 
                   cornerRadius="5" 
                   borderThickness="0"/> 
         <containers:ContentContainerClips id="clipscontents" 
                  cornerRadius="5" 
                  borderThickness="0"/> 

        </mx:ViewStack> 
       </content:Content> 
      </containers:GradientCanvas> 
      <containers:GradientCanvas width="50%" 
          height="100%" 
          id="right" 
          buttonMode="true" cornerRadiusBottomRight="8" 
          cornerRadiusTopLeft="8" 
          cornerRadiusTopRight="8" 
          gradientFrom="0xffffff" 
          gradientTo="0xf5f5f5" right="10" left="10"/> 
     </mx:HBox> 

    </containers:GradientVBox> 


</mx:Application>

來源

2010-07-08 dubbeat

裏面的3個畫布元素是什麼樣的元素？那也是一個畫布？ – Pbirkoff 2010-07-08 12:02:21

你可以發佈的代碼 - imgur不可訪問。 – Amarghosh 2010-07-08 12:04:38

嗨，我在編輯中添加代碼。有問題的3個容器的ID爲「波浪」（多數民衆贊成在頂部），「左」和「右」。 – dubbeat 2010-07-08 12:35:37

要在頂部加入了國內空白，對vbox，不wave設置top="10"。

要獲得中間的10像素間隙，請在vbox上設置gap="10"。

要獲得右側的10像素間隙，請在vbox上設置right="10"。

這應該創建你正在尋找的佈局。

來源

2010-07-08 12:43:19 Jason

我得到了頂部=「10」好，但在這樣做，我得到一個垂直滾動。 Idont't沒有「差距」財產？ – dubbeat 2010-07-08 13:48:46

我琢磨了一下，得到了我喜歡的東西。謝謝您的幫助。我結束了不得不將vbox寬度設置爲95％top =「10」left =「10」。 – dubbeat 2010-07-08 14:14:39

@dubbeat，很高興聽到你把它設置。儘管Flex組件的佈局有時候會很棘手，但這絕對值得！ – Jason 2010-07-08 15:42:36

使用約束的佈局和比例佈局一起撓曲

回答

相關問題