봉 블로그

Gwt-ext 개발환경 셋팅 본문

개발환경

Gwt-ext 개발환경 셋팅

idkbj 2009. 8. 13. 17:41

참고url : http://gwt-ext.com/wiki/index.php?title=Using_Eclipse

위 문서를 그대로 해석하진 않았으며 참고해서 작성했습니다. 전체 셋팅 절차는 아래와 같습니다.
  • cypal studio plugin 설치 및 프로젝트 생성
  • 모듈생성
  • 필요라이브러리 설치
  • demo 예제 test

cypal studio plugin 설치 및 프로젝트 생성
이플러그인은 gwt 개발을위한 플러그인이다. 없어도 개발할수 있지만 일손을 많이 덜어준다.
본블로그의 http://idkbj.tistory.com/entry/Cypal-Studio-set1 에 따라 설치하고, 프로젝트 생성까지 작업하면 된다.

모듈 생성
역시 http://idkbj.tistory.com/entry/Cypal-Studio-set1  글을 참고하여 모듈을 생성한다.
패키지나 모듈명은 자유롭게 정한다.
아래는 모듈생성시 패키지를 demo 로 모듈명은 MyFirstGWT 로 했을때의 사진입니다.


필요라이브러리 설치
다음 두가지의 라이브러리가 필요하다.

 gwtext-2.0.6.jar 를 다운 받고  Build Path 에 추가한다. 저는 lib폴더안에 다운받아 Build Path에 추가하였습니다.
ext-2.0.2.zip를 다운받고 압축을 푼후 다음 파일들을 demo.public.js.ext 폴더에 카피합니다.



demo.MyFirstGWT.gwt.xml 파일을 아래와 같이 편집합니다.

아래 3줄은 demo.public.MyFirstGWT.html 파일에 설정해도 됩니다. gwt ext demo예제는 html파일에 설정되있습니다.
여기까지가 개발환경구축이구요. 이제 모듈 파일에 demo 예제 코드를 삽입해서 실행해보겠습니다.

demo 예제 test

간단한 Panel 예제를 test해 보겠습니다.
demo.client.MyFirstGWT.java 파일을 다음과 같이 코딩합니다.
package demo.client;

import com.google.gwt.core.client.EntryPoint;

import com.google.gwt.user.client.ui.RootPanel;

import com.gwtext.client.widgets.Panel;



public class MyFirstGWT implements EntryPoint {



   public void onModuleLoad() {



      Panel mainPanel = new Panel() {

         {

            setTitle("Hello World!");

            setHeight(300);

            setWidth(500);

            setFrame(true);

            setHtml("<p>This is my first GWT-Ext webpage and it was a breeze to design!</p>");

            setStyle("margin: 10px 0px 0px 10px;");

         }

      };



      RootPanel.get().add(mainPanel);

   }

}


다음과 같이 실행할수 있습니다.

실행결과 다음과 같이 나오면 성공입니다.

'개발환경' Related Articles more