2014-02-13 11 views
3

캔버스가 있고 그 캔버스 안에는 Vgroup.i에 해당 vgroup에 동적으로 그래픽 개체가 추가되어 있습니다. 4 개 이상의 그래픽 객체를 추가 한 후 위쪽 및 아래쪽 화살표를 활성화합니다.플렉스에서 캔버스에 세로 스크롤을 추가하는 방법은 무엇입니까?

이것은 내 캔버스 코드입니다.

  <mx:Canvas id="canvas" width="120"> 
      <s:VGroup id="levels" width="120"/> 
     </mx:Canvas> 

이것이 전체 코드

<s:VGroup> 
       <s:VGroup> 
        <s:HGroup> 
         <s:Spacer width="50"/> 
         <s:Image id="prev" source="../assets/navPrev.png" mouseOver="arrowImageMouseOver(event)" mouseOut="arrowImageMouseOut(event)" visible="false" 
           buttonMode="true" click="clickUpArrow()"/> 
        </s:HGroup> 

        <mx:Canvas id="canvas" width="120"> 
         <s:VGroup id="levels" width="120"/> 
        </mx:Canvas> 

        <s:HGroup> 
         <s:Spacer width="50"/> 
         <s:Image id="next" source="../assets/navNext.png" mouseOver="arrowImageMouseOver(event)" mouseOut="arrowImageMouseOut(event)" visible="false" 
           buttonMode="true" click="clickDownArrow()" /> 
        </s:HGroup> 
       </s:VGroup> 
     </s:VGroup> 

위, 아래 .. 내가 그렇게 할 수 canvas.How에 스크롤하려면 화살표를 클릭 할 때?

내가이 일을 시도했지만 높이가 필수입니다 있도록 항목은 수직 순서로 배열되어 있기 때문에

height="120"처럼 캔버스 구성 요소의 높이를 설정하기 위해 필요한이 당신을 도울 것입니다

private function clickUpArrow():void 
     { 
      canvas.verticalScrollPosition-=(levellength+10); 
     } 


     private function clickDownArrow():void 
     { 
      canvas.verticalScrollPosition +=(levellength+10); 

     } 

답변

0

희망을, 작동하지 않았다 수직 스크롤 바를 유효하게하는

<mx:Canvas id="canvas" height="120"> 
    <s:VGroup id="levels" width="120"/>    
</mx:Canvas> 

더 나은 당신은 마크 업 아래와 같이 대신 캔버스 (MX 구성 요소)의 Scroller 스파크 구성 요소를 사용합니다.

<s:VGroup> 
    <s:VGroup> 
     <s:HGroup> 
      <s:Spacer width="50"/> 
      <s:Image id="prev" source="../assets/navPrev.png" mouseOver="arrowImageMouseOver(event)" mouseOut="arrowImageMouseOut(event)" visible="false" 
        buttonMode="true" click="clickUpArrow()"/> 
     </s:HGroup> 

     <s:Scroller id="scroller" height="120" width="150">    
      <s:VGroup id="levels" width="120"/> 
     </s:Scroller>   

     <s:HGroup> 
      <s:Spacer width="50"/> 
      <s:Image id="next" source="../assets/navNext.png" mouseOver="arrowImageMouseOver(event)" mouseOut="arrowImageMouseOut(event)" visible="false" 
        buttonMode="true" click="clickDownArrow()" /> 
     </s:HGroup> 
    </s:VGroup> 
</s:VGroup> 
이 같은

위 아래 화살표 클릭 핸들러,

private function clickUpArrow():void 
{ 
    if(scroller.verticalScrollBar){ 
     scroller.verticalScrollBar.viewport.verticalScrollPosition -=(levellength+10); 
    } 

    //scroller.verticalScrollBar.changeValueByPage(false); 
} 

private function clickDownArrow():void 
{ 
    if(scroller.verticalScrollBar){ 
     scroller.verticalScrollBar.viewport.verticalScrollPosition -=(levellength+10); 
    } 

    //scroller.verticalScrollBar.changeValueByPage(true); 
}