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

이 글은 스프링노트에서 작성되었습니다.

개인적으로 만들며 놀고 있는 플러그인들의 업데이트 사이트를 최신데이터로 갱신했습니다.

[업데이트 내역]
ㅁ CSS Sprites Viewer 제공
  - 해당 css 에 어떤 이미지 아이콘을 사용할 수 있는지 확인해주는 Viewer