Revision: 9754
Author: [email protected]
Date: Tue Feb 22 11:01:28 2011
Log: Adding an example of StackLayoutPanel to the Showcase sample. The
translations
are the same as StackPanel. Also adding a new constructor to SimplePanel to
make
it easier to set the default widget.
Review at http://gwt-code-reviews.appspot.com/1354805
http://code.google.com/p/google-web-toolkit/source/detail?r=9754
Added:
/trunk/samples/showcase/src/com/google/gwt/sample/showcase/client/content/lists/CwStackLayoutPanel.java
Modified:
/trunk/samples/showcase/src/com/google/gwt/i18n/client/LocalizableResource.properties
/trunk/samples/showcase/src/com/google/gwt/i18n/client/LocalizableResource_ar.properties
/trunk/samples/showcase/src/com/google/gwt/i18n/client/LocalizableResource_fr.properties
/trunk/samples/showcase/src/com/google/gwt/i18n/client/LocalizableResource_zh.properties
/trunk/samples/showcase/src/com/google/gwt/sample/showcase/client/MainMenuTreeViewModel.java
/trunk/samples/showcase/src/com/google/gwt/sample/showcase/client/ShowcaseConstants.java
/trunk/tools/api-checker/config/gwt22_23userApi.conf
/trunk/user/src/com/google/gwt/user/client/ui/SimplePanel.java
=======================================
--- /dev/null
+++
/trunk/samples/showcase/src/com/google/gwt/sample/showcase/client/content/lists/CwStackLayoutPanel.java
Tue Feb 22 11:01:28 2011
@@ -0,0 +1,298 @@
+/*
+ * 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.showcase.client.content.lists;
+
+import com.google.gwt.core.client.GWT;
+import com.google.gwt.core.client.RunAsyncCallback;
+import com.google.gwt.dom.client.Style.Unit;
+import com.google.gwt.event.dom.client.ClickEvent;
+import com.google.gwt.event.dom.client.ClickHandler;
+import com.google.gwt.i18n.client.Constants;
+import com.google.gwt.resources.client.ImageResource;
+import com.google.gwt.safehtml.shared.SafeHtmlBuilder;
+import com.google.gwt.safehtml.shared.SafeHtmlUtils;
+import com.google.gwt.sample.showcase.client.ContentWidget;
+import
com.google.gwt.sample.showcase.client.ShowcaseAnnotations.ShowcaseData;
+import
com.google.gwt.sample.showcase.client.ShowcaseAnnotations.ShowcaseSource;
+import
com.google.gwt.sample.showcase.client.ShowcaseAnnotations.ShowcaseStyle;
+import com.google.gwt.user.client.rpc.AsyncCallback;
+import com.google.gwt.user.client.ui.AbstractImagePrototype;
+import com.google.gwt.user.client.ui.Anchor;
+import com.google.gwt.user.client.ui.CheckBox;
+import com.google.gwt.user.client.ui.HTML;
+import com.google.gwt.user.client.ui.HasVerticalAlignment;
+import com.google.gwt.user.client.ui.HorizontalPanel;
+import com.google.gwt.user.client.ui.Image;
+import com.google.gwt.user.client.ui.PopupPanel;
+import com.google.gwt.user.client.ui.SimplePanel;
+import com.google.gwt.user.client.ui.StackLayoutPanel;
+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;
+
+/**
+ * Example file.
+ */
+@ShowcaseStyle({
+ ".gwt-DecoratedStackPanel", "html>body .gwt-DecoratedStackPanel",
+ "* html .gwt-DecoratedStackPanel", ".cw-StackPanelHeader"})
+public class CwStackLayoutPanel extends ContentWidget {
+ /**
+ * The constants used in this Content Widget.
+ */
+ @ShowcaseSource
+ public static interface CwConstants extends Constants {
+ String[] cwStackLayoutPanelContacts();
+
+ String[] cwStackLayoutPanelContactsEmails();
+
+ String cwStackLayoutPanelContactsHeader();
+
+ String cwStackLayoutPanelDescription();
+
+ String[] cwStackLayoutPanelFilters();
+
+ String cwStackLayoutPanelFiltersHeader();
+
+ String[] cwStackLayoutPanelMailFolders();
+
+ String cwStackLayoutPanelMailHeader();
+
+ String cwStackLayoutPanelName();
+ }
+
+ /**
+ * Specifies the images that will be bundled for this example.
+ *
+ * We will override the leaf image used in the tree. Instead of using a
blank
+ * 16x16 image, we will use a blank 1x1 image so it does not take up any
+ * space. Each TreeItem will use its own custom image.
+ */
+ @ShowcaseSource
+ public interface Images extends Tree.Resources {
+ ImageResource contactsgroup();
+
+ ImageResource defaultContact();
+
+ ImageResource drafts();
+
+ ImageResource filtersgroup();
+
+ ImageResource inbox();
+
+ ImageResource mailgroup();
+
+ ImageResource sent();
+
+ ImageResource templates();
+
+ ImageResource trash();
+
+ /**
+ * Use noimage.png, which is a blank 1x1 image.
+ */
+ @Source("noimage.png")
+ ImageResource treeLeaf();
+ }
+
+ /**
+ * An instance of the constants.
+ */
+ @ShowcaseData
+ private final CwConstants constants;
+
+ /**
+ * Constructor.
+ *
+ * @param constants the constants
+ */
+ public CwStackLayoutPanel(CwConstants constants) {
+ super(constants.cwStackLayoutPanelName(), constants
+ .cwStackLayoutPanelDescription(), true);
+ this.constants = constants;
+ }
+
+ /**
+ * Initialize this example.
+ */
+ @ShowcaseSource
+ @Override
+ public Widget onInitialize() {
+ // Get the images.
+ Images images = (Images) GWT.create(Images.class);
+
+ // Create a new stack layout panel.
+ StackLayoutPanel stackPanel = new StackLayoutPanel(Unit.EM);
+ stackPanel.setPixelSize(200, 400);
+
+ // Add the Mail folders.
+ Widget mailHeader = createHeaderWidget(
+ constants.cwStackLayoutPanelMailHeader(), images.mailgroup());
+ stackPanel.add(createMailItem(images), mailHeader, 4);
+
+ // Add a list of filters.
+ Widget filtersHeader = createHeaderWidget(
+ constants.cwStackLayoutPanelFiltersHeader(),
images.filtersgroup());
+ stackPanel.add(createFiltersItem(), filtersHeader, 4);
+
+ // Add a list of contacts.
+ Widget contactsHeader = createHeaderWidget(
+ constants.cwStackLayoutPanelContactsHeader(),
images.contactsgroup());
+ stackPanel.add(createContactsItem(images), contactsHeader, 4);
+
+ // Return the stack panel.
+ stackPanel.ensureDebugId("cwStackLayoutPanel");
+ return stackPanel;
+ }
+
+ @Override
+ protected void asyncOnInitialize(final AsyncCallback<Widget> callback) {
+ GWT.runAsync(CwStackLayoutPanel.class, new RunAsyncCallback() {
+
+ public void onFailure(Throwable caught) {
+ callback.onFailure(caught);
+ }
+
+ public void onSuccess() {
+ callback.onSuccess(onInitialize());
+ }
+ });
+ }
+
+ /**
+ * Add a {@link TreeItem} to a root item.
+ *
+ * @param root the root {@link TreeItem}
+ * @param image the icon for the new child item
+ * @param label the label for the child icon
+ */
+ @ShowcaseSource
+ private void addItem(TreeItem root, ImageResource image, String label) {
+ SafeHtmlBuilder sb = new SafeHtmlBuilder();
+
sb.append(SafeHtmlUtils.fromTrustedString(AbstractImagePrototype.create(
+ image).getHTML()));
+ sb.appendEscaped(" ").appendEscaped(label);
+ root.addItem(sb.toSafeHtml());
+ }
+
+ /**
+ * Create the list of Contacts.
+ *
+ * @param images the {@link Images} used in the Contacts
+ * @return the list of contacts
+ */
+ @ShowcaseSource
+ private Widget createContactsItem(Images images) {
+ // Create a popup to show the contact info when a contact is clicked
+ HorizontalPanel contactPopupContainer = new HorizontalPanel();
+ contactPopupContainer.setSpacing(5);
+ contactPopupContainer.add(new Image(images.defaultContact()));
+ final HTML contactInfo = new HTML();
+ contactPopupContainer.add(contactInfo);
+ final PopupPanel contactPopup = new PopupPanel(true, false);
+ contactPopup.setWidget(contactPopupContainer);
+
+ // Create the list of contacts
+ VerticalPanel contactsPanel = new VerticalPanel();
+ contactsPanel.setSpacing(4);
+ String[] contactNames = constants.cwStackLayoutPanelContacts();
+ String[] contactEmails = constants.cwStackLayoutPanelContactsEmails();
+ for (int i = 0; i < contactNames.length; i++) {
+ final String contactName = contactNames[i];
+ final String contactEmail = contactEmails[i];
+ final Anchor contactLink = new Anchor(contactName);
+ contactsPanel.add(contactLink);
+
+ // Open the contact info popup when the user clicks a contact
+ contactLink.addClickHandler(new ClickHandler() {
+ public void onClick(ClickEvent event) {
+ // Set the info about the contact
+ SafeHtmlBuilder sb = new SafeHtmlBuilder();
+ sb.appendEscaped(contactName);
+ sb.appendHtmlConstant("<br><i>");
+ sb.appendEscaped(contactEmail);
+ sb.appendHtmlConstant("</i>");
+ contactInfo.setHTML(sb.toSafeHtml());
+
+ // Show the popup of contact info
+ int left = contactLink.getAbsoluteLeft() + 14;
+ int top = contactLink.getAbsoluteTop() + 14;
+ contactPopup.setPopupPosition(left, top);
+ contactPopup.show();
+ }
+ });
+ }
+ return new SimplePanel(contactsPanel);
+ }
+
+ /**
+ * Create the list of filters for the Filters item.
+ *
+ * @return the list of filters
+ */
+ @ShowcaseSource
+ private Widget createFiltersItem() {
+ VerticalPanel filtersPanel = new VerticalPanel();
+ filtersPanel.setSpacing(4);
+ for (String filter : constants.cwStackLayoutPanelFilters()) {
+ filtersPanel.add(new CheckBox(filter));
+ }
+ return new SimplePanel(filtersPanel);
+ }
+
+ /**
+ * Create a widget to display in the header that includes an image and
some
+ * text.
+ *
+ * @param text the header text
+ * @param image the {@link ImageResource} to add next to the header
+ * @return the header widget
+ */
+ @ShowcaseSource
+ private Widget createHeaderWidget(String text, ImageResource image) {
+ // Add the image and text to a horizontal panel
+ HorizontalPanel hPanel = new HorizontalPanel();
+ hPanel.setHeight("100%");
+ hPanel.setSpacing(0);
+ hPanel.setVerticalAlignment(HasVerticalAlignment.ALIGN_MIDDLE);
+ hPanel.add(new Image(image));
+ HTML headerText = new HTML(text);
+ headerText.setStyleName("cw-StackPanelHeader");
+ hPanel.add(headerText);
+ return new SimplePanel(hPanel);
+ }
+
+ /**
+ * Create the {@link Tree} of Mail options.
+ *
+ * @param images the {@link Images} used in the Mail options
+ * @return the {@link Tree} of mail options
+ */
+ @ShowcaseSource
+ private Widget createMailItem(Images images) {
+ Tree mailPanel = new Tree(images);
+ TreeItem mailPanelRoot = mailPanel.addItem("[email protected]");
+ String[] mailFolders = constants.cwStackLayoutPanelMailFolders();
+ addItem(mailPanelRoot, images.inbox(), mailFolders[0]);
+ addItem(mailPanelRoot, images.drafts(), mailFolders[1]);
+ addItem(mailPanelRoot, images.templates(), mailFolders[2]);
+ addItem(mailPanelRoot, images.sent(), mailFolders[3]);
+ addItem(mailPanelRoot, images.trash(), mailFolders[4]);
+ mailPanelRoot.setState(true);
+ return mailPanel;
+ }
+}
=======================================
---
/trunk/samples/showcase/src/com/google/gwt/i18n/client/LocalizableResource.properties
Wed Feb 16 04:54:04 2011
+++
/trunk/samples/showcase/src/com/google/gwt/i18n/client/LocalizableResource.properties
Tue Feb 22 11:01:28 2011
@@ -215,6 +215,15 @@
cwSplitLayoutPanelSouth1 = This is the first south component.
cwSplitLayoutPanelSouth2 = This is the second south component.
cwSplitLayoutPanelWest = This is the west component.
+cwStackLayoutPanelName = Stack Layout Panel
+cwStackLayoutPanelDescription = The StackLayoutPanel stacks its children
vertically, displaying only one at a time, with a header for each child
which the user can click to display. This is useful for vertical menu
systems.
+cwStackLayoutPanelContactsHeader = Contacts
+cwStackLayoutPanelContacts = Benoit Mandelbrot, Albert Einstein, Rene
Descartes, Bob Saget, Ludwig von Beethoven, Richard Feynman, Alan Turing,
John von Neumann
+cwStackLayoutPanelContactsEmails = [email protected], [email protected],
[email protected], [email protected], [email protected], [email protected],
[email protected], [email protected]
+cwStackLayoutPanelMailHeader = Mail
+cwStackLayoutPanelMailFolders = Inbox, Drafts, Templates, Sent, Trash
+cwStackLayoutPanelFiltersHeader = Filters
+cwStackLayoutPanelFilters = All, Starred, Read, Unread, Recent, Sent by me
cwStackPanelName = Stack Panel
cwStackPanelDescription = The StackPanel stacks its children vertically,
displaying only one at a time, with a header for each child which the user
can click to display. This is useful for vertical menu systems.
cwStackPanelContactsHeader = Contacts
=======================================
---
/trunk/samples/showcase/src/com/google/gwt/i18n/client/LocalizableResource_ar.properties
Wed Feb 16 04:54:04 2011
+++
/trunk/samples/showcase/src/com/google/gwt/i18n/client/LocalizableResource_ar.properties
Tue Feb 22 11:01:28 2011
@@ -202,6 +202,15 @@
cwSplitLayoutPanelSouth1 = هذا هو العنصر الجنوبي الاول
cwSplitLayoutPanelSouth2 = هذا هو العنصر الجنوبي الثاني
cwSplitLayoutPanelWest = هذا هو العنصر الغربي
+cwStackLayoutPanelName = المكدس تخطيط لوح
+cwStackLayoutPanelDescription =ان لوح التكديس يكدس محتوياته عموديا ويعرض
واحدة منها فقط في الوقت الواحد مع ترويسة لكل من المحتويات والتي ممكن النقر
عليها لعرضها كاملة. ان هذا مفيد للقوائم العمودية.
+cwStackLayoutPanelContactsHeader = جهات الاتصال
+cwStackLayoutPanelContacts = بينويت ماندلبروت , البرت اينشتاين , رينيه
ديكارت , بوب ساجيت, لودفيغ فون بيتهوفن , ريتشارد فاينمان , الآن تورنج , جون
فون نيومان
+cwStackLayoutPanelContactsEmails = [email protected], [email protected],
[email protected], [email protected], [email protected], [email protected],
[email protected], [email protected]
+cwStackLayoutPanelMailHeader = البريد
+cwStackLayoutPanelMailFolders = البريد الوارد , مسودات , قوالب , أرسلت ,
المهملات
+cwStackLayoutPanelFiltersHeader = مرشحات
+cwStackLayoutPanelFilters = الجميع, مؤشرة بالنجوم, مقروء , غير مقروء,
حديث, مرسلة من قبلي
cwStackPanelName = لوح التكديس
cwStackPanelDescription =ان لوح التكديس يكدس محتوياته عموديا ويعرض واحدة
منها فقط في الوقت الواحد مع ترويسة لكل من المحتويات والتي ممكن النقر عليها
لعرضها كاملة. ان هذا مفيد للقوائم العمودية.
cwStackPanelContactsHeader = جهات الاتصال
=======================================
---
/trunk/samples/showcase/src/com/google/gwt/i18n/client/LocalizableResource_fr.properties
Wed Feb 16 04:54:04 2011
+++
/trunk/samples/showcase/src/com/google/gwt/i18n/client/LocalizableResource_fr.properties
Tue Feb 22 11:01:28 2011
@@ -202,6 +202,15 @@
cwSplitLayoutPanelSouth1 = Ceci est le premier composant sud
cwSplitLayoutPanelSouth2 = Ceci est le second composant sud
cwSplitLayoutPanelWest = Ceci est le composant ouest
+cwStackLayoutPanelName = Stack Layout Panel
+cwStackLayoutPanelDescription = Le StackLayoutPanel piles verticalement
ses enfants, affichant seulement un à la fois, avec une tête pour chaque
enfant dont l'utilisateur peut cliquer pour défiler le panneau
correspondant à l'en-tête. Cette option est utile pour les systèmes de menu
verticale.
+cwStackLayoutPanelContactsHeader = Contacts
+cwStackLayoutPanelContacts = Benoit Mandelbrot, Albert Einstein, René
Descartes, Bob Saget, Ludwig von Beethoven, Richard Feynman, Alan Turing,
John de von Neumann
+cwStackLayoutPanelContactsEmails = [email protected], [email protected],
[email protected], [email protected], [email protected], [email protected],
[email protected], [email protected]
+cwStackLayoutPanelMailHeader = Mail
+cwStackLayoutPanelMailFolders = Boîte de réception, Brouillons,
Formulaires, Messages envoyés, Corbeille
+cwStackLayoutPanelFiltersHeader = Filtres
+cwStackLayoutPanelFilters = Tous, Suivi, Lus, Non lus, Récemment accédés,
Postés par moi
cwStackPanelName = Stack Panel
cwStackPanelDescription = Le StackPanel piles verticalement ses enfants,
affichant seulement un à la fois, avec une tête pour chaque enfant dont
l'utilisateur peut cliquer pour défiler le panneau correspondant à
l'en-tête. Cette option est utile pour les systèmes de menu verticale.
cwStackPanelContactsHeader = Contacts
=======================================
---
/trunk/samples/showcase/src/com/google/gwt/i18n/client/LocalizableResource_zh.properties
Wed Feb 16 04:54:04 2011
+++
/trunk/samples/showcase/src/com/google/gwt/i18n/client/LocalizableResource_zh.properties
Tue Feb 22 11:01:28 2011
@@ -202,6 +202,15 @@
cwSplitLayoutPanelSouth1 = 此为南侧第一个组件
cwSplitLayoutPanelSouth2 = 此为南侧第二个组件
cwSplitLayoutPanelWest = 此为西侧组件
+cwStackLayoutPanelName = 栈布局面板
+cwStackLayoutPanelDescription = 栈布局面板（StackLayoutPanel）会纵向排列子
部件，任意时刻只显示某一部件的内容，其他子部件则只显示其标题，用户可以通过点
击标题切换。这是一种十分有用的垂直菜单系统。
+cwStackLayoutPanelContactsHeader = 通讯录
+cwStackLayoutPanelContacts = 曼德尔布洛特, 爱因斯坦, 笛卡尔, 萨吉特, 贝多
芬, 费曼, 阿兰图灵, 冯诺依曼
+cwStackLayoutPanelContactsEmails = [email protected], [email protected],
[email protected], [email protected], [email protected], [email protected],
[email protected], [email protected]
+cwStackLayoutPanelMailHeader =邮件
+cwStackLayoutPanelMailFolders = 收件箱, 草稿箱, 范本, 发送, 垃圾箱
+cwStackLayoutPanelFiltersHeader =过滤器
+cwStackLayoutPanelFilters = 所有, 重要, 读过, 未读过, 最近, 我发出的
cwStackPanelName =栈面板
cwStackPanelDescription = 栈面板（StackPanel）会纵向排列子部件，任意时刻只
显示某一部件的内容，其他子部件则只显示其标题，用户可以通过点击标题切换。这是
一种十分有用的垂直菜单系统。
cwStackPanelContactsHeader = 通讯录
=======================================
---
/trunk/samples/showcase/src/com/google/gwt/sample/showcase/client/MainMenuTreeViewModel.java
Wed Feb 16 04:54:04 2011
+++
/trunk/samples/showcase/src/com/google/gwt/sample/showcase/client/MainMenuTreeViewModel.java
Tue Feb 22 11:01:28 2011
@@ -36,6 +36,7 @@
import
com.google.gwt.sample.showcase.client.content.i18n.CwPluralFormsExample;
import com.google.gwt.sample.showcase.client.content.lists.CwListBox;
import com.google.gwt.sample.showcase.client.content.lists.CwMenuBar;
+import
com.google.gwt.sample.showcase.client.content.lists.CwStackLayoutPanel;
import com.google.gwt.sample.showcase.client.content.lists.CwStackPanel;
import com.google.gwt.sample.showcase.client.content.lists.CwSuggestBox;
import com.google.gwt.sample.showcase.client.content.lists.CwTree;
@@ -301,6 +302,8 @@
RunAsyncCode.runAsyncCode(CwMenuBar.class));
category.addExample(new CwStackPanel(constants),
RunAsyncCode.runAsyncCode(CwStackPanel.class));
+ category.addExample(new CwStackLayoutPanel(constants),
+ RunAsyncCode.runAsyncCode(CwStackLayoutPanel.class));
}
// Text Input.
=======================================
---
/trunk/samples/showcase/src/com/google/gwt/sample/showcase/client/ShowcaseConstants.java
Wed Feb 16 04:54:04 2011
+++
/trunk/samples/showcase/src/com/google/gwt/sample/showcase/client/ShowcaseConstants.java
Tue Feb 22 11:01:28 2011
@@ -33,6 +33,7 @@
import
com.google.gwt.sample.showcase.client.content.i18n.CwPluralFormsExample;
import com.google.gwt.sample.showcase.client.content.lists.CwListBox;
import com.google.gwt.sample.showcase.client.content.lists.CwMenuBar;
+import
com.google.gwt.sample.showcase.client.content.lists.CwStackLayoutPanel;
import com.google.gwt.sample.showcase.client.content.lists.CwStackPanel;
import com.google.gwt.sample.showcase.client.content.lists.CwSuggestBox;
import com.google.gwt.sample.showcase.client.content.lists.CwTree;
@@ -85,7 +86,8 @@
CwDatePicker.CwConstants, CwPluralFormsExample.CwConstants,
CwCellList.CwConstants, CwCellTable.CwConstants,
CwCellTree.CwConstants,
CwCellBrowser.CwConstants, CwCellValidation.CwConstants,
- CwCellSampler.CwConstants, CwSplitLayoutPanel.CwConstants {
+ CwCellSampler.CwConstants, CwSplitLayoutPanel.CwConstants,
+ CwStackLayoutPanel.CwConstants {
/**
* The path to source code for examples, raw files, and style
definitions.
=======================================
--- /trunk/tools/api-checker/config/gwt22_23userApi.conf Fri Feb 18
11:21:07 2011
+++ /trunk/tools/api-checker/config/gwt22_23userApi.conf Tue Feb 22
11:01:28 2011
@@ -120,3 +120,6 @@
# when adding to the white-list, include comments as to why the addition is
# being made.
+# Overloaded SimplePanel constructor to accept a Widget.
+com.google.gwt.user.client.ui.SimplePanel::SimplePanel(Lcom/google/gwt/dom/client/Element;)
OVERLOADED_METHOD_CALL
+
=======================================
--- /trunk/user/src/com/google/gwt/user/client/ui/SimplePanel.java Fri Jan
14 05:54:41 2011
+++ /trunk/user/src/com/google/gwt/user/client/ui/SimplePanel.java Tue Feb
22 11:01:28 2011
@@ -34,6 +34,16 @@
public SimplePanel() {
this(DOM.createDiv());
}
+
+ /**
+ * Create a panel with the specified child widget.
+ *
+ * @param child the child to add to the panel
+ */
+ public SimplePanel(Widget child) {
+ this();
+ setWidget(child);
+ }
/**
* Creates an empty panel that uses the specified browser element for its
--
http://groups.google.com/group/Google-Web-Toolkit-Contributors
