以前曾写了一个用 GWT 1.7 的一个 全部的组建的测试.
现在花了 2 天时间将这些代码 改成了 UiBinder 的格式.
代码更加 精简.而且更加的漂亮.可以做很复杂的应用.
将布局 组建和业务逻辑 分开.
UiBinderTest01.ui.xml
内容如下:
<!DOCTYPE ui:UiBinder SYSTEM "http://dl.google.com/gwt/DTD/xhtml.ent"> <ui:UiBinder xmlns:ui="urn:ui:com.google.gwt.uibinder" xmlns:g="urn:import:com.google.gwt.user.client.ui"> <g:HTMLPanel> PushButton测试. <br></br> <g:PushButton text="PushButton测试." width="150px" height="25px" ui:field="button_0" /> Button测试. <br></br> <g:Button text="Button测试." width="150px" height="25px" ui:field="button1" /> <g:Button text="Button测试." width="150px" height="25px" ui:field="button2" /> CheckBox测试 <br></br> <g:CheckBox text="CheckBox测试" ui:field="checkBox_0" /> <g:CheckBox text="CheckBox测试" ui:field="checkBox_1" /> RadioButton测试 <br></br> <g:RadioButton name="abc" text="CheckBox测试" ui:field="radioButton_0" /> <g:RadioButton name="abc" text="CheckBox测试" ui:field="radioButton_1" /> <g:RadioButton name="abc" text="CheckBox测试" ui:field="radioButton_2" /> <br></br> TextBox测试 <br></br> <g:TextBox text="TextBox测试" ui:field="textBox_0" /> <g:Label ui:field="label_0" /> <br></br> ListBox测试 <br></br> <g:ListBox ui:field="listBox_0" width="150px" /> <g:ListBox ui:field="listBox_1" width="150px" /> <br></br> ListBox测试 <br></br> <g:Frame url="http://www.google.com" ui:field="frame_0" width="300px" height="100px" /> <br></br> RichTextArea测试 <br></br> <g:RichTextArea ui:field="richTextArea_0" width="300px" height="100px" /> <br></br> MenuBar测试 <br></br> <g:MenuBar ui:field="menuBar_0" width="500px" /> <br></br> TabBar测试 <br></br> <g:TabBar ui:field="tabBar_0" width="300px" /> <g:Label text="请点击TabBar." ui:field="tabBarLabel_0" width="300px" /> <br></br> Grid测试 <br></br> <g:Grid borderWidth="1" cellPadding="1" cellSpacing="1" ui:field="grid_0" width="300px" height="200px"> </g:Grid> <br></br> FlexTable测试 <br></br> <g:FlexTable borderWidth="1" cellPadding="1" cellSpacing="1" ui:field="flexTable_0" width="100%" height="100px" /> <br></br> Tree测试 <br></br> <g:Tree ui:field="tree_0" width="300px" height="200px" /> <br></br> Image测试 <br></br> <g:Image url="googleapple.jpg" width="300px" height="100px" /> <br></br> ScrollPanel测试 <br></br> <g:ScrollPanel ui:field="scrollPanel_0" width="300px" height="100px" /> <br></br> PopupPanel测试 <br></br> <g:Button text="PopupPanel测试" ui:field="popupPanelButton" width="150px" height="25px" /> <br></br> DialogBox测试 <br></br> <g:Button text="DialogBox测试" ui:field="dialogBoxButton" width="150px" height="25px" /> <br></br> DockPanel测试 <br></br> <g:DockPanel ui:field="dockPanel_0" width="300px" height="200px"> </g:DockPanel> <br></br> HorizontalPanel测试 <br></br> <g:HorizontalPanel borderWidth="1"> <g:Button text="DialogBox测试" width="150px" height="25px" /> <g:Button text="DialogBox测试" width="150px" height="25px" /> <g:Button text="DialogBox测试" width="150px" height="25px" /> <g:Button text="DialogBox测试" width="150px" height="25px" /> </g:HorizontalPanel> <br></br> VerticalPanel测试 <br></br> <g:VerticalPanel borderWidth="1"> <g:Button text="DialogBox测试" width="150px" height="25px" /> <g:Button text="DialogBox测试" width="150px" height="25px" /> <g:Button text="DialogBox测试" width="150px" height="25px" /> <g:Button text="DialogBox测试" width="150px" height="25px" /> </g:VerticalPanel> <br></br> FlowPanel测试 <br></br> <g:FlowPanel > <g:Button text="DialogBox测试" width="150px" height="25px" /> <g:Button text="DialogBox测试" width="150px" height="25px" /> <g:Button text="DialogBox测试" width="150px" height="25px" /> </g:FlowPanel> <br></br> StackPanel测试 <br></br> <g:StackPanel ui:field="stackPanel_0"> <g:HTML>测试001</g:HTML> <g:HTML>测试002</g:HTML> <g:HTML>测试003</g:HTML> <g:HTML>测试004</g:HTML> </g:StackPanel> <br></br> DeckPanel测试 <br></br> <g:DeckPanel ui:field="deckPanel_0" width="300px" height="200px"> <g:HTML><font color='red'>testDeck001</font></g:HTML> <g:HTML><font color='blue'>testDeck001</font></g:HTML> <g:HTML><font color='yellow'>testDeck001</font></g:HTML> <g:HTML><font color='green'>testDeck001</font></g:HTML> </g:DeckPanel> <g:Button ui:field="deckPanelButton_0" text="DeckPanel测试" width="150px" height="25px" /> <br></br> DisclosurePanel测试 <br></br> [<g:DisclosurePanel> <g:HTML>测试001</g:HTML> </g:DisclosurePanel>] <br></br> TabPanel测试 <br></br> <g:TabPanel ui:field="tabPanel_0" width="300px" height="200px"> </g:TabPanel> <br></br> MultiWordSuggestOracle测试 <br></br> <g:SuggestBox ui:field="suggestBox_0"></g:SuggestBox> <br></br> HorizontalSplitPanel测试 <br></br> <g:HorizontalSplitPanel width="300px" height="200px"> <g:HTML>测试左侧</g:HTML> <g:HTML>测试右侧</g:HTML> </g:HorizontalSplitPanel> <br></br> VerticalSplitPanel测试 <br></br> <g:VerticalSplitPanel width="300px" height="200px"> <g:HTML>测试上面</g:HTML> <g:HTML>测试下面</g:HTML> </g:VerticalSplitPanel> </g:HTMLPanel> </ui:UiBinder>
UiBinderTest01.java
代码:
package com.toeoso.uibinder.test.client; import com.google.gwt.core.client.GWT; import com.google.gwt.event.dom.client.ClickEvent; import com.google.gwt.event.dom.client.ClickHandler; import com.google.gwt.event.dom.client.KeyUpEvent; import com.google.gwt.event.dom.client.KeyUpHandler; import com.google.gwt.event.logical.shared.CloseEvent; import com.google.gwt.event.logical.shared.OpenEvent; import com.google.gwt.event.logical.shared.SelectionEvent; import com.google.gwt.event.logical.shared.SelectionHandler; import com.google.gwt.resources.client.ClientBundle; import com.google.gwt.resources.client.ImageResource; import com.google.gwt.uibinder.client.UiBinder; import com.google.gwt.uibinder.client.UiFactory; import com.google.gwt.uibinder.client.UiField; import com.google.gwt.uibinder.client.UiHandler; import com.google.gwt.user.client.Command; import com.google.gwt.user.client.Random; import com.google.gwt.user.client.Window; import com.google.gwt.user.client.ui.Button; import com.google.gwt.user.client.ui.CheckBox; import com.google.gwt.user.client.ui.Composite; import com.google.gwt.user.client.ui.DeckPanel; import com.google.gwt.user.client.ui.DockPanel; import com.google.gwt.user.client.ui.FlexTable; import com.google.gwt.user.client.ui.Frame; import com.google.gwt.user.client.ui.Grid; import com.google.gwt.user.client.ui.HTML; import com.google.gwt.user.client.ui.Label; import com.google.gwt.user.client.ui.ListBox; import com.google.gwt.user.client.ui.MenuBar; import com.google.gwt.user.client.ui.MultiWordSuggestOracle; import com.google.gwt.user.client.ui.PopupPanel; import com.google.gwt.user.client.ui.PushButton; import com.google.gwt.user.client.ui.RichTextArea; import com.google.gwt.user.client.ui.RootPanel; import com.google.gwt.user.client.ui.ScrollPanel; import com.google.gwt.user.client.ui.StackPanel; import com.google.gwt.user.client.ui.SuggestBox; import com.google.gwt.user.client.ui.TabBar; import com.google.gwt.user.client.ui.TabPanel; import com.google.gwt.user.client.ui.TextBox; import com.google.gwt.user.client.ui.Tree; import com.google.gwt.user.client.ui.TreeItem; import com.google.gwt.user.client.ui.VerticalPanel; import com.google.gwt.user.client.ui.Widget; public class UiBinderTest01 extends Composite { private static UiBinderTest01UiBinder uiBinder = GWT .create(UiBinderTest01UiBinder.class); interface UiBinderTest01UiBinder extends UiBinder<Widget, UiBinderTest01> { } public interface Resources extends ClientBundle { @Source("googleapple.jpg") ImageResource googleApple(); } public UiBinderTest01() { initWidget(uiBinder.createAndBindUi(this)); /* 设置输入框右对齐. */ textBox_0.setTextAlignment(TextBox.ALIGN_RIGHT); /** 这个函数不可以放类体里面. */ textBox_0.addKeyUpHandler(new KeyUpHandler() { public void onKeyUp(KeyUpEvent event) { // 说明.用changeListener的时候.在光标未移出的时候不会改变. String temp = textBox_0.getText(); System.out.println(temp); label_0.setText(temp); } }); listBox_0.setVisibleItemCount(6);// 设置成可选数目是6. listBox_1.setVisibleItemCount(6);// 设置成可选数目是6. listBox_0.addItem("001"); listBox_0.addItem("002"); listBox_0.addItem("003"); listBox_0.addItem("004"); richTextArea_0.setHTML("<font color='red'>abc</font>"); Command cmd = new Command() { public void execute() { Window.alert("点击Menu."); } }; MenuBar bar01 = new MenuBar(true); // 设置true的时候.显示竖向菜单. bar01.addItem("001", cmd); bar01.addItem("002", cmd); bar01.addItem("003", (new MenuBar(true).addItem("子菜单.", cmd) .getParentMenu())); // 主菜单显示. menuBar_0.addItem("File", bar01); menuBar_0.addItem("Save", bar01); menuBar_0.addItem("Exit", bar01); final String[] tabBarLabelText = { "这个是第1个TabBar.", "这个是第2个TabBar.", "这个是第3个TabBar.", "这个是新添加的第1个TabBar.", "这个是新添加的第2个TabBar." }; tabBar_0.addTab("这个是第1个TabBar."); tabBar_0.addTab("这个是第2个TabBar."); tabBar_0.addTab("这个是第3个TabBar."); // 设置一个数组变量存储值.这里不可以是一个int型.这样会改变不了值. tabBar_0.addSelectionHandler(new SelectionHandler<Integer>() { public void onSelection(SelectionEvent<Integer> event) { System.out.println(tabBar_0.getSelectedTab()); tabBarLabel_0 .setText(tabBarLabelText[tabBar_0.getSelectedTab()]); } }); // 设置网格的数量.3X3的网格. grid_0.setWidget(0, 0, new HTML("hello!")); grid_0.setWidget(1, 1, new HTML("hello!")); grid_0.setWidget(2, 2, new HTML("hello!")); grid_0.setWidget(1, 2, new HTML("hello!")); // 插入测试数据.数据是从(0,0)开始到(2,2)结束. // Grid测试结束. /** 对flexTable进行数据添加. */ for (int i = 0; i < 16; i++) { flexTable_0.setText(i / 4, i % 4, "id:" + i); } TreeItem treeItem1 = new TreeItem("01"); treeItem1.addItem(new TreeItem("sub01")); TreeItem treeItem2 = new TreeItem("02"); treeItem2.addItem(new TreeItem("sub02")); TreeItem treeItem3 = new TreeItem("03"); TreeItem treeItem3_1 = new TreeItem("03_1"); treeItem3.addItem(treeItem3_1); TreeItem treeItem3_2 = new TreeItem("03_2"); treeItem3_1.addItem(treeItem3_2); TreeItem treeItem3_3 = new TreeItem("03_3"); treeItem3_2.addItem(treeItem3_3); tree_0.addItem(treeItem1); tree_0.addItem(treeItem2); tree_0.addItem(treeItem3); // Resources res = GWT.create(Resources.class); // image_0.setResource(res.googleApple()); String strText = ""; for (int i = 0; i < 100; i++) { strText += "ABCDEFGHI"; } // scrollPanel_0.setSize("100px", "100px"); scrollPanel_0.setWidget(new HTML(strText)); scrollPanel_0.setVisible(true); dockPanel_0.add(new HTML("NORTH"), DockPanel.NORTH); dockPanel_0.add(new HTML("SOUTH"), DockPanel.SOUTH); dockPanel_0.add(new HTML("WEST"), DockPanel.WEST); dockPanel_0.add(new HTML("EAST"), DockPanel.EAST); dockPanel_0.add(new HTML("CENTER"), DockPanel.CENTER); dockPanel_0.setBorderWidth(1); stackPanel_0.setStackText(0, "stackPanel 0"); stackPanel_0.setStackText(1, "stackPanel 1"); stackPanel_0.setStackText(2, "stackPanel 2"); stackPanel_0.setStackText(3, "stackPanel 3"); deckPanel_0.showWidget(0); tabPanel_0.add(new HTML("TabPanel001Content"), "001"); tabPanel_0.add(new HTML("TabPanel002Content"), "002"); tabPanel_0.add(new HTML("TabPanel003Content"), "003"); tabPanel_0.selectTab(0); } @UiField PushButton button_0; @UiHandler("button_0") void onClick_0(ClickEvent e) { Window.alert("Push It !"); } @UiField CheckBox checkBox_0; @UiHandler( { "checkBox_0", "checkBox_0" }) void onClick_00(ClickEvent e) { Window.alert("Checked It 1!"); if (checkBox_0.getValue()) { checkBox_1.setValue(false); } else { checkBox_1.setValue(true); } if (checkBox_1.getValue()) { checkBox_0.setValue(false); } else { checkBox_0.setValue(true); } } @UiField CheckBox checkBox_1; /** 测试多重绑定. */ @UiHandler("checkBox_1") void onClick_11(ClickEvent e) { Window.alert("CheckBox It 2!"); } @UiField CheckBox radioButton_0; @UiField CheckBox radioButton_1; @UiField CheckBox radioButton_2; /** 测试一个函数绑两个组件. */ @UiHandler( { "radioButton_0", "radioButton_1", "radioButton_2" }) void onClick_2(ClickEvent e) { Window.alert("CheckBox It 2!"); } @UiField TextBox textBox_0; @UiField Label label_0; @UiField ListBox listBox_0; @UiField ListBox listBox_1; @UiHandler("listBox_0") void listBoxOnClick(ClickEvent event) { int id = listBox_0.getSelectedIndex(); listBox_1.clear();// 清除所有选项. for (int i = 0; i < 4; i++) { listBox_1.addItem(id + "city:\t" + i); } } @UiField Frame frame_0; @UiField RichTextArea richTextArea_0; @UiField MenuBar menuBar_0; @UiField TabBar tabBar_0; @UiField Label tabBarLabel_0; @UiField Grid grid_0; @UiFactory public Grid initGrid() { return new Grid(3, 3); } @UiHandler("grid_0") void onClick_3(ClickEvent e) { // 获得行.// 获得列. String temp = "点击了:[" + grid_0.getCellForEvent(e).getRowIndex() + "," + grid_0.getCellForEvent(e).getCellIndex() + "]"; System.out.println(temp); } @UiField FlexTable flexTable_0; @UiHandler("flexTable_0") void onClick_4(ClickEvent e) { // 获得行.// 获得列. String temp = "点击了:[" + flexTable_0.getCellForEvent(e).getRowIndex() + "," + flexTable_0.getCellForEvent(e).getCellIndex() + "]"; System.out.println(temp); Window.alert(temp); } @UiField Tree tree_0; @UiHandler("tree_0") void treeOnOpen(OpenEvent<TreeItem> event) { System.out.println("tree onOpen:\t" + event.getTarget().getHTML()); } @UiHandler("tree_0") public void treeOnClose(CloseEvent<TreeItem> event) { System.out.println("tree onClose:\t" + event.getTarget().getHTML()); } @UiHandler("tree_0") public void treeOnSelection(SelectionEvent<TreeItem> event) { System.out.println("tree onSelection:\t" + tree_0.getSelectedItem().getHTML()); } @UiField ScrollPanel scrollPanel_0; @UiField Button popupPanelButton; @UiHandler("popupPanelButton") public void popupPanelButtonOnClick(ClickEvent e) { final PopupPanel popupPanel = new PopupPanel(); Button closeButton = new Button("close"); closeButton.addClickHandler(new ClickHandler() { public void onClick(ClickEvent event) { popupPanel.hide(); } }); VerticalPanel verticalPanel = new VerticalPanel(); verticalPanel.add(new HTML("test Popup.")); verticalPanel.add(closeButton); popupPanel.add(verticalPanel); popupPanel.center(); } @UiField Button dialogBoxButton; @UiHandler("dialogBoxButton") public void dialogBoxButtonOnClick(ClickEvent e) { TestDialogBox_01 testDialogBox_01 = new TestDialogBox_01(); testDialogBox_01.center(); testDialogBox_01.show(); } @UiField DockPanel dockPanel_0; @UiField StackPanel stackPanel_0; @UiField DeckPanel deckPanel_0; @UiField Button deckPanelButton_0; @UiHandler("deckPanelButton_0") public void onClick_5(ClickEvent event) { int showId = (deckPanel_0.getVisibleWidget() +1 ) % 4; deckPanel_0.showWidget(showId); } @UiField TabPanel tabPanel_0; @UiField SuggestBox suggestBox_0; @UiFactory public SuggestBox initSuggestBox() { MultiWordSuggestOracle multiWordSuggestOracle = new MultiWordSuggestOracle(); for (int i = 0; i < 100; i++) { // com.google.gwt.user.client.Random静态方法. multiWordSuggestOracle.add(Random.nextInt() + ""); } return new SuggestBox(multiWordSuggestOracle); } }
界面效果:
工程源代码见附件.
遇到的错误:
19:30:41.703 [ERROR] [uibindertest] In <g:ListBox text='TextBox测试' ui:field='listBox_0'>, class ListBox has no appropriate setText() method <g:ListBox 没有 text 属性. 只要在组件里面有set方法的都可以进行标签的配置. 这个是动态的.配置.如: setUrl有的话,就可以写. <g:Frame url="http://www.google.com" ui:field="frame_0" width="300px" height="100px"/> 20:44:52.640 [ERROR] [uibindertest] Unable to load module entry point class com.toeoso.uibinder.test.client.UiBinderTest (see associated exception for details) java.lang.IndexOutOfBoundsException: Row index: 0, Row size: 0 at com.google.gwt.user.client.ui.Grid.prepareRow(Grid.java:306) at com.google.gwt.user.client.ui.Grid.prepareCell(Grid.java:251) at com.google.gwt.user.client.ui.HTMLTable.setWidget(HTMLTable.java:1056) at com.toeoso.uibinder.test.client.UiBinderTest01.<init>(UiBinderTest01.java:111) at com.toeoso.uibinder.test.client.UiBinderTest.onModuleLoad(UiBinderTest.java:9) at sun.reflect.NativeMethodAccessorImpl.invoke0(Native Method) at sun.reflect.NativeMethodAccessorImpl.invoke(Unknown Source) at sun.reflect.DelegatingMethodAccessorImpl.invoke(Unknown Source) at java.lang.reflect.Method.invoke(Unknown Source) at com.google.gwt.dev.shell.ModuleSpace.onLoad(ModuleSpace.java:369) at com.google.gwt.dev.shell.OophmSessionHandler.loadModule(OophmSessionHandler.java:185) at com.google.gwt.dev.shell.BrowserChannelServer.processConnection(BrowserChannelServer.java:380) at com.google.gwt.dev.shell.BrowserChannelServer.run(BrowserChannelServer.java:222) at java.lang.Thread.run(Unknown Source) Marks a constructor that may be used as an alternative to a widget's zero args construtor in a UiBinder template. The parameter names of the constructor may be filled as xml element attribute values. 08:13:31.250 [ERROR] [uibindertest] In <g:DockPanel height='25px' text='DialogBox测试' ui:field='dockPanel_0' width='150px'>, class DockPanel has no appropriate setText() method <g:north size='5'> <g:Label>Top</g:Label> </g:north> <g:center> <g:Label>Body</g:Label> </g:center> <g:west size='192'> <g:HTML> <ul> <li>Sidebar</li> <li>Sidebar</li> <li>Sidebar</li> </ul> </g:HTML> </g:west> 08:14:51.328 [ERROR] [uibindertest] Uncaught exception escaped com.google.gwt.core.client.JavaScriptException: (TypeError): boolean is not a function stack: TypeError: boolean is not a function at [object Object].CALL_NON_FUNCTION (native) at unknown source at unknown source at __gwt_jsInvoke (http://localhost:8888/uibindertest/hosted.html?uibindertest:70:34) at eval at eval (native) at unknown source at __gwt_jsInvoke (http://localhost:8888/uibindertest/hosted.html?uibindertest:70:34) at eval at eval (native) at unknown source at eval at eval (native) type: called_non_callable arguments: boolean __gwt_ObjectId: 580 at com.google.gwt.dev.shell.BrowserChannelServer.invokeJavascript(BrowserChannelServer.java:195) at com.google.gwt.dev.shell.ModuleSpaceOOPHM.doInvoke(ModuleSpaceOOPHM.java:120) at com.google.gwt.dev.shell.ModuleSpace.invokeNative(ModuleSpace.java:507) at com.google.gwt.dev.shell.ModuleSpace.invokeNativeObject(ModuleSpace.java:264) at com.google.gwt.dev.shell.JavaScriptHost.invokeNativeObject(JavaScriptHost.java:91) at com.google.gwt.core.client.impl.Impl.apply(Impl.java) at com.google.gwt.core.client.impl.Impl.entry0(Impl.java:188) at sun.reflect.GeneratedMethodAccessor9.invoke(Unknown Source) at sun.reflect.DelegatingMethodAccessorImpl.invoke(Unknown Source) at java.lang.reflect.Method.invoke(Unknown Source) at com.google.gwt.dev.shell.MethodAdaptor.invoke(MethodAdaptor.java:103) at com.google.gwt.dev.shell.MethodDispatch.invoke(MethodDispatch.java:71) at com.google.gwt.dev.shell.OophmSessionHandler.invoke(OophmSessionHandler.java:157) at com.google.gwt.dev.shell.BrowserChannel.reactToMessagesWhileWaitingForReturn(BrowserChannel.java:1713) at com.google.gwt.dev.shell.BrowserChannelServer.invokeJavascript(BrowserChannelServer.java:165) at com.google.gwt.dev.shell.ModuleSpaceOOPHM.doInvoke(ModuleSpaceOOPHM.java:120) at com.google.gwt.dev.shell.ModuleSpace.invokeNative(ModuleSpace.java:507) at com.google.gwt.dev.shell.ModuleSpace.invokeNativeObject(ModuleSpace.java:264) at com.google.gwt.dev.shell.JavaScriptHost.invokeNativeObject(JavaScriptHost.java:91) at com.google.gwt.core.client.impl.Impl.apply(Impl.java) at com.google.gwt.core.client.impl.Impl.entry0(Impl.java:188) at sun.reflect.GeneratedMethodAccessor9.invoke(Unknown Source) at sun.reflect.DelegatingMethodAccessorImpl.invoke(Unknown Source) at java.lang.reflect.Method.invoke(Unknown Source) at com.google.gwt.dev.shell.MethodAdaptor.invoke(MethodAdaptor.java:103) at com.google.gwt.dev.shell.MethodDispatch.invoke(MethodDispatch.java:71) at com.google.gwt.dev.shell.OophmSessionHandler.invoke(OophmSessionHandler.java:157) at com.google.gwt.dev.shell.BrowserChannel.reactToMessagesWhileWaitingForReturn(BrowserChannel.java:1713) at com.google.gwt.dev.shell.BrowserChannelServer.invokeJavascript(BrowserChannelServer.java:165) at com.google.gwt.dev.shell.ModuleSpaceOOPHM.doInvoke(ModuleSpaceOOPHM.java:120) at com.google.gwt.dev.shell.ModuleSpace.invokeNative(ModuleSpace.java:507) at com.google.gwt.dev.shell.ModuleSpace.invokeNativeObject(ModuleSpace.java:264) at com.google.gwt.dev.shell.JavaScriptHost.invokeNativeObject(JavaScriptHost.java:91) at com.google.gwt.core.client.impl.Impl.apply(Impl.java) at com.google.gwt.core.client.impl.Impl.entry0(Impl.java:188) at sun.reflect.GeneratedMethodAccessor9.invoke(Unknown Source) at sun.reflect.DelegatingMethodAccessorImpl.invoke(Unknown Source) at java.lang.reflect.Method.invoke(Unknown Source) at com.google.gwt.dev.shell.MethodAdaptor.invoke(MethodAdaptor.java:103) at com.google.gwt.dev.shell.MethodDispatch.invoke(MethodDispatch.java:71) at com.google.gwt.dev.shell.OophmSessionHandler.invoke(OophmSessionHandler.java:157) at com.google.gwt.dev.shell.BrowserChannel.reactToMessages(BrowserChannel.java:1668) at com.google.gwt.dev.shell.BrowserChannelServer.processConnection(BrowserChannelServer.java:401) at com.google.gwt.dev.shell.BrowserChannelServer.run(BrowserChannelServer.java:222) at java.lang.Thread.run(Unknown Source) 10:46:53.421 [ERROR] [uibindertest] In <g:FlowPanel borderWidth='1'>, class FlowPanel has no appropriate setBorderWidth() method 10:50:07.843 [ERROR] [uibindertest] Ambiguous setter requested: StackPanel.stackText 11:05:24.687 [ERROR] [uibindertest] Field 'deckPanel_0' does not have an 'addClickHandler' method associate 11:10:24.203 [ERROR] [uibindertest] Invalid TabPanel child element: HTML
都是些很好理解的错误.
一般都是 ui.xml 文件定义的 属性使用错误.
说明:
绑定是过很好的方法.以前写一个匿名接口实现.
现在只用写一个实现的方法.根据方法里面传入的是什么类型的事件.进行绑定.而不一定是clickEvent事件.
如:
@UiHandler("tree_0") void treeOnOpen(OpenEvent<TreeItem> event) { System.out.println("tree onOpen:\t" + event.getTarget().getHTML()); } @UiHandler("tree_0") public void treeOnClose(CloseEvent<TreeItem> event) { System.out.println("tree onClose:\t" + event.getTarget().getHTML()); } @UiHandler("tree_0") public void treeOnSelection(SelectionEvent<TreeItem> event) { System.out.println("tree onSelection:\t" + tree_0.getSelectedItem().getHTML()); }
对树的事件绑定的时候就是 分别绑定了 3 过事件.OpenEvent,CloseEvent,SelectionEvent
对三个事件进行绑定.至于方法的名称用什么都无所谓.只要是不重复的就行.
而以前要实现这个就需要:
tree.addOpenHandler(new OpenHandler<TreeItem>() { public void onOpen(OpenEvent<TreeItem> event) { System.out.println("tree onOpen:\t" + event.getTarget().getHTML()); } }); tree.addCloseHandler(new CloseHandler<TreeItem>() { public void onClose(CloseEvent<TreeItem> event) { System.out.println("tree onClose:\t" + event.getTarget().getHTML()); } }); tree.addSelectionHandler(new SelectionHandler<TreeItem>() { public void onSelection(SelectionEvent<TreeItem> event) { // TODO Auto-generated method stub System.out.println("tree onSelection:\t" + tree.getSelectedItem().getHTML()); } });
需要定义 3个匿名内部类.去实现. 现在看代码就方便简单多了.
可以所完全不像是做web编程了哈...
对于要进行初始化参数的如Grid
写道
@UiField
Grid grid_0;
@UiFactory
public Grid initGrid() {
return new Grid(3, 3);
}
使用UiFactory 进行绑定.说明其构造的时候带参数 是 3 行 3 列的表格.
在设置其他组件参数的时候,我就简单的都放在构造函数里面了.
在每次修改 ui.xml 和 .java 文件的时候 都要进校验.
这个时候比较慢..系统像卡死了似的.
你可以少保存几次.想好了在改动.
几乎所有的组件都有一个参数 width="300px" height="200px"
都要设置大小.尤其是button.如果不设置大小.就会成一个小方块.
在使用 ui.xml 的使用 就一个 ui:filed 这个是可以自动生成的 其他的参数都要查询
这个组件下面是否有 setXXX .如果有就有 XXX 属性.首字母小写.
一般 来说 text 是组件的标题.但并不是所以的组件都有标题的.
这个在运行的时候就知道了.如果报错.也是很明显的信息.
用过ff 和chrome 进行调试 都需要下载插件.
chrome 空指针报错 3 次.. ff 没有这样的问题.
而且 chrome 报错后页面会自动跳转到google的页面.
在ui.xml 里面可以混合写 html 和 组件代码.
一般不用重新启动. 除非改了点服务端代码 修改了web.xml
否则 就刷新下就可以了.
一般就是 ui.xml 写错误了.
uiBinder 很强大. 值得深入研究..感觉上以后还会有 flex 的组件.
欢迎大家多提意见. 和我一起研究.