From 190d079bc1cf1f147db7646ff466e6d1dcc40ac1 Mon Sep 17 00:00:00 2001 From: =?utf8?q?Marko=20Gr=C3=B6nroos?= Date: Fri, 9 Jan 2009 12:17:08 +0000 Subject: [PATCH] Sampler: Added layout alignment example. For #2432. svn changeset:6476/svn branch:trunk --- .../ITMILL/themes/sampler/layouts/styles.css | 23 +++++ WebContent/ITMILL/themes/sampler/styles.css | 1 + .../toolkit/demo/sampler/FeatureSet.java | 2 + .../layouts/HorizontalLayoutBasic.java | 6 +- .../features/layouts/LayoutAlignment.java | 56 +++++++++++ .../features/layouts/LayoutAlignment.png | Bin 0 -> 3461 bytes .../layouts/LayoutAlignmentExample.java | 88 ++++++++++++++++++ .../features/layouts/VerticalLayoutBasic.java | 6 +- 8 files changed, 180 insertions(+), 2 deletions(-) create mode 100644 WebContent/ITMILL/themes/sampler/layouts/styles.css create mode 100644 src/com/itmill/toolkit/demo/sampler/features/layouts/LayoutAlignment.java create mode 100644 src/com/itmill/toolkit/demo/sampler/features/layouts/LayoutAlignment.png create mode 100644 src/com/itmill/toolkit/demo/sampler/features/layouts/LayoutAlignmentExample.java diff --git a/WebContent/ITMILL/themes/sampler/layouts/styles.css b/WebContent/ITMILL/themes/sampler/layouts/styles.css new file mode 100644 index 0000000000..b56cdb9d1e --- /dev/null +++ b/WebContent/ITMILL/themes/sampler/layouts/styles.css @@ -0,0 +1,23 @@ +/**************************************************************************** + * sampler/layouts/styles.css + * + * Styles for the layout examples in Sampler. + * + ****************************************************************************/ + +/**************************************************************************** + * Layout alignment example + ****************************************************************************/ + +.i-gridlayout-example-alignment { + background: blue; +} + +.i-gridlayout-example-alignment .i-gridlayout-margin { + padding: 3px; +} + +div.i-gridlayout-example-alignment > div.i-gridlayout-margin > div > div { + padding: 3px; + background: yellow; +} diff --git a/WebContent/ITMILL/themes/sampler/styles.css b/WebContent/ITMILL/themes/sampler/styles.css index ec764f8763..cd8b0f5c69 100644 --- a/WebContent/ITMILL/themes/sampler/styles.css +++ b/WebContent/ITMILL/themes/sampler/styles.css @@ -6,3 +6,4 @@ @import url(prominentprimaryaction/styles.css); +@import url(layouts/styles.css); diff --git a/src/com/itmill/toolkit/demo/sampler/FeatureSet.java b/src/com/itmill/toolkit/demo/sampler/FeatureSet.java index 116558c94c..8f666e987a 100644 --- a/src/com/itmill/toolkit/demo/sampler/FeatureSet.java +++ b/src/com/itmill/toolkit/demo/sampler/FeatureSet.java @@ -13,6 +13,7 @@ import com.itmill.toolkit.demo.sampler.features.buttons.ButtonSwitch; import com.itmill.toolkit.demo.sampler.features.commons.Icons; import com.itmill.toolkit.demo.sampler.features.commons.Tooltips; import com.itmill.toolkit.demo.sampler.features.layouts.HorizontalLayoutBasic; +import com.itmill.toolkit.demo.sampler.features.layouts.LayoutAlignment; import com.itmill.toolkit.demo.sampler.features.layouts.LayoutSpacing; import com.itmill.toolkit.demo.sampler.features.layouts.VerticalLayoutBasic; import com.itmill.toolkit.demo.sampler.features.link.LinkCurrentWindow; @@ -151,6 +152,7 @@ public class FeatureSet extends Feature { new VerticalLayoutBasic(), // new HorizontalLayoutBasic(), // new LayoutSpacing(), // + new LayoutAlignment(), // }); } } diff --git a/src/com/itmill/toolkit/demo/sampler/features/layouts/HorizontalLayoutBasic.java b/src/com/itmill/toolkit/demo/sampler/features/layouts/HorizontalLayoutBasic.java index 1a8e7e7f2f..450e28e06d 100644 --- a/src/com/itmill/toolkit/demo/sampler/features/layouts/HorizontalLayoutBasic.java +++ b/src/com/itmill/toolkit/demo/sampler/features/layouts/HorizontalLayoutBasic.java @@ -31,7 +31,11 @@ public class HorizontalLayoutBasic extends Feature { @Override public Class[] getRelatedFeatures() { - return new Class[] { VerticalLayoutBasic.class, LayoutSpacing.class }; + return new Class[] { + VerticalLayoutBasic.class, + LayoutSpacing.class, + LayoutAlignment.class, + }; } @Override diff --git a/src/com/itmill/toolkit/demo/sampler/features/layouts/LayoutAlignment.java b/src/com/itmill/toolkit/demo/sampler/features/layouts/LayoutAlignment.java new file mode 100644 index 0000000000..749fbb7cb7 --- /dev/null +++ b/src/com/itmill/toolkit/demo/sampler/features/layouts/LayoutAlignment.java @@ -0,0 +1,56 @@ +package com.itmill.toolkit.demo.sampler.features.layouts; + +import com.itmill.toolkit.demo.sampler.APIResource; +import com.itmill.toolkit.demo.sampler.Feature; +import com.itmill.toolkit.demo.sampler.FeatureSet; +import com.itmill.toolkit.demo.sampler.NamedExternalResource; +import com.itmill.toolkit.demo.sampler.features.blueprints.ProminentPrimaryAction; +import com.itmill.toolkit.demo.sampler.features.buttons.ButtonPush; +import com.itmill.toolkit.demo.sampler.features.buttons.ButtonSwitch; +import com.itmill.toolkit.demo.sampler.features.link.LinkCurrentWindow; +import com.itmill.toolkit.demo.sampler.features.link.LinkNoDecorations; +import com.itmill.toolkit.demo.sampler.features.link.LinkSizedWindow; +import com.itmill.toolkit.ui.GridLayout; +import com.itmill.toolkit.ui.HorizontalLayout; +import com.itmill.toolkit.ui.VerticalLayout; + +public class LayoutAlignment extends Feature { + + @Override + public String getName() { + return "Layout Alignment"; + } + + @Override + public String getDescription() { + return "GridLayout, VerticalLayout, and HorizontalLayout, " + + "which are tabular layouts consisting of cells, " + + "support alignment of components within the layout cells. " + + "The alignment of a component within its respective cell " + + "is set with setComponentAlignment()."; + } + + @Override + public APIResource[] getRelatedAPI() { + return new APIResource[] { + new APIResource(VerticalLayout.class), + new APIResource(HorizontalLayout.class), + new APIResource(GridLayout.class), + }; + } + + @Override + public Class[] getRelatedFeatures() { + return new Class[] { + HorizontalLayoutBasic.class, + VerticalLayoutBasic.class }; + } + + @Override + public NamedExternalResource[] getRelatedResources() { + return new NamedExternalResource[] { + new NamedExternalResource("Reference Manual: Layout Alignment", + "/doc/manual/layout.features.alignment.html"), + }; + } +} diff --git a/src/com/itmill/toolkit/demo/sampler/features/layouts/LayoutAlignment.png b/src/com/itmill/toolkit/demo/sampler/features/layouts/LayoutAlignment.png new file mode 100644 index 0000000000000000000000000000000000000000..9269aad0013d95bb1f8358dbfaa9c0b72b5d8cdc GIT binary patch literal 3461 zcma)8c{tQ<+y04=Y)MQR`&vm8^O%vPH@hs^ilG>5CWh<`5Az_)SXwM)FJ+XmWV}dO zo0uY7Vo26$8cYV+8jN|TzrXK0zW2E9>pqX`yqDwt<37&o%&@n!5D_{h1OR}Dm8Gd8 z7sLOg;34j;qFCL)1)gw63uB;e5WK`K_`R(yOaacHc+y^#%Vmz-u|#ms96kOgd4Qr4 z5SJ8)u(CB1nB+MkECOp!dFIZ&{;-wlW#^c$D<#%JGFBLJ=dyb7J+hMWVUJr`5X_Q#tp9kK?%#Ru1t{`RSi(dk8(Ks%7KMNzC&xt)$)LC-0Z5SJxTK)eHZ~?@kV_ zZR?7c)_5e!J}%$qd-%~2dOPv2;{|^74bEU_kHf{p-}A*!?_*ZJs;9|Z_yL1)((xnf z8x3gnT$a7~bt6hggTw2%ou=p+7WsUWLjSCNUj0*QPuQx5pu!-~H5K9x3s$i(N9pBI zH&~)>UspOyAG^x>1=UO2RBi`P@6O$MhT7fUp2_ax6rdRDNIoW@U`4|WZ6!`IUL2S#YqMp0+V#OxJI>xC~9>5mS@it=h^TJ{I)#H4g z&raX#@kzMsinv*NDI7l&@EUXpvkxrUiUUTe1!y-xj>V+s$MZlCUdEH1parGb>7Mwuc=EU#!4#=b()A8`e zRR92)=%@k~;w!5$;02_qeM}~c)wmMn?vOVmr>UG`{B+Lr;`FLmo1(!`xutelQ@X~L z2e15!XkmVl=;`x<#BW8#rAs?|I!?LeGkc#P14sp|xHss{Sa3+ti5Bb1@bGYTP*#P; zOi8xYgLUU$-J~=SFH#r)>(2(a$PE10qSP_36PhqOr8aBeXij&S#v+WL*9XG=qfnJh z@tze@j+H|WHL3fF!f)Lc+^AD7nB1yW#~j0}Z9vWRbCd-S^-jpVgJe-lx}4(S*ncTl zIykG9&S*%T*DRsJ2gw`yv_4-W`h>|X;eOWw!v`nndUm*!_Ib_zq938j^YB6CvsMp> z=+;@;sG_ljjaH68$xRpnU6=m-m4Uo1g@R>{nNcF? z^uhRsVOQOnG(a;jrs<}017fPfF$2)9JVD)c8@PBZyjxs$EhJ}R zGExvwO!}JRQd5$f00z!ZuRx(LitzdS&ePBdwBq zS0n)Vd4#h$C9-~bB$2ZqU7^9hpD@)-s?cb0tFG>=EdU9vTqo2qJX+(IK91(!Wi=84 z8D|Lu2dib2TdG7JJ$cmhBOzOfVYQRD(mT{ikppo zS?lHM3~K&?4^V_}->mnHTT$T0RS5stHVARe;mwkz&|J6kGc)CK8!aE-6Y})T{tVJFMwN&_0$4Bq;~9JaJZF>{;XU%g#r+)- z4a9hj$c_@>QJ~?dmwD;r!nDJf-m}s89mY00U)N{^dG&1FW;_M>| z>rtFrK_x0@mZQp}fy+P186PI%TR~|_m(Ro8I z^G)r1NhH{U5(!KY##*dZPfLW}gyq|OJ6NRJD?r>eHlgR{cB0?hEPC2ln57^%L>V6% zD2-iP3{@-b*jOh!SaJLO$*YxZugp~fr%XC~N=wb1a?GCLQEJCC?lEU*u?IhY*5DaQ z3K4H_7U4HqHOWLVIm5wQ>XJ=q;#@J%0DYS{Q&xETi%hn!x3FT~fG+^}*o-RoAVH}v z*A{1zX$MG1qJMK0YRlXSXL`M?z5~OOK-Rpdb^$H#x3c!cu>th>_Y6phud>+>RhlNpxLRKQ_ZC|S^0hW5!xBzx0`)C=MtNnb#)BQ zoHl!Zj0bsr)wXS)J@0Y`-2bBy!KZMSRQ6z`U%s`jag`DTrFA3k+o>|L&Ao$!d7yrU zUXR_{%RrfXhdFjHOYGF(1t<8tSR>Rsa2p3_!gRqqZ^AS);%$Lndsyg*PP+K12Q_{O zt}(>omx}6E^7^!T4ak)eKBd9Y_1E=pSbT(Jbt7N3Ibqnn6j1sQ44N6YYL0oLnh=sA3k>KfbryvvD+`v)ouiTu?9xsXvH> zxEgedXIrMC)(mDH@|=};fX#G09(&0ZmaS@T4)q7|coW93y#GW?^t+1m2Exu>#(U6E zs3s}J%t6wmJF1E@Ds{fZ0;?g!gQdPsH-2hwFPtih|Fn3mvJGbrK=OyYvPfPIqg$5n zZ%YxCmT*lR$frJ49Jm99xj*i}(8jJ43=8|KZ`TtvbVi+Kve$(~V_T4xQGrL5Bi8iq zuG5EtumM$L0_lXC_4n#W4*?xq(VfFlHYk(U=gc8f{qjpwE25WO&YZj^ zBKzC0Ejhnm#Q(Js4p4ycDA*Ie0z6o3*uQ6n2b+bum_a*$D-fV-dRk&~ayuZE_5(ly r0P$x(orgUq5Q93BZg+i_W3(^7kV+ily9egy`cJ^h%+9pV7@71R)Zw5@ literal 0 HcmV?d00001 diff --git a/src/com/itmill/toolkit/demo/sampler/features/layouts/LayoutAlignmentExample.java b/src/com/itmill/toolkit/demo/sampler/features/layouts/LayoutAlignmentExample.java new file mode 100644 index 0000000000..be5fa6aef8 --- /dev/null +++ b/src/com/itmill/toolkit/demo/sampler/features/layouts/LayoutAlignmentExample.java @@ -0,0 +1,88 @@ +package com.itmill.toolkit.demo.sampler.features.layouts; + +import java.util.Date; + +import com.itmill.toolkit.terminal.Sizeable; +import com.itmill.toolkit.terminal.gwt.client.ui.AlignmentInfo.Bits; +import com.itmill.toolkit.ui.AbstractComponent; +import com.itmill.toolkit.ui.Alignment; +import com.itmill.toolkit.ui.Button; +import com.itmill.toolkit.ui.CheckBox; +import com.itmill.toolkit.ui.GridLayout; +import com.itmill.toolkit.ui.PopupDateField; +import com.itmill.toolkit.ui.TextField; +import com.itmill.toolkit.ui.VerticalLayout; + +public class LayoutAlignmentExample extends VerticalLayout { + + @SuppressWarnings("deprecation") + public LayoutAlignmentExample() { + // Create a grid layout + final GridLayout grid = new GridLayout(3, 3); + + // The style allows us to visualize the cell borders in this example. + grid.addStyleName("example-alignment"); + + grid.setWidth(400, Sizeable.UNITS_PIXELS); + grid.setHeight(400, Sizeable.UNITS_PIXELS); + + /////////////////////////////////////////////////////////// + // Put a component in each cell with respective alignment. + // (We use different ways to set the alignment.) + + // Here we use the shorthand constants to set the alignment: + // Alignment.TOP_LEFT, Alignment.TOP_CENTER, Alignment.TOP_RIGHT + // Alignment.MIDDLE_LEFT, Alignment.MIDDLE_CENTER, Alignment.MIDDLE_RIGHT + // Alignment.BOTTOM_LEFT, Alignment.BOTTOM_CENTER, Alignment.BOTTOM_RIGHT + + Button topleft = new Button("Top Left"); + grid.addComponent(topleft, 0, 0); + grid.setComponentAlignment(topleft, Alignment.TOP_LEFT); + + Button topcenter = new Button("Top Center"); + grid.addComponent(topcenter, 1, 0); + grid.setComponentAlignment(topcenter, Alignment.TOP_CENTER); + + Button topright = new Button("Top Right"); + grid.addComponent(topright, 2, 0); + grid.setComponentAlignment(topright, Alignment.TOP_RIGHT); + + // Here we use bit additions to set the alignment: + // Bits.ALIGNMENT_LEFT, Bits.ALIGNMENT_RIGHT + // Bits.ALIGNMENT_TOP, Bits.ALIGNMENT_BOTTOM + // Bits.ALIGNMENT_VERTICAL_CENTER, Bits.ALIGNMENT_HORIZONTAL_CENTER + + Button middleleft = new Button("Middle Left"); + grid.addComponent(middleleft, 0, 1); + grid.setComponentAlignment(middleleft, new Alignment(Bits.ALIGNMENT_VERTICAL_CENTER + Bits.ALIGNMENT_LEFT)); + + Button middlecenter = new Button("Middle Center"); + grid.addComponent(middlecenter, 1, 1); + grid.setComponentAlignment(middlecenter, new Alignment(Bits.ALIGNMENT_VERTICAL_CENTER + Bits.ALIGNMENT_HORIZONTAL_CENTER)); + + Button middleright = new Button("Middle Right"); + grid.addComponent(middleright, 2, 1); + grid.setComponentAlignment(middleright, new Alignment(Bits.ALIGNMENT_VERTICAL_CENTER + Bits.ALIGNMENT_RIGHT)); + + // Here we again use constants: + + Button bottomleft = new Button("Bottom Left"); + grid.addComponent(bottomleft, 0, 2); + grid.setComponentAlignment(bottomleft, Alignment.BOTTOM_LEFT); + + Button bottomcenter = new Button("Bottom Center"); + grid.addComponent(bottomcenter, 1, 2); + grid.setComponentAlignment(bottomcenter, Alignment.BOTTOM_CENTER); + + Button bottomright = new Button("Bottom Right"); + grid.addComponent(bottomright, 2, 2); + grid.setComponentAlignment(bottomright, Alignment.BOTTOM_RIGHT); + + // Add the layout to the containing layout. + addComponent(grid); + + // Align the grid itself within its container layout. + setComponentAlignment(grid, Alignment.MIDDLE_CENTER); + + } +} diff --git a/src/com/itmill/toolkit/demo/sampler/features/layouts/VerticalLayoutBasic.java b/src/com/itmill/toolkit/demo/sampler/features/layouts/VerticalLayoutBasic.java index 51b9b221f5..cdbcc2175e 100644 --- a/src/com/itmill/toolkit/demo/sampler/features/layouts/VerticalLayoutBasic.java +++ b/src/com/itmill/toolkit/demo/sampler/features/layouts/VerticalLayoutBasic.java @@ -37,7 +37,11 @@ public class VerticalLayoutBasic extends Feature { @Override public Class[] getRelatedFeatures() { - return new Class[] { HorizontalLayoutBasic.class, LayoutSpacing.class }; + return new Class[] { + HorizontalLayoutBasic.class, + LayoutSpacing.class, + LayoutAlignment.class, + }; } @Override -- 2.39.5