Revision: 10167
Author: jlaba...@google.com
Date: Mon May 9 10:25:15 2011
Log: Implementing custom TaskReadViews for tablet, desktop, and mobile.
http://code.google.com/p/google-web-toolkit/source/detail?r=10167
Added:
/trunk/samples/mobilewebapp/src/main/com/google/gwt/sample/mobilewebapp/client/desktop/DesktopTaskReadView.java
/trunk/samples/mobilewebapp/src/main/com/google/gwt/sample/mobilewebapp/client/desktop/DesktopTaskReadView.ui.xml
/trunk/samples/mobilewebapp/src/main/com/google/gwt/sample/mobilewebapp/client/mobile/MobileTaskReadView.java
/trunk/samples/mobilewebapp/src/main/com/google/gwt/sample/mobilewebapp/client/mobile/MobileTaskReadView.ui.xml
Modified:
/trunk/samples/mobilewebapp/src/main/com/google/gwt/sample/mobilewebapp/client/ClientFactoryImpl.java
/trunk/samples/mobilewebapp/src/main/com/google/gwt/sample/mobilewebapp/client/ClientFactoryImplMobile.java
/trunk/samples/mobilewebapp/src/main/com/google/gwt/sample/mobilewebapp/client/ClientFactoryImplTablet.java
=======================================
--- /dev/null
+++
/trunk/samples/mobilewebapp/src/main/com/google/gwt/sample/mobilewebapp/client/desktop/DesktopTaskReadView.java
Mon May 9 10:25:15 2011
@@ -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;
+ }
+}
=======================================
--- /dev/null
+++
/trunk/samples/mobilewebapp/src/main/com/google/gwt/sample/mobilewebapp/client/desktop/DesktopTaskReadView.ui.xml
Mon May 9 10:25:15 2011
@@ -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>
=======================================
--- /dev/null
+++
/trunk/samples/mobilewebapp/src/main/com/google/gwt/sample/mobilewebapp/client/mobile/MobileTaskReadView.java
Mon May 9 10:25:15 2011
@@ -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;
+ }
+}
=======================================
--- /dev/null
+++
/trunk/samples/mobilewebapp/src/main/com/google/gwt/sample/mobilewebapp/client/mobile/MobileTaskReadView.ui.xml
Mon May 9 10:25:15 2011
@@ -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>
=======================================
---
/trunk/samples/mobilewebapp/src/main/com/google/gwt/sample/mobilewebapp/client/ClientFactoryImpl.java
Mon May 9 10:10:43 2011
+++
/trunk/samples/mobilewebapp/src/main/com/google/gwt/sample/mobilewebapp/client/ClientFactoryImpl.java
Mon May 9 10:25:15 2011
@@ -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;
@@ -174,6 +174,10 @@
protected TaskListView createTaskListView() {
return new DesktopTaskListView();
}
+
+ protected TaskReadView createTaskReadView() {
+ return new DesktopTaskReadView();
+ }
/**
* Returns provider that indicates whether the task list is always
visible.
@@ -203,8 +207,4 @@
}
};
}
-
- private TaskReadView createTaskReadView() {
- return new TabletTaskReadView();
- }
-}
+}
=======================================
---
/trunk/samples/mobilewebapp/src/main/com/google/gwt/sample/mobilewebapp/client/ClientFactoryImplMobile.java
Mon May 9 10:10:43 2011
+++
/trunk/samples/mobilewebapp/src/main/com/google/gwt/sample/mobilewebapp/client/ClientFactoryImplMobile.java
Mon May 9 10:25:15 2011
@@ -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();
+ }
+}
=======================================
---
/trunk/samples/mobilewebapp/src/main/com/google/gwt/sample/mobilewebapp/client/ClientFactoryImplTablet.java
Mon May 9 08:12:52 2011
+++
/trunk/samples/mobilewebapp/src/main/com/google/gwt/sample/mobilewebapp/client/ClientFactoryImplTablet.java
Mon May 9 10:25:15 2011
@@ -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;
@@ -45,6 +47,11 @@
// Use the mobile list view on tablets.
return new MobileTaskListView();
}
+
+ @Override
+ protected TaskReadView createTaskReadView() {
+ return new TabletTaskReadView();
+ }
@Override
protected Provider<Boolean> getIsTaskListIncludedProvider() {
--
http://groups.google.com/group/Google-Web-Toolkit-Contributors
