2011-09-25 4 views
0

저는 플렉스 (모바일) 응용 프로그램을 작성했으며, 예상보다 큰 결과를 보았습니다.어떻게 Flex 애플리케이션에서 뷰를 분해 할 수 있습니까?

저는 제 수업과 모든 것을 AS 파일에 매우 만족합니다. 그러나 MXML을 사용하여 내 응용 프로그램을 레이아웃 할 때 뷰가 실제로 커졌습니다.

필자는 시각적으로 읽을 수 있도록 외부 구성 요소를 만드는 방법을 생각했지만 최선의 방법은 무엇인지, 그렇지 않으면 최선의 방법인지 전혀 모르겠습니다. 예를 들어

, 내보기 AV IN 있습니다 : 그룹으로 다음

<s:VGroup width="100%" height="80%" includeIn="normal" horizontalAlign="center" top="70" id="imageGroup"> 
    <s:Label id="lblFile" visible="false" width="98%" textAlign="center" includeInLayout="true" color="0xFFFFFF"/> 
    <s:BorderContainer id="framingBorder" borderColor="0xFFFFFF" borderWeight="15" cornerRadius="7"> 
     <s:Image id="image" source="{IMAGE_SAMPLE}" horizontalCenter="0"/> 

    </s:BorderContainer>  
    <s:BorderContainer id="shareBorder" borderColor="0xFFFFFF" borderWeight="5" height="30" cornerRadius="7" width="{framingBorder.width}" visible="false" buttonMode="true" click="copyToClipboard(lblURL.text)"> 
     <s:layout> 
      <s:HorizontalLayout verticalAlign="middle" horizontalAlign="left" gap="3"/> 
     </s:layout> 
     <s:Label text="url:" styleName="copyURL" /> 
     <s:BorderContainer borderColor="0xCDCDCD" borderWeight="1" width="{lblURL.width + 5}" height="{lblURL.height + 5}"> 
      <s:layout> 
       <s:HorizontalLayout verticalAlign="middle" horizontalAlign="center"/> 
      </s:layout> 
      <s:Label id="lblURL" text="" styleName="copyURL" /> 
     </s:BorderContainer> 
     <s:Spacer width="100%" /> 
     <s:HGroup> 
      <s:Label color="0xFF0000" text="copy" styleName="copyURL" /> 
      <s:Image source="/assets/icons/page_copy_small.png" horizontalCenter="0" horizontalAlign="right"/> 
     </s:HGroup> 
    </s:BorderContainer>  
</s:VGroup> 

내가 청소기를 만들기 위해보기에서이 밖으로 이동할 수 있는지 사람에 관한 올바른 방향으로 날 지점 수 , 여전히 코드 블록 내부 항목에 액세스 할 수있는 방법을 '사전에

감사합니다,

+0

하나 이상과 같은 형태 다른 곳에 프로젝트에 있나요 또는 구성 요소 내에서 반복이 있습니까? –

+0

이것은 그 것이다. 이런 일을 위해서. 그리고 그 이유는 이들을 구성 요소로 변환하는 것이 확실하지 않기 때문입니다. 단 한번만 사용되기 때문에 –

+1

여기에 모델을 편집 할 논리가 있는지 여부를 말하지 않습니다. 항상 여러분을 대신 할 수있는 한 가지 방법은 프레젠테이션 모델 (http://blogs.adobe.com/paulw/archives/2007/10/presentation_pa_3.html)을 사용하여 로직 부분을 개별적으로 분리하는 것입니다. 그런 식으로보기가 바뀌는 모양을 바꾸거나 다른 모양의보기 (예 : 다른 장치)에서 동일한 내용을 변경해야하는 경우 논리를 복제 할 필요가 없습니다. TDD에 있다면 테스트도 쉽습니다. –

답변

0

당신에게 (이 동적 값이 같은 즉, 난 여전히 내보기에서 lblURL을 수정할 수 있도록하고 싶습니다) 옳은 길을 따라 가면 Amy가 게시 한 링크는입니다. 그것을 배치하는 방법의. 더 완벽한 솔루션을위한 프레임 워크/도구 인 cairngorm and parsely에 관심이있을 수도 있습니다.

하지만 지금은보기의 일부를 구성 요소로 분리하는 것이 좋은 출발이라고 생각합니다.

당신은 여전히 ​​주요 애플 리케이션에 라벨을 수정할 수 있습니다 (예) :

<views:myBox id="box" /> 
<s:Button click="{box.myLabel.text = 'changed'}" /> 

myBox.mxml :

<?xml version="1.0" encoding="utf-8"?> 
<s:BorderContainer xmlns:fx="http://ns.adobe.com/mxml/2009" 
        xmlns:s="library://ns.adobe.com/flex/spark" 
        xmlns:mx="library://ns.adobe.com/flex/mx" width="400" height="300"> 
    <s:Label id="myLabel" text="this is my label" /> 
</s:BorderContainer> 
+0

Spot on! 그것이 내가 성취하고자했던 것입니다. 감사 –

관련 문제