Implementing custom TaskReadViews for tablet, desktop, and mobile. git-svn-id: https://google-web-toolkit.googlecode.com/svn/trunk@10167 8db76d5a-ed1c-0410-87a9-c151d255dfc7
diff --git a/samples/mobilewebapp/src/main/com/google/gwt/sample/mobilewebapp/client/ClientFactoryImpl.java b/samples/mobilewebapp/src/main/com/google/gwt/sample/mobilewebapp/client/ClientFactoryImpl.java index 5ce3c5a..fbbe23d 100644 --- a/samples/mobilewebapp/src/main/com/google/gwt/sample/mobilewebapp/client/ClientFactoryImpl.java +++ b/samples/mobilewebapp/src/main/com/google/gwt/sample/mobilewebapp/client/ClientFactoryImpl.java
@@ -31,9 +31,9 @@ import com.google.gwt.sample.mobilewebapp.client.activity.TaskReadView; import com.google.gwt.sample.mobilewebapp.client.desktop.DesktopTaskEditView; import com.google.gwt.sample.mobilewebapp.client.desktop.DesktopTaskListView; +import com.google.gwt.sample.mobilewebapp.client.desktop.DesktopTaskReadView; import com.google.gwt.sample.mobilewebapp.client.desktop.MobileWebAppShellDesktop; import com.google.gwt.sample.mobilewebapp.client.place.AppPlaceHistoryMapper; -import com.google.gwt.sample.mobilewebapp.client.tablet.TabletTaskReadView; import com.google.gwt.storage.client.Storage; import com.google.gwt.user.client.Window; import com.google.web.bindery.requestfactory.shared.RequestTransport; @@ -175,6 +175,10 @@ return new DesktopTaskListView(); } + protected TaskReadView createTaskReadView() { + return new DesktopTaskReadView(); + } + /** * Returns provider that indicates whether the task list is always visible. * The default implementation returned by this method always indicates false. @@ -203,8 +207,4 @@ } }; } - - private TaskReadView createTaskReadView() { - return new TabletTaskReadView(); - } }
diff --git a/samples/mobilewebapp/src/main/com/google/gwt/sample/mobilewebapp/client/ClientFactoryImplMobile.java b/samples/mobilewebapp/src/main/com/google/gwt/sample/mobilewebapp/client/ClientFactoryImplMobile.java index daa3887..b235b67 100644 --- a/samples/mobilewebapp/src/main/com/google/gwt/sample/mobilewebapp/client/ClientFactoryImplMobile.java +++ b/samples/mobilewebapp/src/main/com/google/gwt/sample/mobilewebapp/client/ClientFactoryImplMobile.java
@@ -17,8 +17,10 @@ import com.google.gwt.sample.mobilewebapp.client.activity.TaskEditView; import com.google.gwt.sample.mobilewebapp.client.activity.TaskListView; +import com.google.gwt.sample.mobilewebapp.client.activity.TaskReadView; import com.google.gwt.sample.mobilewebapp.client.mobile.MobileTaskEditView; import com.google.gwt.sample.mobilewebapp.client.mobile.MobileTaskListView; +import com.google.gwt.sample.mobilewebapp.client.mobile.MobileTaskReadView; import com.google.gwt.sample.mobilewebapp.client.mobile.MobileWebAppShellMobile; import com.google.gwt.sample.mobilewebapp.client.ui.OrientationHelper; import com.google.gwt.sample.mobilewebapp.client.ui.WindowBasedOrientationHelper; @@ -44,4 +46,9 @@ protected TaskListView createTaskListView() { return new MobileTaskListView(); } + + @Override + protected TaskReadView createTaskReadView() { + return new MobileTaskReadView(); + } }
diff --git a/samples/mobilewebapp/src/main/com/google/gwt/sample/mobilewebapp/client/ClientFactoryImplTablet.java b/samples/mobilewebapp/src/main/com/google/gwt/sample/mobilewebapp/client/ClientFactoryImplTablet.java index b758965..3630dd4 100644 --- a/samples/mobilewebapp/src/main/com/google/gwt/sample/mobilewebapp/client/ClientFactoryImplTablet.java +++ b/samples/mobilewebapp/src/main/com/google/gwt/sample/mobilewebapp/client/ClientFactoryImplTablet.java
@@ -17,9 +17,11 @@ import com.google.gwt.sample.mobilewebapp.client.activity.TaskEditView; import com.google.gwt.sample.mobilewebapp.client.activity.TaskListView; +import com.google.gwt.sample.mobilewebapp.client.activity.TaskReadView; import com.google.gwt.sample.mobilewebapp.client.mobile.MobileTaskListView; import com.google.gwt.sample.mobilewebapp.client.tablet.MobileWebAppShellTablet; import com.google.gwt.sample.mobilewebapp.client.tablet.TabletTaskEditView; +import com.google.gwt.sample.mobilewebapp.client.tablet.TabletTaskReadView; import com.google.gwt.sample.mobilewebapp.client.ui.OrientationHelper; import com.google.gwt.sample.mobilewebapp.client.ui.WindowBasedOrientationHelper; @@ -47,6 +49,11 @@ } @Override + protected TaskReadView createTaskReadView() { + return new TabletTaskReadView(); + } + + @Override protected Provider<Boolean> getIsTaskListIncludedProvider() { /* * TODO(rjrjr) This is awkward. Seems like we should be wrapping the tablet
diff --git a/samples/mobilewebapp/src/main/com/google/gwt/sample/mobilewebapp/client/desktop/DesktopTaskReadView.java b/samples/mobilewebapp/src/main/com/google/gwt/sample/mobilewebapp/client/desktop/DesktopTaskReadView.java new file mode 100644 index 0000000..4d1e084 --- /dev/null +++ b/samples/mobilewebapp/src/main/com/google/gwt/sample/mobilewebapp/client/desktop/DesktopTaskReadView.java
@@ -0,0 +1,106 @@ +/* + * Copyright 2011 Google Inc. + * + * Licensed under the Apache License, Version 2.0 (the "License"); you may not + * use this file except in compliance with the License. You may obtain a copy of + * the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT + * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the + * License for the specific language governing permissions and limitations under + * the License. + */ +package com.google.gwt.sample.mobilewebapp.client.desktop; + +import com.google.gwt.core.client.GWT; +import com.google.gwt.editor.client.SimpleBeanEditorDriver; +import com.google.gwt.event.dom.client.ClickEvent; +import com.google.gwt.event.dom.client.ClickHandler; +import com.google.gwt.sample.mobilewebapp.client.activity.TaskReadView; +import com.google.gwt.sample.mobilewebapp.client.ui.DateButton; +import com.google.gwt.sample.mobilewebapp.shared.TaskProxy; +import com.google.gwt.uibinder.client.UiBinder; +import com.google.gwt.uibinder.client.UiField; +import com.google.gwt.user.client.ui.Button; +import com.google.gwt.user.client.ui.Composite; +import com.google.gwt.user.client.ui.DateLabel; +import com.google.gwt.user.client.ui.DockLayoutPanel; +import com.google.gwt.user.client.ui.HTMLPanel; +import com.google.gwt.user.client.ui.Label; +import com.google.gwt.user.client.ui.TextBoxBase; +import com.google.gwt.user.client.ui.Widget; + +/** + * View used to edit a task. + */ +public class DesktopTaskReadView extends Composite implements TaskReadView { + + /** + * The UiBinder interface. + */ + interface DesktopTaskReadViewUiBinder extends UiBinder<Widget, DesktopTaskReadView> { + } + + + interface Driver extends SimpleBeanEditorDriver<TaskProxy, DesktopTaskReadView> { + } + + /** + * The UiBinder used to generate the view. + */ + private static DesktopTaskReadViewUiBinder uiBinder = GWT + .create(DesktopTaskReadViewUiBinder.class); + + @UiField + DockLayoutPanel dockLayoutPanel; + + /** + * The panel that contains the edit form. + */ + @UiField + HTMLPanel editForm; + + @UiField + DateLabel dueDateEditor; + @UiField + Label nameEditor; + @UiField + Label notesEditor; + @UiField + Button saveButton; + + private final Driver driver = GWT.create(Driver.class); + + /** + * The {@link TaskReadView.Presenter} for this view. + */ + private Presenter presenter; + + /** + * Construct a new {@link DesktopTaskReadView}. + */ + public DesktopTaskReadView() { + initWidget(uiBinder.createAndBindUi(this)); + driver.initialize(this); + + // Create a new task or modify the current task when done is pressed. + saveButton.addClickHandler(new ClickHandler() { + public void onClick(ClickEvent event) { + if (presenter != null) { + presenter.editTask(); + } + } + }); + } + + public SimpleBeanEditorDriver<TaskProxy, ?> getEditorDriver() { + return driver; + } + + public void setPresenter(Presenter presenter) { + this.presenter = presenter; + } +}
diff --git a/samples/mobilewebapp/src/main/com/google/gwt/sample/mobilewebapp/client/desktop/DesktopTaskReadView.ui.xml b/samples/mobilewebapp/src/main/com/google/gwt/sample/mobilewebapp/client/desktop/DesktopTaskReadView.ui.xml new file mode 100644 index 0000000..941bc98 --- /dev/null +++ b/samples/mobilewebapp/src/main/com/google/gwt/sample/mobilewebapp/client/desktop/DesktopTaskReadView.ui.xml
@@ -0,0 +1,140 @@ +<!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" + xmlns:c="urn:import:com.google.gwt.user.cellview.client" + xmlns:app="urn:import:com.google.gwt.sample.mobilewebapp.client.ui"> + + <ui:style> + .title { + padding: 4px 10px; + font-size: 14pt; + font-weight: bold; + color: #666; + } + + .editForm { + padding: 10px; + background: white; + } + + .label { + color: #333; + font-size: 10pt; + padding-bottom: 3px; + } + + .field { + width: 300px; + } + + .textBoxWrapper { + margin-right: 10px; + } + + .notesBox { + height: 6em; + } + + .violation { + color: red; + } + + .button { + padding-top: 8px; + padding-bottom: 8px; + color: #3f3f3f; + } + + .dateButton { + text-align: center; + } + + .buttonPanel { + padding: 10px; + margin-top: 15px; + } + + .saveButton { + width: 130px; + margin-right: 5px; + } + + .templateList { + border-left: 1px solid #aaa; + } + </ui:style> + + <g:DockLayoutPanel + ui:field="dockLayoutPanel" + unit="PX"> + <!-- Edit Form. --> + <g:center> + <g:HTMLPanel + ui:field="editForm" + addStyleNames="{style.editForm}"> + <table + cellspacing="10" + align="center"> + + <!-- Form title. --> + <tr> + <td + align='center' + colspan='2' + class="{style.title}">Task Details</td> + </tr> + + <!-- Task name. --> + <tr> + <td + class="{style.label}">Task Name:</td> + <td + class="{style.textBoxWrapper}"> + <g:Label + addStyleNames="{style.field}" + ui:field="nameEditor" /> + </td> + </tr> + + <!-- Task notes. --> + <tr> + <td + class="{style.label}">Notes:</td> + <td + class="{style.textBoxWrapper}"> + <g:Label + addStyleNames="{style.field} {style.notesBox}" + ui:field="notesEditor" /> + </td> + </tr> + + <!-- Task due date. --> + <tr> + <td + class="{style.label}">Due date:</td> + <td> + <g:DateLabel + addStyleNames="{style.field} {style.button} {style.dateButton}" + ui:field="dueDateEditor" /> + </td> + </tr> + + <!-- Button panel. --> + <tr + class="{style.buttonPanel}"> + <td + colspan='2' + align='center'> + <g:Button + ui:field="saveButton" + addStyleNames="{style.button} {style.saveButton}">Edit</g:Button> + </td> + </tr> + </table> + </g:HTMLPanel> + </g:center> + + </g:DockLayoutPanel> + +</ui:UiBinder>
diff --git a/samples/mobilewebapp/src/main/com/google/gwt/sample/mobilewebapp/client/mobile/MobileTaskReadView.java b/samples/mobilewebapp/src/main/com/google/gwt/sample/mobilewebapp/client/mobile/MobileTaskReadView.java new file mode 100644 index 0000000..c505007 --- /dev/null +++ b/samples/mobilewebapp/src/main/com/google/gwt/sample/mobilewebapp/client/mobile/MobileTaskReadView.java
@@ -0,0 +1,98 @@ +/* + * Copyright 2011 Google Inc. + * + * Licensed under the Apache License, Version 2.0 (the "License"); you may not + * use this file except in compliance with the License. You may obtain a copy of + * the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT + * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the + * License for the specific language governing permissions and limitations under + * the License. + */ +package com.google.gwt.sample.mobilewebapp.client.mobile; + +import com.google.gwt.core.client.GWT; +import com.google.gwt.editor.client.SimpleBeanEditorDriver; +import com.google.gwt.event.dom.client.ClickEvent; +import com.google.gwt.event.dom.client.ClickHandler; +import com.google.gwt.sample.mobilewebapp.client.activity.TaskReadView; +import com.google.gwt.sample.mobilewebapp.shared.TaskProxy; +import com.google.gwt.uibinder.client.UiBinder; +import com.google.gwt.uibinder.client.UiField; +import com.google.gwt.user.client.ui.Composite; +import com.google.gwt.user.client.ui.DateLabel; +import com.google.gwt.user.client.ui.Label; +import com.google.gwt.user.client.ui.TextBoxBase; +import com.google.gwt.user.client.ui.Widget; +import com.google.gwt.widget.client.TextButton; +import com.google.web.bindery.requestfactory.gwt.client.RequestFactoryEditorDriver; + +/** + * View used to edit a task. + */ +public class MobileTaskReadView extends Composite implements TaskReadView { + + /** + * Editor driver for this view. + */ + interface Driver extends SimpleBeanEditorDriver<TaskProxy, MobileTaskReadView> { + } + + /** + * The UiBinder interface. + */ + interface MobileTaskReadViewUiBinder extends UiBinder<Widget, MobileTaskReadView> { + } + + /** + * The UiBinder used to generate the view. + */ + private static MobileTaskReadViewUiBinder uiBinder = GWT.create(MobileTaskReadViewUiBinder.class); + + + @UiField + DateLabel dueDateEditor; + @UiField + Label nameEditor; + @UiField + Label notesEditor; + @UiField + @Ignore + TextButton saveButton; + + private final Driver driver = GWT.create(Driver.class); + + /** + * The {@link TaskReadView.Presenter} for this view. + */ + private Presenter presenter; + + /** + * Construct a new {@link MobileTaskEditView}. + */ + public MobileTaskReadView() { + initWidget(uiBinder.createAndBindUi(this)); + driver.initialize(this); + + // Create a new task or modify the current task when done is pressed. + saveButton.addClickHandler(new ClickHandler() { + public void onClick(ClickEvent event) { + if (presenter != null) { + presenter.editTask(); + } + } + }); + } + + public SimpleBeanEditorDriver<TaskProxy, ?> getEditorDriver() { + return driver; + } + + public void setPresenter(Presenter presenter) { + this.presenter = presenter; + } +}
diff --git a/samples/mobilewebapp/src/main/com/google/gwt/sample/mobilewebapp/client/mobile/MobileTaskReadView.ui.xml b/samples/mobilewebapp/src/main/com/google/gwt/sample/mobilewebapp/client/mobile/MobileTaskReadView.ui.xml new file mode 100644 index 0000000..61b5225 --- /dev/null +++ b/samples/mobilewebapp/src/main/com/google/gwt/sample/mobilewebapp/client/mobile/MobileTaskReadView.ui.xml
@@ -0,0 +1,130 @@ +<!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" + xmlns:w="urn:import:com.google.gwt.widget.client" + xmlns:app="urn:import:com.google.gwt.sample.mobilewebapp.client.ui"> + + <ui:style> + .outer { + background: #eee; + } + + .title { + background: #393939; + color: white; + padding: 4px 10px; + font-size: 10pt; + } + + .editForm { + padding: 10px; + background: white; + } + + .label { + color: #666; + font-size: 10pt; + padding-bottom: 3px; + } + + .field { + width: 100%; + margin-bottom: 12px; + } + + .textBoxWrapper { + margin-right: 10px; + } + + .nameBox { + height: 2em; + } + + .notesBox { + height: 4em; + } + + .buttonPanel { + width: 100%; + padding: 10px; + margin-top: 15px; + } + + .button { + width: 100%; + } + </ui:style> + + <g:DockLayoutPanel + unit="PT"> + <!-- Title. --> + <g:north + size="18"> + <g:Label + addStyleNames="{style.title}">DETAILS</g:Label> + </g:north> + + <g:center> + <g:ScrollPanel + addStyleNames="{style.outer}"> + <g:HTMLPanel> + + <!-- Edit Form. --> + <div + class="{style.editForm}"> + <!-- Task name. --> + <div + class="{style.label}">What</div> + <div + class="{style.textBoxWrapper}"> + <g:Label + addStyleNames="{style.field} {style.nameBox}" + ui:field="nameEditor" /> + </div> + + <!-- Task notes. --> + <div + class="{style.label}">Notes</div> + <div + class="{style.textBoxWrapper}"> + <g:Label + addStyleNames="{style.field} {style.notesBox}" + ui:field="notesEditor" /> + </div> + + <!-- Task due date. --> + <div + class="{style.label}">Due date</div> + <g:DateLabel + addStyleNames="{style.field}" + ui:field="dueDateEditor" /> + </div> + + <!-- Button panel. --> + <table + class="{style.buttonPanel}" + cellspacing="0" + cellpadding="0"> + <tr> + <td + align="center" + style="width:50%;padding-right:5px;"> + <w:TextButton + ui:field="saveButton" + addStyleNames="{style.button}">Edit</w:TextButton> + </td> + <td + align="center" + style="width:50%;padding-left:5px;"> + + </td> + </tr> + </table> + + </g:HTMLPanel> + </g:ScrollPanel> + </g:center> + </g:DockLayoutPanel> + +</ui:UiBinder>