package com.joinc.client; 
 
import com.google.gwt.core.client.EntryPoint; 
import com.google.gwt.user.client.Window; 
import com.google.gwt.user.client.ui.Button; 
import com.google.gwt.user.client.ui.ClickListener; 
import com.google.gwt.user.client.ui.LoadListener; 
import com.google.gwt.user.client.ui.RootPanel; 
import com.google.gwt.user.client.ui.Widget; 
import com.jpavel.gwt.wysiwyg.client.Editor; 
 
/** 
 * Entry point classes define <code>onModuleLoad()</code>. 
 */ 
public class RitchTest implements EntryPoint { 
     
    public void onModuleLoad() { 
        buildSamplePage(); 
    } 
     
    public void buildSamplePage() { 
        final Editor editor = new Editor(); 
        editor.addLoadListener(new LoadListener() { 
            public void onLoad(Widget sender) { 
                // 적당한 코드를 입력 
            } 
             
            public void onError(Widget sender) { 
                // 적당한 코드를 입력  
            } 
        }); 
        editor.setWidth("100%"); 
        editor.setHeight("300px"); 
         
        editor.load(); 
         
        Button button = new Button("Get HTML"); 
        button.addClickListener(new ClickListener() { 
            public void onClick(Widget sender) { 
                Window.alert(editor.getHTML()); 
            } 
        }); 
         
        RootPanel.get().add(editor); 
    } 
} 
 

src/com/joinc/RitchTest.gwt.xml 파일을 열어서, 모듈을 추가시켜 준다.

<module> 
        <!-- Specify the app entry point class.                   --> 
        <entry-point class='com.joinc.client.RitchTest'/> 
 
        <!-- Inherit the core Web Toolkit stuff.                  --> 
        <inherits name='com.google.gwt.user.User'/> 
 
        <!-- Inherit the Editor Library.                          --> 
        <inherits name='com.jpavel.gwt.wysiwyg.Editor'/> 
        <inherits name='com.joinc.RitchTest'/> 
</module> 
 

마지막으로 RitchTest-compile에 editor-0.1.1-preview.jar 의 경로를 추가시키도록 한다.

#!/bin/sh 
APPDIR=`dirname $0`; 
java  -cp "$APPDIR/src:...:/work/dir/editor-0.1.1-preview.jar" \ 
com.google.gwt.dev.GWTCompiler -out "$APPDIR/www" "$@" com.joinc.RitchTest; 
 

다음은 eclipse에서 호스트모드 브라우저를 통해서 디버깅한 모습이다.

보내는 사람 Google

java-to-javascript를 이용해서 컴파일 한 후, 사이트에 올린 결과다. 테스트해보기 바란다.

4 맺음말

GWT가 Java기술을 사용함으로 개발자는 다음과 같은 이득을 얻을 수 있다.

• 객체지향적인 재사용가능한 코드 생성
  
• 손쉬운 배포 및 문서화
  
  

GWT를 이용하면 브라우저 호환성이 의심되는 관리하기도 까다로운 난잡한 HTML&Javascript 코드를 직접제어 하는 것보다, 깔끔한 환경을 제공해 줌을 알 수 있을 것이다. 웹응용 개발도, 윈도우응용 처럼 각각의 컴포넌트를 가져다 붙이는 식의 개발이 가능할 때가 도래하지 않을까 싶다.

이미 GWT를 이용한 비쥬얼한 개발이 가능한 eclipse 플러그인도 제공되고 있다. 아직 완성도가 떨어지긴 하지만 관심이 있다면 아래의 사이트를 방문해 보기 바란다.

• http://download.instantiations.com/DesignerDoc/integration/latest/docs/html/gwt/rich_editing_experience.html
  

5 할일

• 사용자 정의 위젯의 생성및 등록
  
• GWT 기본제공 위젯을 사용한 복잡한 UI구성
  
  

6 참고문헌

• wikipedia Google Web Toolkit
  
• code.google.com Gwt Widget 갤러리
  
  

문서가 도움이 되었나요?

아주 많이 7 (53.85 %) 많이 1 (7.69 %) 그럭저럭 1 (7.69 %) 별로 1 (7.69 %) 전혀 3 (23.08 %) 총 투표 13

태그 : google GWT eclipse