머드초보의 블로그

보통 DataGrid에서 ScrollBar는 아이템개수가 화면에 표시하는 개수보다 많으면 생기는데요. 개수가 많을 수록 Thumb부분이 더 작아지죠. 이 Thumb크기를 고정시키려면 찾아본 결과 Scrollbar속성에 scrollThumb부분이 있는데, 그걸 없애고, 새로 고정된 Thumb으로 교체를 시키는 방법이 있더라구요.

http://npacemo.com/wordpress/2008/05/20/flex-3-designer-scrollbar-fixed-size-scrollthumb/
소스는 자세히 보시면 그리어렵지 않지만, 이분께서 유틸을 너무 잘 만드셔서-_- 그냥 가져다 쓰시면 됩니다-_-

저 글에서는 Canvas의 스크롤바를 했지만, DataGrid라고 뭐 다를 거 없습니다.
음....데이터그리드는 커스텀 컴포넌트를 만드셔서 updateDisplayList를 오버라이딩해주시면 됩니다..

[code]
<?xml version="1.0" encoding="utf-8"?>
<mx:DataGrid xmlns:mx="http://www.adobe.com/2006/mxml">
    <mx:Script>
        <![CDATA[
            import com.soribada.utils.fixedthumb.ScrollBarUtil;
           
            use namespace mx_internal;
           
            override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void
            {
                super.updateDisplayList(unscaledWidth, unscaledHeight);
                ScrollBarUtil.replaceScrollThumb(verticalScrollBar);
            }
        ]]>
    </mx:Script>
</mx:DataGrid>
[/code]
DataGrid는 verticalScrollBar라는 객체가 있는데, 이것을 고정된 ScrollBar로 바꿔주면 됩니다^^

PS. 그냥 뭐 전 찾는데 오래걸려서 혹시나 필요한 사람이 있을까봐 올립니다ㅠ

이번엔 DataGrid를 이용해봅시다!-_-;

예약 리스트를 받아와야하기 때문에 더 쉽습니다-_-; 이 DataGrid라는 놈이 너무 강력해서-_-; 자바Bean이랑 매우 잘 맞아요!

자바측에서 List형태로 리턴하게 되면 DataGrid의 dataProvider가 알아서 다 해줍니다.
우선 자바측의 예약 취소하기 메소드를 보도록 합시다.





[code]
public int BookCancel(int[] seatnum) {
  Connection con = null;
  PreparedStatement pstmt = null;
  ResultSet rs = null;

  try {
   String jdbcDriver = "jdbc:apache:commons:dbcp:/pool";
         con = DriverManager.getConnection(jdbcDriver);
   // 현재 요청된 변호레코드의 ID와 좌석번호, ID와 맞는 비번을 추출
   for (int i=0; i<seatnum.length; i++) {
    pstmt = con.prepareStatement("DELETE FROM bs_Book WHERE seatnum = ?");
    pstmt.setInt(1, seatnum[i]);
    pstmt.executeUpdate();
   
    pstmt = con.prepareStatement(
                "UPDATE bs_Seat SET isbooked='X' WHERE seatnum = ?");
    pstmt.setInt(1, seatnum[i]);
    pstmt.executeUpdate();
   }
   return 1;
  } catch (SQLException e) {
   e.printStackTrace();
   return 0;
  } finally {
   if (rs != null) try { rs.close(); } catch(SQLException ex) {}
   if (pstmt != null) try { pstmt.close(); } catch(SQLException ex) {}
   if (con != null) try { con.close(); } catch(SQLException ex) {}
  }
 }
[/code]
아 이거 배열로 처리하려고 했는데 DataGrid에서 다중선택을 할 줄 모르겠어요-_- 아는 사람 좀 가르쳐주세요!

어쨌든-_-; 한개만 넘겼다고 치고 해봅시다. 해당 좌석번호를 찾아서 bs_Book테이블에서 삭제를 하고 bs_Seat테이블에는 예약여부(isbooked)에 X로 바꿔주면 끝납니다.

이제 플렉스로 가봅시다.

[code]
<?xml version="1.0" encoding="utf-8"?>
<mx:Panel xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical"
  width="100%" height="100%" title="예약취소하기">
 <mx:Script>
  <![CDATA[
   import mx.rpc.events.ResultEvent;
   import mx.rpc.events.FaultEvent;
   import mx.rpc.remoting.RemoteObject;
   import mx.controls.Alert;
   
   private function bookCancel():void {
    var cancellist:Array = new Array();
    var srv:RemoteObject = new RemoteObject();
    var i:int;
    srv.destination = "booksystem";
   
    if (dg.selectedItem == null){
     Alert.show("좌석을 선택하세요!");
     return;
    }
    cancellist.push(int(dg.selectedItem.seatnum));
   
    srv.BookCancel(cancellist);
   
    srv.addEventListener("result", resultHandler);
    srv.addEventListener("fault", faultHandler);
   }
   
   // Result Handler
   private function resultHandler(event:ResultEvent):void {
    var result:int = int(event.result);
   
    switch (result) {
     case 0 :
      Alert.show("DB오류입니다.");
      break;
     case 1 :
      Alert.show("예약취소가 완료되었습니다.");
      parentApplication.viewstack.selectedChild = parentApplication.ViewHome;
      break;
    }
   }
   private function faultHandler(event:FaultEvent):void {
    mx.controls.Alert.show("실패 메세지: " + event.fault.message);
   }
   
   public function UpdateBookcancel():void {
    var srv:RemoteObject = new RemoteObject();
    srv.destination = "booksystem";
    srv.addEventListener("result", bookresultHandler);
    srv.addEventListener("fault", bookfaultHandler);
    srv.getBook(parentApplication.loginid);
   }
   private function bookresultHandler(event:ResultEvent):void {
    dg.dataProvider = event.result;
    parentApplication.viewstack.selectedChild=parentApplication.ViewBookCancel;
   }
   private function bookfaultHandler(event:FaultEvent):void {
    mx.controls.Alert.show("실패 메세지: " + event.fault.message);
   }
  ]]>
 </mx:Script>
 
 <mx:DataGrid id="dg" width="100%" height="100%" />
 <mx:ControlBar horizontalAlign="center">
  <mx:Button label="예약취소하기" click="bookCancel()"/>
 </mx:ControlBar>
</mx:Panel>

[/code]
우선 UpdateBookcancel을 실행하게 되면 getBook함수를 호출하는데 이 함수는 예약리스트를 List객체에 받아오는 역할을 합니다.

dg.dataProvider = event.result; (dg는 DataGrid의 id)

이 결과를 그냥 dg.dataProvider에 처 넣으면 됩니다-_-; 그러면 알아서 테이블로 표시가 됩니다.

그리고 해당줄을 선택하고, 예약취소버튼을 누르면 bookCancel함수를 호출하는데 여기서 자바클래스에 있는 BookCancel함수를 호출하게 됩니다.

선택된 좌석은 dg.selectedItem.seatnum 이렇게 하면 알 수 있습니다.