[원본문서]

http://vicki.springnote.com/pages/2106692

FCKEditor for RCP

Vicki Yi

Version 0.1 Copyright ⓒ 2008 Vicki Yi

16.11.2008

---

요약

이 문서는 Rich Client Platform (이하 RCP) 에서 FCKEditor 를 이용하여 HTML 문서를 작성할 수 있는 번들에 대한 소개와 사용법을 설명합니다.

SWT 에서 제공하는 StyledText 위짓의 텍스트를 HTML로 변환하기에는 추가적인 작업이 많이 필요하기 때문에 이클립스의

EPF 프로젝트

의 RichText의 소스를 참고하여

FCKEditor

를 간단하게 사용할 수 있도록 구현을 하였습니다. (FCKEditor 의 라이센스는

해당문서

를 참조하시기 바랍니다.)

설치하기

테스트환경

• 
  Eclipse: Ganymede (3.4)
  


• 
  JDK: 1.6.0_07
  


• 
  Platform: Windows XP
  

설치

아래 참고자료의

kr.co.vicki.plugins.fckeditor.zip

를 내려받아 이클립스 설치 디렉토리에 압축을 풀고 이클립스를 재시작합니다.

해당 플러그인은 다음 플러그인들을 필요로 합니다.

• 
  org.eclipse.core.runtime
  


• 
  org.eclipse.ui
  


• 
  com.ibm.icu
  

사용법

1. 
   

   
   사용하는 플러그인이나 RCP에 Dependencies 목록에 kr.co.vicki.plugins.fckeditor 를 추가합니다.
   

   
   

   
   
   

   
   

   
   
   [그림 1] plugin.xml 의 Dependencies 탭
   
   

   
   

   
   

   
   


2. 
   

   
   해당 플러그인이나 RCP를 실행시키고 Show View 를 통해
   
   FCKEditor Tester
   
   View 를 선택합니다.
   

   
   

   
   
   

   
   

   
   
   [그림 2] Eclipse의 Show View
   
   

   
   

   
   

   
   


3. 
   

   
   추가된 FCKEditor Tester 는 다음과 같습니다. GetHTML 버튼을 클릭할 경우 본문 내용이 콘솔에 찍히게 됩니다. SetHTML의 버튼의 경우에는 테스트 용으로 붙여놓았습니다.
   
   
   

   
   

   
   
   [그림 3] FCKEditor Tester View
   
   
   

   
   


4. 
   

   
   FCKEditor Tester View 의 소스는 다음과 같습니다.
   
   
   [코드 1] FCKEditorView.java
   
   
   

   
   
   
   

   
   
   
   
   
   
   
   
   
   

   public class FCKEditorView extends ViewPart { private FCKEditor editor; @Override public void createPartControl ( Composite parent ) { editor = new FCKEditor ( parent, SWT.NONE ) ; initializeToolBar () ; } @Override public void setFocus () { editor.setFocus () ; } private void initializeToolBar () { IToolBarManager toolBarManager = getViewSite () .getActionBars () .getToolBarManager () ; toolBarManager.add ( new GetHTMLAction ()) ; toolBarManager.add ( new SetHTMLAction ()) ; } class GetHTMLAction extends Action { public GetHTMLAction () { setText ( "GetHTML" ) ; } public void run () { System.out.println ( editor.getHTML ()) ; } } class SetHTMLAction extends Action { public SetHTMLAction () { setText ( "SetHTML" ) ; } public void run () { editor.setHTML ( "Test HTML" ) ; } } }

   
   

   
   
   
   

   
   
   

   
   


5. 
   

   
   위 코드에서 사용한 FCKEditor 객체를 parent Composite 에 붙이면 RCP에 FCKEditor를 확인할 수 있습니다.
   

   
   

   
   FCKEditor 의 주요 메소드는 다음과 같습니다.
   
   

   
   
   
   
   String kr.co.vicki.plugins.fckeditor.editor.FCKEditor.getHTML()
   
   
   FCKEditor의 HTML을 반환홥니다.
   
   
   
   
   

   
   
   void kr.co.vicki.plugins.fckeditor.editor.FCKEditor.setHTML(String html)
   
   
   FCKEditor의 HTML을 설정합니다.
   
   

   
   

   
   Parameters: html
   

   
   

   
   

   
   
   
   

   
   

   
   


6. 
   

   
   FCKEditor 의 툴바를 변경하기 위해서는 플러그인 내부의 fckeditor 디렉토리에 있는 custom.config.js와 fckconfig.js 파일을 수정합니다.
   
   수정할 설정은
   
   해당페이지
   
   를 참고합니다.
   

   
   

   
   
   
   
   [그림 4] FCKEditor config 파일
   
   
   

   
   

문제점/개선사항

• 
  FCKEditor 를 추가할 경우 해당 위짓에 세로 스크롤바가 생김
  


• 
  툴바를 JAVA 소스 내에서 설정할 수 있도록 수정
  

관련자료

1. 
   
   kr.co.vicki.plugins.fckeditor.zip
   
   FCKEditor 번들 플러그인
   


2. 
   
   http://www.eclipse.org/epf/
   
   Eclipse Process Framework Proejct
   


3. 
   
   http://www.fckeditor.net/
   
   FCKeditor
   


4. 
   
   http://en.wikipedia.org/wiki/RCP
   
   위키피디아 RCP
   


5. 
   
   http://www.java2s.com/Tutorial/Java/0280__SWT/BrowserqueryDOMnodevalue.htm
   
   Browser: query DOM node value
   

이 글은

스프링노트

에서 작성되었습니다.