본문 바로가기

나는개발자다/GWT

ClientBundle 사용하자. ( ImageBundle )

GWT로 작업할 때 이미지 처리를 빠르게 하는 방법이다.
여러 이미지를 하나로 묶어 HTTP 왕복 처리를 감소시킨다.
즉 이미지가 3개일 경우 3번에 걸쳐 처리하는것이 아니라 한번에 처리한다.

구현하기는 상당히 쉽다.
1. inherite
 <inherits name="com.google.gwt.resources.Resources" />

 

2. 소스.
  
import com.google.gwt.core.client.GWT;
import com.google.gwt.resources.client.ClientBundle;
import com.google.gwt.resources.client.ImageResource;
 
public interface MyImageResrouce extends ClientBundle
{
    // I added this line below
    public static final Resources INSTANCE =  GWT.create(MyImageResrouce.class);
 
    @Source("images/buzz.JPG")
    ImageResource buzz();
    @Source("images/close.jpg")
    ImageResource close(); 
}
 
이미지 번들을 위한 작업은 끝이다.
참고로 경로가 다르면 컴파일 에러 발생시킨다. 
주의 할 점
  • image가 소스폴더 or 패키지이다. 나는 images 라는 패키지를 만들고 이미지 화일을 등록하였다.
  • 세미콜론 위치를 봐야한다. @Source 부분에서  '; ' 이 없다.
  

실제 사용하는 방법은

new PushButton(new Image(MyImageResrouce.INSTANCE.close());


이 사이트 참조하면 더 쉽다.
http://www.giantflyingsaucer.com/blog/?p=1101 

http://code.google.com/intl/ko-KR/webtoolkit/doc/latest/DevGuideClientBundle.html
code.google.com 사이트 중에 @option이라는 어노테이션 태그가 존재한다. 봐라.