From: Joonas Lehtinen Date: Thu, 11 Sep 2008 07:10:39 +0000 (+0000) Subject: Adding extensive JavaDocs for IOrderedLayout X-Git-Tag: 6.7.0.beta1~4180 X-Git-Url: https://source.dussan.org/?a=commitdiff_plain;h=6c5f23de81f29fa21a8c013cd1c81236b22bab9f;p=vaadin-framework.git Adding extensive JavaDocs for IOrderedLayout svn changeset:5382/svn branch:trunk --- diff --git a/src/com/itmill/toolkit/terminal/gwt/client/ui/IOrderedLayout.java b/src/com/itmill/toolkit/terminal/gwt/client/ui/IOrderedLayout.java index 9119dc7886..b84b898d4a 100644 --- a/src/com/itmill/toolkit/terminal/gwt/client/ui/IOrderedLayout.java +++ b/src/com/itmill/toolkit/terminal/gwt/client/ui/IOrderedLayout.java @@ -28,6 +28,214 @@ import com.itmill.toolkit.terminal.gwt.client.Util; * supports use through UIDL updates. Direct client side use is not (currently) * suported in all operation modes. * + * + *

Features

+ * + *

Orientation

+ * + *

+ * Orientation of the ordered layout declared whether the children are layouted + * horizontally or vertically. + *

+ * + * + * + *

Spacing

+ * + *

+ * Spacing determines if there should be space between the children. Note that + * this does not imply margin. + *

+ * + * + * + *

Margin

+ * + *

+ * Margin determines if there should be margin around children. Note that this + * does not imply spacing. + *

+ * + * + * + *

Positioning the caption, icon, required indicator and error

+ * + *

+ * If the child lets the layout to handle captions, by icon, caption, required + * marker (*) and error icon are placed on top of the component area. Icon will + * be first and is followed by the caption. Required marker is placed right + * after the caption text and error icon is placed last. Note that all of these + * are optional: + *

+ * + * + * + *

+ * If the child lets the layout to handle captions, but the caption and icon are + * both missing, no line is reserved for the required marker (*) and error icon. + * Instead they are placed on the right side of the top of the component area. + * Required marker is placed right after the component text and error icon is + * placed last. If the component is tall, the indicators are aligned along the + * top of the component. Note that both of these indicators are optional: + *

+ * + * + * + *

+ * In case the child want to handle the caption by itself, layout does not + * repeat the caption. + *

+ * + * + * + *

Aligning the children

+ * + *

+ * The children of the layout can be aligned horizontally and vertically: + *

+ * + * + * + *

Fixed height, width or both

+ * + *

+ * When no size is explicitly specified, the size of the layout depends on the + * size of its children. If the size if specified, either explicitly or as + * percertages of the parent size, the size is equally divided between the + * children. In case some children might overflow out of the given space, they + * are cut to fit the given space. Note that the size can be independently + * specified for horizontal and vertical dimensions and is independent of the + * orientation. For example, layout can be horizontal and have fixed 300px + * height, but still measure its width from the child sizes. + *

+ * + *

+ * Horizontal layout with fixed width of 300px and height of 150px: + *

+ * + * + *

+ * Horizontal layout with fixed width of 300px: + *

+ * + * + *

+ * Horizontal layout with fixed height of 150px: + *

+ * + * + * + *

CSS attributes

+ * + *

+ * Sizes for marginals and spacing can be specified for the ordered layout in + * CSS. For example, here are the defaults for OrderedLayout: + *

+ * + *
+ * .i-orderedlayout-margin-top {
+ *         padding-top: 15px;
+ * }
+ * .i-orderedlayout-margin-right {
+ *         padding-right: 18px;
+ * }
+ * .i-orderedlayout-margin-bottom {
+ *         padding-bottom: 15px;
+ * }
+ * .i-orderedlayout-margin-left {
+ *         padding-left: 18px;
+ * }
+ * 
+ * .i-orderedlayout-vspacing {
+ *         margin-top: 8px;
+ * }
+ * .i-orderedlayout-hspacing {
+ *         padding-left: 8px;
+ * }
+ * 
+ * + *

+ * When a style-name is set for the layout, this name is included in the style. + * Note that the unspecified dimensions still default to the values given for + * the layout without style. For example, if we would like to give each layout + * with "tested-layout" style quite a bit larger right margin: + *

+ * + *
+ * .i-orderedlayout-tested-layout-margin-right {
+ *         padding-right: 100px;
+ * }
+ * 
+ * + *

+ * Here is the rendering with getMargin(true). Note that all the other margins + * are set to the default values defined for the layout without stylename: + *

+ * + * + * + *

DOM-structure

+ * + * Note that DOM-structure is an implementation specific and might change in the + * future versions of IT Mill Toolkit. The purpose of this documentation is to + * to ease reading of the implementation and thus to make implementation of your + * own layouts easier. + * + *
OUTERDIV + * + *
Optional STRUCTURE + * + *
CHILDWRAPPER (for each + * child) + * + *
Optional ALIGNMENTWRAPPER + * + *
Optional CLIPPER + * + *
CAPTION ICON-IMG CAPTION-SPAN REQUIRED-SPAN ERRORINDICATOR-DIV + *
+ * + *
Widget + * component
+ * + *
+ * + *
+ * + *

+ * Notes: + *

+ *

+ * + * * @author IT Mill Ltd */ public class IOrderedLayout extends Panel implements Container, diff --git a/src/com/itmill/toolkit/terminal/gwt/client/ui/IOrderedLayout_alignment.png b/src/com/itmill/toolkit/terminal/gwt/client/ui/IOrderedLayout_alignment.png new file mode 100644 index 0000000000..49b918ec0c Binary files /dev/null and b/src/com/itmill/toolkit/terminal/gwt/client/ui/IOrderedLayout_alignment.png differ diff --git a/src/com/itmill/toolkit/terminal/gwt/client/ui/IOrderedLayout_component_handles_the_caption.png b/src/com/itmill/toolkit/terminal/gwt/client/ui/IOrderedLayout_component_handles_the_caption.png new file mode 100644 index 0000000000..9fd6635765 Binary files /dev/null and b/src/com/itmill/toolkit/terminal/gwt/client/ui/IOrderedLayout_component_handles_the_caption.png differ diff --git a/src/com/itmill/toolkit/terminal/gwt/client/ui/IOrderedLayout_h150.png b/src/com/itmill/toolkit/terminal/gwt/client/ui/IOrderedLayout_h150.png new file mode 100644 index 0000000000..7cd07369dc Binary files /dev/null and b/src/com/itmill/toolkit/terminal/gwt/client/ui/IOrderedLayout_h150.png differ diff --git a/src/com/itmill/toolkit/terminal/gwt/client/ui/IOrderedLayout_horizontal.png b/src/com/itmill/toolkit/terminal/gwt/client/ui/IOrderedLayout_horizontal.png new file mode 100644 index 0000000000..c2e1f49efe Binary files /dev/null and b/src/com/itmill/toolkit/terminal/gwt/client/ui/IOrderedLayout_horizontal.png differ diff --git a/src/com/itmill/toolkit/terminal/gwt/client/ui/IOrderedLayout_horizontal_spacing.png b/src/com/itmill/toolkit/terminal/gwt/client/ui/IOrderedLayout_horizontal_spacing.png new file mode 100644 index 0000000000..417c9aecfd Binary files /dev/null and b/src/com/itmill/toolkit/terminal/gwt/client/ui/IOrderedLayout_horizontal_spacing.png differ diff --git a/src/com/itmill/toolkit/terminal/gwt/client/ui/IOrderedLayout_margin.png b/src/com/itmill/toolkit/terminal/gwt/client/ui/IOrderedLayout_margin.png new file mode 100644 index 0000000000..2f1e461b0a Binary files /dev/null and b/src/com/itmill/toolkit/terminal/gwt/client/ui/IOrderedLayout_margin.png differ diff --git a/src/com/itmill/toolkit/terminal/gwt/client/ui/IOrderedLayout_no_caption.png b/src/com/itmill/toolkit/terminal/gwt/client/ui/IOrderedLayout_no_caption.png new file mode 100644 index 0000000000..63984cdee7 Binary files /dev/null and b/src/com/itmill/toolkit/terminal/gwt/client/ui/IOrderedLayout_no_caption.png differ diff --git a/src/com/itmill/toolkit/terminal/gwt/client/ui/IOrderedLayout_normal_caption.png b/src/com/itmill/toolkit/terminal/gwt/client/ui/IOrderedLayout_normal_caption.png new file mode 100644 index 0000000000..1e730c072b Binary files /dev/null and b/src/com/itmill/toolkit/terminal/gwt/client/ui/IOrderedLayout_normal_caption.png differ diff --git a/src/com/itmill/toolkit/terminal/gwt/client/ui/IOrderedLayout_special-margin.png b/src/com/itmill/toolkit/terminal/gwt/client/ui/IOrderedLayout_special-margin.png new file mode 100644 index 0000000000..34e47d1551 Binary files /dev/null and b/src/com/itmill/toolkit/terminal/gwt/client/ui/IOrderedLayout_special-margin.png differ diff --git a/src/com/itmill/toolkit/terminal/gwt/client/ui/IOrderedLayout_vertical.png b/src/com/itmill/toolkit/terminal/gwt/client/ui/IOrderedLayout_vertical.png new file mode 100644 index 0000000000..99e3709acc Binary files /dev/null and b/src/com/itmill/toolkit/terminal/gwt/client/ui/IOrderedLayout_vertical.png differ diff --git a/src/com/itmill/toolkit/terminal/gwt/client/ui/IOrderedLayout_vertical_spacing.png b/src/com/itmill/toolkit/terminal/gwt/client/ui/IOrderedLayout_vertical_spacing.png new file mode 100644 index 0000000000..be9a4cd8c5 Binary files /dev/null and b/src/com/itmill/toolkit/terminal/gwt/client/ui/IOrderedLayout_vertical_spacing.png differ diff --git a/src/com/itmill/toolkit/terminal/gwt/client/ui/IOrderedLayout_w300.png b/src/com/itmill/toolkit/terminal/gwt/client/ui/IOrderedLayout_w300.png new file mode 100644 index 0000000000..0b555ad1e7 Binary files /dev/null and b/src/com/itmill/toolkit/terminal/gwt/client/ui/IOrderedLayout_w300.png differ diff --git a/src/com/itmill/toolkit/terminal/gwt/client/ui/IOrderedLayout_w300_h150.png b/src/com/itmill/toolkit/terminal/gwt/client/ui/IOrderedLayout_w300_h150.png new file mode 100644 index 0000000000..8ff42ed0f4 Binary files /dev/null and b/src/com/itmill/toolkit/terminal/gwt/client/ui/IOrderedLayout_w300_h150.png differ