JWorld@TW the best professional Java site in Taiwan
      註冊 | 登入 | 全文檢索 | 排行榜  

» JWorld@TW » AJAX討論區 » GWT  

按列印兼容模式列印這個話題 列印話題    把這個話題寄給朋友 寄給朋友    訂閱主題
reply to postflat modego to previous topicgo to next topic
本主題所含的標籤
作者 Gwt Clock Component Sample
kentyeh





發文: 647
積分: 6
於 2010-02-23 20:35 user profilesend a private message to userreply to postreply to postsearch all posts byselect and copy to clipboard. 
ie only, sorry for netscape users:-)add this post to my favorite list
這是利用Gwt-Canvas專案與Mozilla的Canvas教學An animation example 2的範例所改寫的Component

首先,使用這個Clock Component ,您的專案的class path必須 Include gwt-canvas.jar,這個jar檔與官方的下載檔有點不同,是我從Svn下載最新的檔案,重新compile而來,如果您使用的是官方的下載檔,則將無法使用此Clock Component

其次,下載GwtClock.jar,並在您的Gwt專案module file XXX.gwt.xml加入以下設定
1
<inherits name="gwt.canvas.clock.GwtClock"/>


以下為Sample Code
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
public class ClockDemo implements EntryPoint {
  @Override
  public void onModuleLoad() {
    FlexTable tbl = new FlexTable();
    tbl.setText(0, 0, " ");
    tbl.setWidget(0, 1, new Label("width"));
    final TextBox w = new TextBox();
    w.setText("400");
    tbl.setWidget(0, 2, w);
    tbl.setText(0, 3, " ");
    
 
    tbl.setText(1, 0, " ");
    tbl.setWidget(1, 1, new Label("height"));
    final TextBox h = new TextBox();
    h.setText("400");
    tbl.setWidget(1, 2, h);
    tbl.setText(1, 3, " ");
 
    final WallClock clock1 = new WallClock(400,400);
    final DigitalClock clock2 = new DigitalClock(400,400);
    
    tbl.getFlexCellFormatter().setColSpan(2, 0, 4);
    tbl.getFlexCellFormatter().setHorizontalAlignment(2, 0, HasHorizontalAlignment.ALIGN_CENTER);
    Button btn = new Button("Size reset", new ClickHandler() {
      @Override
      public void onClick(ClickEvent event) {
        clock1.setSize(w.getText(), h.getText());
        clock2.setSize(w.getText(), h.getText());
      }
    });
    tbl.setWidget(2, 0, btn);
    
    CheckBox cb = new CheckBox("Show date");
    cb.setValue(clock1.isShowDate());
    cb.addValueChangeHandler(new ValueChangeHandler() {
      @Override
      public void onValueChange(ValueChangeEvent event) {
        clock1.setShowDate(event.getValue());
        clock2.setShowDate(event.getValue());
      }
    });
    tbl.getFlexCellFormatter().setColSpan(3, 0, 4);
    tbl.getFlexCellFormatter().setHorizontalAlignment(2, 0, HasHorizontalAlignment.ALIGN_CENTER);
    tbl.setWidget(3, 0, cb);
    tbl.setWidget(4, 0, clock1);
    tbl.getFlexCellFormatter().setColSpan(4, 0, 2);
    tbl.setWidget(4, 1, clock2);
    
    RootPanel.get().add(tbl);
  }  
}

若是要自定您的Clock,您可以繼承自Clock,主要必須實做
1
2
3
4
@Override
protected void paint() {
  //在此進行繪圖
}


必要時可覆寫以下method
1
2
3
4
5
@Override
protected void sync(){
  //在此決定時間同步方式,如果不改寫,則預設採用Client end 時間
  setNow(new Date());
}


另有兩個method 必須加以說明,
1
2
isInSync();     //判斷是否正在進行時間同步
isSyncError();  //判斷上一次同步是否失敗,如果上一次同步時間失敗,則3秒後再次進行時間同步

以下為Sample畫面


reply to postreply to post
話題樹型展開
人氣 標題 作者 字數 發文時間
1783 Gwt Clock Component Sample kentyeh 3122 2010-02-23 20:35
1152 Re:Gwt Clock Component Sample kentyeh 64 2010-04-22 14:48
» JWorld@TW »  AJAX討論區 » GWT

reply to postflat modego to previous topicgo to next topic
  已讀文章
  新的文章
  被刪除的文章
Jump to the top of page

JWorld@TW 本站商標資訊

Powered by Powerful JuteForum® Version Jute 1.5.8