그룹이 기본 구성 요소의 최대 너비를 무시합니다.

Question

다음 코드에서 주변 그룹 (주변 그룹 1 & 주변 그룹 2)과 2 개의 동일한 bordercontainers (bordercontainer1 & bordercontainer2)를 볼 수 있습니다.

bordercontainers의 최대 너비는 250 픽셀이고 너비는 100 %입니다. 기본적으로 공간의 최대 250 픽셀을 차지하고 싶지만 사용 가능한 공간이 적다면 가능한 한 많이 차지하십시오. 내가 설정 생각

을 :

<?xml version="1.0" encoding="utf-8"?> 
<s:WindowedApplication xmlns:fx="http://ns.adobe.com/mxml/2009" 
         xmlns:s="library://ns.adobe.com/flex/spark" 
         xmlns:mx="library://ns.adobe.com/flex/mx"> 
    <s:HGroup id="maingroup" width="100%"> 
     <s:Group id="surroundinggroup1"> 
      <s:BorderContainer id="bordercontainer1" height="50" maxWidth="250" width="100%"> 
       <s:Label text="test"/> 
      </s:BorderContainer>   
     </s:Group> 
     <s:Group id="surroundinggroup2"> 
      <s:BorderContainer id="bordercontainer2" height="50" maxWidth="250" width="100%"> 
       <s:Label text="test"/> 
      </s:BorderContainer>   
     </s:Group> 
    </s:HGroup> 
</s:WindowedApplication> 

문제는 surroundinggroups 맞는 레이블이 "테스트"를 포함하도록 최대 너비를 무시하고 bordercontainer을 그리는 데 필요한 최소 폭을 사용하는 것이다 주변 그룹의 너비를 100 %로 설정하면이 문제가 해결되지만 주위 그룹이 가능한 한 많은 공간을 차지하여 두 테두리 컨테이너 사이에 간격이 생깁니다.

가

유일한 해결책은 surroundinggroups을 제거하는 것 같다, 다음 레이아웃은 내가 원하는대로입니다 그것은 :

여기서 문제는 실제 응용 프로그램에서,이 surroundinggroups는 다른 포함되어 있다는 것입니다

구성 요소 및 논리. 그것들을 제거하면 꽤 다른 변화가 생길 수 있습니다. 이러한 주변 그룹을 유지하면서 원하는 결과 (이미지 3)를 얻을 수있는 방법이 없습니까?

Answer 1

이 트릭을 수행해야합니다. 어떤 이유로 주변 그룹의 크기 제한을 원하지 않는다고 생각했지만 그건 내 머리 속에 있습니다. 나는 maxWidth와 100 %를 surroudinggroups로 옮겼다. Bordercontainer width = "100 %"또한 당신이 원하는 것에 중요하다.

<s:WindowedApplication xmlns:fx="http://ns.adobe.com/mxml/2009" 
         xmlns:s="library://ns.adobe.com/flex/spark" 
         xmlns:mx="library://ns.adobe.com/flex/mx"> 
    <s:HGroup id="maingroup" width="100%" > 
     <s:Group id="surroundinggroup1" maxWidth="250" width="100%"> 
      <s:BorderContainer id="bordercontainer1" height="50" width="100%"> 
       <s:Label text="test"/> 
      </s:BorderContainer>   
     </s:Group> 
     <s:Group id="surroundinggroup2" maxWidth="250" width="100%"> 
      <s:BorderContainer id="bordercontainer2" height="50" width="100%"> 
       <s:Label text="test"/> 
      </s:BorderContainer>   
     </s:Group> 
    </s:HGroup> 
</s:WindowedApplication>