일반 웹처럼 DataGrid에서 아래에 페이지번호를 달아서 페이징을 하면 좀 이상할 것 같아서, 우아하게 DataGrid의 스크롤이 맨 아래에 닿으면 다음 페이지를 읽어서 DataGrid의 아래에 추가해 주는 방법을 생각해냈다. 뭐, 사실 Grid를 사용하는 대부분의 프로그램들이 이렇게 한다. 하지만, Flex의 DataGrid에는 명시적으로 스크롤이 맨 아래에 닿았을 때 발생시키는 이벤트가 없어서 좀 고민을 많이 했다.
DataGrid에 scroll="scrollHandler(event)"
이렇게 scroll 이벤트를 이벤트핸들러에 연결시킨다.
아래는 이벤트핸들러 메소드
private function scrollHandler(event:ScrollEvent):void {
if (grid.maxVerticalScrollPosition == event.position
&& event.delta > 0) {
// do something
DataGrid에 scroll="scrollHandler(event)"
이렇게 scroll 이벤트를 이벤트핸들러에 연결시킨다.
아래는 이벤트핸들러 메소드
private function scrollHandler(event:ScrollEvent):void {
if (grid.maxVerticalScrollPosition == event.position
&& event.delta > 0) {
// do something
Alert.show("end of Vertical scroll");
}
}
event.delta > 0
이 부분은 스크롤을 맨 아래에 닿은 상태에서 계속 당기면 scroll 이벤트가 계속 발생하기 때문에, 끝에 닿은 상태에서 더 이상 못 움직일 때는 이벤트 처리를 하지 않도록 하기 위해서 사용했다.
이렇게 간단하게 끝날 문제는 사실 아니다. 스크롤바를 맨 아래서 올렸다 내렸다 하면 자꾸 이벤트가 발생하니까 같은 페이지를 중복해서 요청하지 않도록 하는 코드도 들어가야 할 것 같다.
}
}
event.delta > 0
이 부분은 스크롤을 맨 아래에 닿은 상태에서 계속 당기면 scroll 이벤트가 계속 발생하기 때문에, 끝에 닿은 상태에서 더 이상 못 움직일 때는 이벤트 처리를 하지 않도록 하기 위해서 사용했다.
이렇게 간단하게 끝날 문제는 사실 아니다. 스크롤바를 맨 아래서 올렸다 내렸다 하면 자꾸 이벤트가 발생하니까 같은 페이지를 중복해서 요청하지 않도록 하는 코드도 들어가야 할 것 같다.
'Flex' 카테고리의 다른 글
Flex + BlazeDS + Java 웹프로젝트용 Ant Build.xml (0) | 2009.08.20 |
---|---|
Flex I18N 메시지 컴파일용 Ant Build.xml (0) | 2009.07.01 |
id를 이용한 정적/동적 컴포넌트 참조 (0) | 2009.05.19 |
아주 유용한 이클립스 단축키 (0) | 2009.05.19 |
Flex에서 Java의 HashMap과 같은 기능 사용 (0) | 2009.05.15 |