'gwt-ext' 태그의 글 목록 (3 Page)

[gwt-ext] TabPanel - autoDestory ...

Google/GWT / 2008. 3. 16. 04:00

오늘도 열심히 삽질을 했습니다.

extjs 에 있는 TabPanel 은 autoDestroy 라는 속성을 설정할 수 있습니다.

해당 속성을 지정하면 자식 패널들을 제거할 때 자동으로 지울 것이냐는 건데...

기본 값은 true 입니다. false 면 자식 요소들이 안 없어지는 거죠...

전 showcase 예제를 보면서 아무 생각없이 autoDestroy 속성을 false 로 설정을 했습니다.

그러고 난 후에 탭의 자식요소를 닫으면 다른 탭으로 붙는 것이였습니다.

메모리가 연결되어 있으면 이렇게 되는건가... 아니면 내가 뭘 잘못 설정한건가...

고민고민을 하다가... tabPanel 의 이 속성을 찾아냈습니다. (장장.. 2시간 여...)

이 속성을 false 로 설정할 경우에는 tabPanel 의 TabPanelListener 에 onRemove 메소드를

오버라이드 하는 등의 여러 작업을 해야 합니다. 저는 설정해보다가 잡시 접어 두었습니다.

대충 ShowCase2 의 소스는 다음과 같습니다.

private void addNodeClickListener(TreeNode node, final Panel panel, final String iconCls) { if (panel != null) { node.addListener(new TreeNodeListenerAdapter() { public void onClick(Node node, EventObject e) { String panelID = panel.getId(); if (appTabPanel.hasItem(panelID)) { showScreen(panel, null, null, node.getId()); } else { TreeNode treeNode = (TreeNode) node; panel.setTitle(treeNode.getText()); String nodeIconCls = iconCls; if (iconCls == null) { nodeIconCls = ((TreeNode) treeNode.getParentNode()).getIconCls(); } showScreen(panel, treeNode.getText(), nodeIconCls, node.getId()); } } }); } } public void showScreen(String historyToken) { if (historyToken == null || historyToken.equals("")) { appTabPanel.activate(0); } else { Record record = store.getById(historyToken); if (record != null) { ShowcasePanel panel = (ShowcasePanel) record.getAsObject("screen"); String title = record.getAsString("title"); String iconCls = record.getAsString("iconCls"); showScreen(panel, title, iconCls, historyToken); } } } public void showScreen(Panel panel, String title, String iconCls, String screenName) { String panelID = panel.getId(); if (appTabPanel.hasItem(panelID)) { appTabPanel.scrollToTab(panel, true); appTabPanel.activate(panelID); } else { if (!panel.isRendered()) { panel.setTitle(title); if (iconCls == null) { iconCls = "plugins-nav-icon"; } panel.setIconCls(iconCls); } appTabPanel.add(panel); appTabPanel.activate(panel.getId()); } History.newItem(screenName); }

그냥 마음편하게 autoDestroy 속성은 건들이지 않는 것이 정신건강에 좋습니다~

Posted by 자수씨

, |

[gwt-ext] tabPanel 에서 childPanel 의 id 설정시 주의사항

Google/GWT / 2008. 3. 12. 16:33

gwt-ext (extjs library) 에서는 TabPanel을 쉽게 사용할 수 있도록 제공해줍니다.

childPanel 을 추가한 뒤에 해당 childPanel 을 다시 부를 경우 TabPanel::hasItem() 메소드를

이용해서 해당 id 의 panel 이 있는지 없는지를 확인한 후에 TabPanel::activate() 메소드를 호출합니다.

하지만 childPanel 의 id 를 설정할 때 id 값에 따라 문제가 발생할 수 있습니다.

Posted by 자수씨

, |

[rocket-gwt] GWT에도 IoC 를 적용

Google/GWT / 2008. 3. 9. 00:56

지금 gwt-ext 의 Grid 를 rocket-gwt 의 IoC 를 이용하여 구성중에 있습니다.

ColumnConfig 배열을 bean 으로 선언하고 그리드 타입에 따라서 컬럼 구성이

바뀌는 것을 xml 에서 관리하도록 구성하였습니다.

자세한 사항은 추후 블로그에서 소개합니다~

Posted by 자수씨

, |

[gwt-ext] GWT에서 json 콜백 받기 - AsyncJsonCallback

Google/GWT / 2008. 3. 6. 21:24

이전 포스트를 참고하셔서 JSON Serialization 을 먼저 확인하세요~~ http://vicki.tistory.com/36

Listing 1. JSON을 넘겨주는 async callback

위와 같이 callback 클래스를 만든 후에 다음과 같이 사용합니다.

Listing 2. callback 클래스 사용법

Listing 2 에서 MailList.class를 생성자의 파라미터로 넘기지 않는 이유는 GWT 컴파일러가

Class 클래스로 파라미터를 넘기면 host-mode 에서는 잘 되다가 컴파일할 때 오류를 뱉어냅니다.

오류 내는 부분 찾아서 수정할까 하다가 한도 끝도 없을 것 같아서 다음과 같이 샤샤샥~~

이제 JSONObject 가 있으니 gwt-ext 에서도 grid 데이터를 넣을 수 있습니다.

혹시 다른 좋은 방법이 있으시면 쫌;;;;

Posted by 자수씨

, |

[Book] Prototype & Scriptaculous 인 액션

Book/IT 관련 / 2008. 3. 5. 02:33

PROTOTYPE & SCRIPTACULOUS 인 액션 상세보기

데이브 크레인 지음 | 위키북스 펴냄

일반적인 Ajax 작업은 쉬워야만 하고 이러한 간편함의 중심에 Prototype과 Scriptaculous가 있다. Prototype은 자바스크립트를 안전하고 일관성 있는 방법으로 확장하는 헬퍼 메소드와 오브젝트들을 제공한다. 그리고 이러한 Prototype의 기반 위에 개발된 Scriptaculous는 풍부한 UI 개발을 위해 미리 개발된 편리한 위젯들을 제공한다. 실무에 적용할수 있는 다양한 예제와 함께 쉽게 강력한 UI를 개발해 보자..

회사 아저씨가 GWT 인 액션 감수하시면서 위키북스에서 받으신 책

원래 내 주특기는 자바 스크립트였는데.... 크윽...

Yahoo-UI 와 ext-js 가 멋진 UI로 기를 죽이는 시점에

prototype 으로 자바스크립트의 기초를 다진다면~~ script.aculo.us 는 쩜 약한 면이 있지만

스크립트의 기초는 prototype!!!! 근데 Yahoo-UI는 왜 event 방식이 틀린게냐 ㅠ_ㅠ...

Yahoo-UI 책도 나와달라!!! 아님 내가 한권 써볼까나 ㅋㅋㅋㅋ

Posted by 자수씨

, |

[GWT] json 객체로 변환하는 방법들

Google/GWT / 2008. 3. 1. 14:28

원문 : http://groups.google.com/group/Google-Web-Toolkit/msg/e6bf7acc9d16af6b

#1
http://xstream.codehaus.org/
Server 단에서 손쉽게 XML과 json으로 변경할 수 있는 라이브러리 제공

#2
there is no JSON_RPC in default tookit api, Simply use plain HTTP
rquest (e.g. restfull) and convert results to JSON object
GWT-RPC를 쓰지 않는 다는 소리인지;; 쩝;; 영어는 인생의 벽 ㅠ_ㅠ

#3
http://code.google.com/p/rocket-gwt/wiki/JsonSerialization
GWT client 단에서 사용할 수 있는 json 라이브러리

#4
http://code.google.com/p/gwt-api-interop/
요건 Java Script 단에서 사용할 수 있는 라이브러리

gwt-ext 를 하려다 보니 GWT-RPC의 반환 값을 grid에 적용시키기에는

공통을 뽑기가 어려워서 json으로 변환하여 사용해보려고 시도중입니다.

Posted by 자수씨

, |

gwt-ext 라이브러리를 내 GWT 프로젝트에서 사용하기

Google/GWT / 2008. 2. 29. 16:54

먼저 해당 프로젝트 사이트(http://gwt-ext.com/) 로 들어가서 GWT-Ext 라이브러리를 다운받습니다.

다운로드 경로는 요기~ http://gwt-ext.com/download/

gwtext.2.0.1.zip 파일을 다운받습니다.

깔끔하게 압축을 풀어줍니다.

압축을 풀면 다음과 같은 폴더와 파일들이 나옵니다.

doc 당연히 javadoc이겠죠~
samples demo가 컴파일되어 있는 폴더입니다.
gwtext.jar 이것이 라이브러리~

기존 GWT 프로젝트를 열고 라이브러리 폴더에 gwtext.jar를 붙여넣습니다.

이것만 넣는다고 끝나지는 않습니다.
프로젝트 설정파일을 열고 GwtExt 프로젝트를 inherit을 위한 설정을 추가해줍니다.

gwt 프로젝트 public 폴더에 나머지 파일들도 샤샤샥 넣어 줍니다.
물론 소스는 gwt-ext sample에서 참고를해서....
gwtext-2.0.1\samples\Showcase2\src\com\gwtext\sample\showcase2\public

Showcase2.html과 Showcase2.css를 제외한 나머지 파일을
복사해서 붙여 넣습니다.
사실 사용하지 않는 파일들도 있지만 귀차니즘 때문에????

Showcase2.css는 열어서 프로젝트의 css에 append 해주시면 되구요~
Showcase2.html은 열어서 자신의 프로젝트 html에 맞게 수정을 해줍니다.

<html>
<head>
    <title>Showcase2 Application</title>
    
    <style type="text/css">
        #loading {
            position: absolute;
            left: 45%;
            top: 40%;
            padding: 2px;
            z-index: 20001;
            height: auto;
            border: 1px solid #ccc;
        }
        #loading a {
            color: #225588;
        }

#loading .loading-indicator {
            background: white;
            color: #444;
            font: bold 13px tahoma, arial, helvetica;
            padding: 10px;
            margin: 0;
            height: auto;
        }

#loading-msg {
            font: normal 10px arial, tahoma, sans-serif;
        }
    </style>
	
    <link rel="stylesheet" href="변경하세요~ Showcase2.css">
</head>
<body>
<iframe id="__gwt_historyFrame" style="width:0;height:0;border:0"></iframe>

<div id="loading">
    <div class="loading-indicator">
        <img src="js/ext/resources/images/default/shared/large-loading.gif" width="32" height="32"
             style="margin-right:8px;float:left;vertical-align:top;"/>GWT-Ext<br/>
        <span id="loading-msg">Loading styles and images...</span></div>
</div>

<link rel="stylesheet" type="text/css" href="js/ext/resources/css/ext-all.css"/>
<link id="theme" rel="stylesheet" type="text/css" href="js/ext/resources/css/xtheme-gray.css"/>
<script type="text/javascript">document.getElementById('loading-msg').innerHTML = 'Loading Core API...';</script>

<script type="text/javascript" src="js/ext/adapter/ext/ext-base.js"></script>

<script type="text/javascript">document.getElementById('loading-msg').innerHTML = 'Loading UI Components...';</script>
<script type="text/javascript" src="js/ext/ext-all.js"></script>

<script type="text/javascript">document.getElementById('loading-msg').innerHTML = 'Initializing...';</script>

<script type="text/javascript" src="변경하세요~ com.gwtext.sample.showcase2.Showcase2.nocache.js"></script>

<script type="text/javascript">Ext.get('loading').fadeOut({remove: true, duration:.25});</script>
</body>
</html>

이 분들 아이디어에 감동을 받은 점은 js는 동기적으로 내려 받기 때문에

사용자들에게 어느정도까지 진행이 되는지를 알려준다는 점이었습니다.

가뜩이나 무거운 js들을 마냥 기다리는데 지치신 분들에게는 희소식~~

-----------------------------------------------------------------------------

준비는 완료되었습니다. 이제 gwt-ext를 사용해서 개발만 하면 되겠네요~

Posted by 자수씨

, |

gwt-ext 프로젝트 돌입!!!

Google/GWT / 2008. 2. 29. 14:40

항상 보면서 부러워만 했던 ext-js가 gwt로 라이브러리화 되어 나왔습니다.

이제 슬슬 만지작 만지작 해봐야 할 것 같네요 캬캭~

Posted by 자수씨

, |

불친절한자수씨

카테고리

달력

공지사항

최근에 올라온 글

최근에 달린 댓글

'gwt-ext'에 해당되는 글 28건

[gwt-ext] TabPanel - autoDestory ...

[gwt-ext] tabPanel 에서 childPanel 의 id 설정시 주의사항

[rocket-gwt] GWT에도 IoC 를 적용

[gwt-ext] GWT에서 json 콜백 받기 - AsyncJsonCallback

[Book] Prototype & Scriptaculous 인 액션

[GWT] json 객체로 변환하는 방법들

gwt-ext 라이브러리를 내 GWT 프로젝트에서 사용하기

gwt-ext 프로젝트 돌입!!!

글 보관함

최근에 받은 트랙백

링크

티스토리툴바