|
![[back]](/doc/online/icons/DocsUpArrow.gif)
Class: HorizontalPanelView
Object
|
+--GraphicsMedium
|
+--DisplaySurface
|
+--SimpleView
|
+--PanelView
|
+--HorizontalPanelView
|
+--CheckBox
- Package:
- stx:libwidg
- Category:
- Views-Layout
- Version:
- rev:
1.82
date: 2023/04/21 13:45:22
- user: matilk
- file: HorizontalPanelView.st directory: libwidg
- module: stx stc-classLibrary: libwidg
a View which arranges its child-views in a horizontal row.
All real work is done in PanelView - only the layout computation is
redefined here.
The layout is controlled the instance variables:
horizontalLayout and verticalLayout
in addition to
horizontalSpace and verticalSpace.
HorizontalSpace and verticalSpace control the spacing between elements;
they default to some 1mm.
The horizontal layout can be any of:
#left arrange elements at left
#leftSpace arrange elements at the left, start with spacing
#fixLeft same as #left, but do not reduce spacing in case of no fit
#fixLeftSpace same as #leftSpace, but do not reduce spacing in case of no fit
#right arrange elements at the right
#rightSpace arrange elements at the right, start with spacing
#center arrange elements in the center
#spread spread elements evenly
#spreadSpace spread elements evenly with spacing at the ends
#fit like #spread, but resize elements for tight packing
#fitSpace like #fit, with additional spacing at the far ends
#leftFit like #left, but extend the last (rightMost) element to the right
#leftSpaceFit like #leftSpace, but extend the last (rightMost) element to the right
#rightFit like #right, but extend the first (leftMost) element to the left
#rightSpaceFit like #rightSpace, but extend the first (leftMost) element to the left
#leftMax like corresponding non-Max layouts,
#leftSpaceMax but resize all components to width of widest components
#rightMax
#rightSpaceMax
#centerMax
#spreadMax
#spreadSpaceMax
the vertical layout can be:
#top place element at the top
#topSpace place element at the top, offset by verticalSpace
#center place it horizontally centered
#bottom place it at the bottom
#bottomSpace place it at the bottom, offset by verticalSpace
#fit resize elements vertically to fit this panel
#fitSpace like #fit, but with spacing
#topMax like #top, but resize all views vertically to max height
#topSpaceMax like #topSpace, but resize all views vertically to max height
#bottomMax like #bottom, but resize all views vertically to max height
#bottomSpaceMax like #bottomSpace, but resize all views vertically to max height
#centerMax like #center, but resize all views vertically to max height
The defaults is #center for both directions.
The layout is changed by the messages #verticalLayout: and #horizontalLayout:.
For backward compatibility (to times, where only hLayout existed), the simple
#layout: does the same as #horizontalLayout:.
Do not use this old method; it will vanish and currently outputs a warning.
The panel assumes, that the elements do not resize themselfes, after it
became visible. This is not true for all widgets (buttons, labels or
inputFields may like to change).
If you have changing elements, tell this to the panel
with 'aPanel elementsChangeSize:true'. In that case, the panel will react
to size changes of its elements, and reorganize things.
By combining Horizontal- and VerticalPanels (i.e. place a hPanel into a
vPanel), most layouts should be implementable.
However, iff none of these layout/space combinations is exactly what you need
in your application, create a subclass, and redefine the setChildPositions
method there.
TODO: for completeness, support #fixRight, #fixRightSpace,
#rightFit, #rightSpaceFit layouts
CAVEAT:
this class started with #left and no vertical alignments;
as time went by, more layouts were added (by users requests)
and now, many layout combinations are possible.
Reflecting on this, the setup should be changed to use different selectors
for space-on/off, max-resize and alignment
(i.e. having more and more layout symbols makes things a bit confusing ...)
Maybe this should be split into multiple layout-algorithm providers,
and definitely it should even be made a separate Layouter, to be pluggable into
any view and get rid of the explicit PanelViews.
[author:]
Claus Gittinger
copyrightCOPYRIGHT (c) 1989 by Claus Gittinger
All Rights Reserved
This software is furnished under a license and may be used
only in accordance with the terms of that license and with the
inclusion of the above copyright notice. This software may not
be provided or otherwise made available to, or used by, any
other person. No title to or ownership of the software is
hereby transferred.
queries
-
possibleHorizontalLayouts
-
-
possibleVerticalLayouts
-
accessing
-
horizontalLayout
-
return the horizontal layout as symbol.
the returned value is one of
#left arrange elements at the left
#leftSpace arrange elements at the left, start with spacing
#fixLeft same as #left, but do not reduce spacing in case of no fit
#fixLeftSpace same as #leftSpace, but do not reduce spacing in case of no fit
#right arrange elements at the right
#rightSpace arrange elements at the right, start with spacing
#center arrange elements in the center
#spread spread elements evenly
#spreadSpace spread elements evenly with spacing at the ends
#fit like #spread, but resize elements for tight packing
#fitSpace like #fit, with additional spacing at the far ends
#leftFit like #left, but resize the last element to fit
#leftSpaceFit like #leftSpace, but resize the last element to fit
#rightFit like #right, but resize the first element to fit
#rightSpaceFit like #rightSpace, but resize the first element to fit
the default is #center
See the class documentation for the meanings.
-
horizontalLayout: layoutSymbolArg
-
change the horizontal layout as symbol.
The argument, aSymbol must be one of:
#okCancelBox window system specific. Will dynamically be one of:
#maxRightSpace or #fitSpace, depending on style sheet value.
#left arrange elements at the left
#leftSpace arrange elements at the left, start with spacing
#fixLeft same as #left, but do not reduce spacing in case of no fit
#fixLeftSpace same as #leftSpace, but do not reduce spacing in case of no fit
#right arrange elements at the right
#rightSpace arrange elements at the right, start with spacing
#center arrange elements in the center
#spread spread elements evenly
#spreadSpace spread elements evenly with spacing at the ends
#fit like #spread, but resize elements for tight packing
#fitSpace like #fit, with additional spacing at the far ends
#leftFit like #left, but resize the last element to fit
#leftSpaceFit like #leftSpace, but resize the last element to fit
#rightFit like #right, but resize the first element to fit
#rightSpaceFit like #rightSpace, but resize the first element to fit
#leftMax like non-Max layouts, resizing components to
#leftSpaceMax the width of the widest component
#rightMax
#rightSpaceMax
#centerMax
#spreadMax
#spreadSpaceMax
the default (if never changed) is #center.
See the class documentation for the meanings.
-
layout: something
-
OBSOLETE compatibility interface. Will vanish.
leftover for historic reasons - do not use any more.
In the meantime, try to figure out what is meant ... a kludge
** This is an obsolete interface - do not use it (it may vanish in future versions) **
-
reverseOrderIfOKAtLeft
-
return the reverseOrderIfOKAtLeft flag.
This can be set for OK-Cancel like panels, where the OK Button should
be positioned on the left for some viewStyles.
-
reverseOrderIfOKAtLeft: aBoolean
-
set/clear the reverseOrderIfOKAtLeft flag.
This can be set for OK-Cancel like panels, where the OK Button should
be positioned on the left for some viewStyles.
-
verticalLayout
-
return the vertical layout as a symbol.
the returned value is one of
#top place element at the top
#topSpace place element at the top, offset by verticalSpace
#center place it horizontally centered
#bottom place it at the bottom
#bottomSpace place it at the bottom, offset by verticalSpace
#fit resize elements vertically to fit this panel
#fitSpace like #fit, but with spacing
#topMax like #top, but resize all views vertically to max height
#topSpaceMax like #topSpace, but resize all views vertically to max height
#bottomMax like #bottom, but resize all views vertically to max height
#bottomSpaceMax like #bottomSpace, but resize all views vertically to max height
#centerMax like #center, but resize all views vertically to max height
the default is #center
See the class documentation for the meanings.
-
verticalLayout: aSymbol
-
change the vertical layout as a symbol.
The argument, aSymbol must be one of:
#top place element at the top
#topSpace place element at the top, offset by verticalSpace
#center place it horizontally centered
#bottom place it at the bottom
#bottomSpace place it at the bottom, offset by verticalSpace
#fit resize elements vertically to fit this panel
#fitSpace like #fit, but with spacing
#topMax like #top, but resize all views vertically to max height
#topSpaceMax like #topSpace, but resize all views vertically to max height
#bottomMax like #bottom, but resize all views vertically to max height
#bottomSpaceMax like #bottomSpace, but resize all views vertically to max height
#centerMax like #center, but resize all views vertically to max height
the default (if never changed) is #center
See the class documentation for the meanings.
focus handling
-
subviewsInFocusOrder
-
layout
-
setChildPositions
-
(re)compute the position of every child;
called whenever children are added/removed or my size has changed
queries
-
computePreferredExtent
-
return a good extent, one that makes subviews fit
-
isHorizontal
-
are the subviews arranged horizontally
These examples show the effect of various horizontalLayout and
verticalLayout settings. Try them all. Especially, notice the
differences between the xxx and xxxSpace layouts and the effect of
setting different values for the spacing.
Try resizing the view and see how the elements get rearranged.
Most of the examples below place 3 buttons onto a panel;
Of course, you can put any other view into a panel ... the last examples show this.
(The fit layouts are especially useful to be used with SelectionInListViews;
you can combine multiple labels & editFields with a selectionInListView, which
is expanded to fill the remaining area of the view)
example: default layout (center)
centers components
|v p b1 b2 b3|
v := StandardSystemView new.
v label:'default: center'.
p := HorizontalPanelView in:v.
p origin:(0.0 @ 0.0) corner:(1.0 @ 1.0).
b1 := Button label:'button1' in:p.
b2 := Button label:'button2' in:p.
b3 := Button label:'button3' in:p.
v extent:300 @ 100.
v open
|
example: same (default center layout) with different sized elements
|v p b1 b2 b3|
v := StandardSystemView new.
v label:'default: center'.
p := HorizontalPanelView in:v.
p origin:(0.0 @ 0.0) corner:(1.0 @ 1.0).
b1 := Button label:'but1' in:p. b1 font:(b1 font asSize:8).
b2 := Button label:'b2' in:p. b2 font:(b1 font asSize:24).
b3 := Button label:'button3' in:p.
v extent:300 @ 100.
v open
|
example: horizontal default (center); vertical centerMax
|v p b1 b2 b3|
v := StandardSystemView new.
v label:'vL=centerMax'.
p := HorizontalPanelView in:v.
p verticalLayout:#centerMax.
p origin:(0.0 @ 0.0) corner:(1.0 @ 1.0).
b1 := Button label:'but1' in:p. b1 font:(b1 font asSize:8).
b2 := Button label:'b2' in:p. b2 font:(b1 font asSize:24).
b3 := Button label:'button3' in:p.
v extent:300 @ 100.
v open
|
example: horizontal default (center); vertical topMax
|v p b1 b2 b3|
v := StandardSystemView new.
v label:'vL=topMax'.
p := HorizontalPanelView in:v.
p verticalLayout:#topMax.
p origin:(0.0 @ 0.0) corner:(1.0 @ 1.0).
b1 := Button label:'but1' in:p. b1 font:(b1 font asSize:8).
b2 := Button label:'b2' in:p. b2 font:(b1 font asSize:24).
b3 := Button label:'button3' in:p.
v extent:300 @ 100.
v open
|
example: horizontal default (center); vertical topSpaceMax
|v p b1 b2 b3|
v := StandardSystemView new.
v label:'vL=topSpaceMax'.
p := HorizontalPanelView in:v.
p verticalLayout:#topSpaceMax.
p origin:(0.0 @ 0.0) corner:(1.0 @ 1.0).
b1 := Button label:'but1' in:p. b1 font:(b1 font asSize:8).
b2 := Button label:'b2' in:p. b2 font:(b1 font asSize:24).
b3 := Button label:'button3' in:p.
v extent:300 @ 100.
v open
|
example: horizontal default (center); vertical bottomMax
|v p b1 b2 b3|
v := StandardSystemView new.
v label:'vL=bottomMax'.
p := HorizontalPanelView in:v.
p verticalLayout:#bottomMax.
p origin:(0.0 @ 0.0) corner:(1.0 @ 1.0).
b1 := Button label:'but1' in:p. b1 font:(b1 font asSize:8).
b2 := Button label:'b2' in:p. b2 font:(b1 font asSize:24).
b3 := Button label:'button3' in:p.
v extent:300 @ 100.
v open
|
example: horizontal default (center); vertical bottomSpaceMax
|v p b1 b2 b3|
v := StandardSystemView new.
v label:'vL=bottomSpaceMax'.
p := HorizontalPanelView in:v.
p verticalLayout:#bottomSpaceMax.
p origin:(0.0 @ 0.0) corner:(1.0 @ 1.0).
b1 := Button label:'but1' in:p. b1 font:(b1 font asSize:8).
b2 := Button label:'b2' in:p. b2 font:(b1 font asSize:24).
b3 := Button label:'button3' in:p.
v extent:300 @ 100.
v open
|
example: left-layout (vertical is default -> center)
fills left-to-right; no spacing before leftMost component
|v p b1 b2 b3|
v := StandardSystemView new.
p := HorizontalPanelView in:v.
v label:'hL=left; vL=default (center)'.
p horizontalLayout:#left.
p origin:(0.0 @ 0.0) corner:(1.0 @ 1.0).
b1 := Button label:'button1' in:p.
b2 := Button label:'button2' in:p.
b3 := Button label:'button3' in:p.
v extent:300 @ 100.
v open
|
example: left starting with spacing (vertical is default -> center)
fills left-to-right; spacing before leftMost component
|v p b1 b2 b3|
v := StandardSystemView new.
p := HorizontalPanelView in:v.
v label:'hL=leftSpace; vL=center'.
p horizontalLayout:#leftSpace.
p origin:(0.0 @ 0.0) corner:(1.0 @ 1.0).
b1 := Button label:'button1' in:p.
b2 := Button label:'button2' in:p.
b3 := Button label:'button3' in:p.
v extent:300 @ 100.
v open
|
example: leftFit-layout (vertical is default -> center)
fills left-to-right; resizes the rightMost component to fit
|v p b1 b2 b3|
v := StandardSystemView new.
p := HorizontalPanelView in:v.
v label:'hL=leftFit; vL=center'.
p horizontalLayout:#leftFit.
p origin:(0.0 @ 0.0) corner:(1.0 @ 1.0).
b1 := Button label:'button1' in:p.
b2 := Button label:'button2' in:p.
b3 := Button label:'button3' in:p.
v extent:300 @ 100.
v open
|
example: leftSpaceFit-layout (vertical is default -> center)
fills left-to-right;
starts with spacing & resizes the rightMost component to fit with spacing
|v p b1 b2 b3|
v := StandardSystemView new.
p := HorizontalPanelView in:v.
v label:'hL=leftSpaceFit; vL=center'.
p horizontalLayout:#leftSpaceFit.
p origin:(0.0 @ 0.0) corner:(1.0 @ 1.0).
b1 := Button label:'button1' in:p.
b2 := Button label:'button2' in:p.
b3 := Button label:'button3' in:p.
v extent:300 @ 100.
v open
|
example: right-layout (vertical is default -> center)
right-to-left
|v p b1 b2 b3|
v := StandardSystemView new.
v viewBackground:Color yellow.
p := HorizontalPanelView in:v.
p viewBackground:Color red.
v label:'hL=right; vL=center'.
p horizontalLayout:#rightSpaceFit.
p origin:(0.0 @ 0.0) corner:(1.0 @ 1.0).
b1 := View in:p. b1 viewBackground:(Color green).
b2 := View in:p. b2 viewBackground:(Color gray).
b3 := View in:p. b3 viewBackground:(Color white).
v extent:300 @ 100.
v open
|
example: right with initial spacing (vertical is default -> center)
right-to-left with spacing after last component
|v p b1 b2 b3|
v := StandardSystemView new.
p := HorizontalPanelView in:v.
v label:'hL=rightSpace; vL=center'.
p horizontalLayout:#rightSpace.
p origin:(0.0 @ 0.0) corner:(1.0 @ 1.0).
b1 := Button label:'button1' in:p.
b2 := Button label:'button2' in:p.
b3 := Button label:'button3' in:p.
v extent:300 @ 100.
v open
|
example: rightFit-layout (vertical is default -> center)
right-to-left; resize the leftMost component to fit
|v p b1 b2 b3|
v := StandardSystemView new.
p := HorizontalPanelView in:v.
v label:'hL=rightFit; vL=center'.
p horizontalLayout:#rightFit.
p origin:(0.0 @ 0.0) corner:(1.0 @ 1.0).
b1 := Button label:'button1' in:p.
b2 := Button label:'button2' in:p.
b3 := Button label:'button3' in:p.
v extent:300 @ 100.
v open
|
example: rightSpaceFit with initial spacing (vertical is default -> center)
right-to-left; start with spacing & resize the leftMost to fit
|v p b1 b2 b3|
v := StandardSystemView new.
p := HorizontalPanelView in:v.
v label:'hL=rightSpaceFit; vL=center'.
p horizontalLayout:#rightSpaceFit.
p origin:(0.0 @ 0.0) corner:(1.0 @ 1.0).
b1 := Button label:'button1' in:p.
b2 := Button label:'button2' in:p.
b3 := Button label:'button3' in:p.
v extent:300 @ 100.
v open
|
example: fit-layout (vertical is default -> center)
|v p b1 b2 b3|
v := StandardSystemView new.
p := HorizontalPanelView in:v.
p horizontalLayout:#fit.
v label:'hL=fit; vL=center'.
p origin:(0.0 @ 0.0) corner:(1.0 @ 1.0).
b1 := Button label:'button1' in:p.
b2 := Button label:'button2' in:p.
b3 := Button label:'button3' in:p.
v extent:300 @ 100.
v open
|
example: full fit i.e. no spacing (vertical is default -> center)
|v p b1 b2 b3|
v := StandardSystemView new.
p := HorizontalPanelView in:v.
p horizontalLayout:#fit.
p horizontalSpace:0.
v label:'hL=fit hS=0; vL=center'.
p origin:(0.0 @ 0.0) corner:(1.0 @ 1.0).
b1 := Button label:'button1' in:p.
b2 := Button label:'button2' in:p.
b3 := Button label:'button3' in:p.
v extent:300 @ 100.
v open
|
example: fit with spacing (vertical is default -> center)
|v p b1 b2 b3|
v := StandardSystemView new.
p := HorizontalPanelView in:v.
v label:'hL=fitSpace; vL=center'.
p horizontalLayout:#fitSpace.
p origin:(0.0 @ 0.0) corner:(1.0 @ 1.0).
b1 := Button label:'button1' in:p.
b2 := Button label:'button2' in:p.
b3 := Button label:'button3' in:p.
v extent:300 @ 100.
v open
|
example: spread-layout (vertical is default -> center)
|v p b1 b2 b3|
v := StandardSystemView new.
p := HorizontalPanelView in:v.
p horizontalLayout:#spread.
v label:'hL=spread; vL=center'.
p origin:(0.0 @ 0.0) corner:(1.0 @ 1.0).
b1 := Button label:'button1' in:p.
b2 := Button label:'button2' in:p.
b3 := Button label:'button3' in:p.
v extent:300 @ 100.
v open
|
example: spread with spacing (vertical is default -> center)
|v p b1 b2 b3|
v := StandardSystemView new.
p := HorizontalPanelView in:v.
v label:'hL=spreadSpace; vL=center'.
p horizontalLayout:#spreadSpace.
p origin:(0.0 @ 0.0) corner:(1.0 @ 1.0).
b1 := Button label:'button1' in:p.
b2 := Button label:'button2' in:p.
b3 := Button label:'button3' in:p.
v extent:300 @ 100.
v open
|
example: spread with spacing; vertical fit
|v p b1 b2 b3|
v := StandardSystemView new.
p := HorizontalPanelView in:v.
v label:'hL=spreadSpace; vL=fit'.
p horizontalLayout:#spreadSpace.
p verticalLayout:#fit.
p origin:(0.0 @ 0.0) corner:(1.0 @ 1.0).
b1 := Button label:'button1' in:p.
b2 := Button label:'button2' in:p.
b3 := Button label:'button3' in:p.
v extent:300 @ 100.
v open
|
example: spread with spacing; vertical fit with spacing
|v p b1 b2 b3|
v := StandardSystemView new.
p := HorizontalPanelView in:v.
v label:'hL=spreadSpace; vL=fitSpace'.
p horizontalLayout:#spreadSpace.
p verticalLayout:#fitSpace.
p origin:(0.0 @ 0.0) corner:(1.0 @ 1.0).
b1 := Button label:'button1' in:p.
b2 := Button label:'button2' in:p.
b3 := Button label:'button3' in:p.
v extent:300 @ 100.
v open
|
example: fit - top
|v p b1 b2 b3|
v := StandardSystemView new.
p := HorizontalPanelView in:v.
v label:'hL=fit; vL=top'.
p horizontalLayout:#fit.
p verticalLayout:#top.
p origin:(0.0 @ 0.0) corner:(1.0 @ 1.0).
b1 := Button label:'button1' in:p.
b2 := Button label:'button2' in:p.
b3 := Button label:'button3' in:p.
v extent:300 @ 100.
v open
|
example: fit with initial spacing
|v p b1 b2 b3|
v := StandardSystemView new.
p := HorizontalPanelView in:v.
v label:'hL=fitSpace; vL=top'.
p horizontalLayout:#fitSpace.
p verticalLayout:#top.
p origin:(0.0 @ 0.0) corner:(1.0 @ 1.0).
b1 := Button label:'button1' in:p.
b2 := Button label:'button2' in:p.
b3 := Button label:'button3' in:p.
v extent:300 @ 100.
v open
|
example: fit with initial spacing in both directions
|v p b1 b2 b3|
v := StandardSystemView new.
p := HorizontalPanelView in:v.
v label:'hL=fitSpace; vL=fitSpace'.
p horizontalLayout:#fitSpace.
p verticalLayout:#fitSpace.
p origin:(0.0 @ 0.0) corner:(1.0 @ 1.0).
b1 := Button label:'button1' in:p.
b2 := Button label:'button2' in:p.
b3 := Button label:'button3' in:p.
v extent:300 @ 100.
v open
|
example: fit without spacing in both directions
|v p b1 b2 b3|
v := StandardSystemView new.
p := HorizontalPanelView in:v.
v label:'hL=fit hS=0; vL=fit'.
p horizontalLayout:#fit.
p verticalLayout:#fit.
p horizontalSpace:0.
p origin:(0.0 @ 0.0) corner:(1.0 @ 1.0).
b1 := Button label:'button1' in:p.
b2 := Button label:'button2' in:p.
b3 := Button label:'button3' in:p.
v extent:300 @ 100.
v open
|
example: fit with initial spacing; top with spacing
|v p b1 b2 b3|
v := StandardSystemView new.
p := HorizontalPanelView in:v.
v label:'hL=fitSpace; vL=topSpace'.
p horizontalLayout:#fitSpace.
p verticalLayout:#topSpace.
p origin:(0.0 @ 0.0) corner:(1.0 @ 1.0).
b1 := Button label:'button1' in:p.
b2 := Button label:'button2' in:p.
b3 := Button label:'button3' in:p.
v extent:300 @ 100.
v open
|
example: fit - top without spacing
|v p b1 b2 b3|
v := StandardSystemView new.
p := HorizontalPanelView in:v.
v label:'hL=fit; vL=top'.
p horizontalLayout:#fit.
p verticalLayout:#top.
p horizontalSpace:0.
p origin:(0.0 @ 0.0) corner:(1.0 @ 1.0).
b1 := Button label:'button1' in:p.
b2 := Button label:'button2' in:p.
b3 := Button label:'button3' in:p.
v extent:300 @ 100.
v open
|
example: fit - bottom with spacing and bottomSpace
|v p b1 b2 b3|
v := StandardSystemView new.
p := HorizontalPanelView in:v.
v label:'hL=fitSpace; vL=bottomSpace'.
p horizontalLayout:#fitSpace.
p verticalLayout:#bottomSpace.
p origin:(0.0 @ 0.0) corner:(1.0 @ 1.0).
b1 := Button label:'button1' in:p.
b2 := Button label:'button2' in:p.
b3 := Button label:'button3' in:p.
v extent:300 @ 100.
v open
|
example: fit no horizontal space - bottom with spacing and bottomSpace
|v p b1 b2 b3|
v := StandardSystemView new.
p := HorizontalPanelView in:v.
v label:'hL=fit; vL=bottomSpace'.
p horizontalLayout:#fit.
p verticalLayout:#bottomSpace.
p horizontalSpace:0.
p origin:(0.0 @ 0.0) corner:(1.0 @ 1.0).
b1 := Button label:'button1' in:p.
b2 := Button label:'button2' in:p.
b3 := Button label:'button3' in:p.
v extent:300 @ 100.
v open
|
example: leftMax - vertical default
|v p b1 b2 b3|
v := StandardSystemView new.
p := HorizontalPanelView in:v.
v label:'hL=leftMax; vL=default'.
p horizontalLayout:#leftMax.
p origin:(0.0 @ 0.0) corner:(1.0 @ 1.0).
b1 := Button label:'button1' in:p.
b2 := Button label:'b2' in:p.
b3 := Button label:'but3' in:p.
v extent:300 @ 100.
v open
|
example: leftSpaceMax - vertical default
|v p b1 b2 b3|
v := StandardSystemView new.
p := HorizontalPanelView in:v.
v label:'hL=leftSpaceMax; vL=default'.
p horizontalLayout:#leftSpaceMax.
p origin:(0.0 @ 0.0) corner:(1.0 @ 1.0).
b1 := Button label:'button1' in:p.
b2 := Button label:'b2' in:p.
b3 := Button label:'but3' in:p.
v extent:300 @ 100.
v open
|
example: rightMax - vertical default
|v p b1 b2 b3|
v := StandardSystemView new.
p := HorizontalPanelView in:v.
v label:'hL=rightMax; vL=default'.
p horizontalLayout:#rightMax.
p origin:(0.0 @ 0.0) corner:(1.0 @ 1.0).
b1 := Button label:'button1' in:p.
b2 := Button label:'b2' in:p.
b3 := Button label:'but3' in:p.
v extent:300 @ 100.
v open
|
example: rightSpaceMax - vertical default
|v p b1 b2 b3|
v := StandardSystemView new.
p := HorizontalPanelView in:v.
v label:'hL=rightSpaceMax; vL=default'.
p horizontalLayout:#rightSpaceMax.
p origin:(0.0 @ 0.0) corner:(1.0 @ 1.0).
b1 := Button label:'button1' in:p.
b2 := Button label:'b2' in:p.
b3 := Button label:'but3' in:p.
v extent:300 @ 100.
v open
|
example: centerMax - vertical default
|v p b1 b2 b3|
v := StandardSystemView new.
p := HorizontalPanelView in:v.
v label:'hL=centerMax; vL=default'.
p horizontalLayout:#centerMax.
p origin:(0.0 @ 0.0) corner:(1.0 @ 1.0).
b1 := Button label:'button1' in:p.
b2 := Button label:'b2' in:p.
b3 := Button label:'but3' in:p.
v extent:300 @ 100.
v open
|
example: spreadMax - vertical default
|v p b1 b2 b3|
v := StandardSystemView new.
p := HorizontalPanelView in:v.
v label:'hL=spreadMax; vL=default'.
p horizontalLayout:#spreadMax.
p origin:(0.0 @ 0.0) corner:(1.0 @ 1.0).
b1 := Button label:'button1' in:p.
b2 := Button label:'b2' in:p.
b3 := Button label:'but3' in:p.
v extent:300 @ 100.
v open
|
example: spreadSpaceMax - vertical default
|v p b1 b2 b3|
v := StandardSystemView new.
p := HorizontalPanelView in:v.
v label:'hL=spreadSpaceMax; vL=default'.
p horizontalLayout:#spreadSpaceMax.
p origin:(0.0 @ 0.0) corner:(1.0 @ 1.0).
b1 := Button label:'button1' in:p.
b2 := Button label:'b2' in:p.
b3 := Button label:'but3' in:p.
v extent:300 @ 100.
v open
|
example: maximize elements in both directions and center
|v p b1 b2 b3|
v := StandardSystemView new.
v label:'hL=centerMax; vL=centerMax'.
p := HorizontalPanelView in:v.
p horizontalLayout:#centerMax.
p verticalLayout:#centerMax.
p origin:(0.0 @ 0.0) corner:(1.0 @ 1.0).
b1 := Button label:'but1' in:p. b1 font:(b1 font asSize:8).
b2 := Button label:'b2' in:p. b2 font:(b1 font asSize:24).
b3 := Button label:'button3' in:p.
v extent:300 @ 100.
v open
|
example: placing hPanels into a vPanel
|v vP hP1 hP2 hP3 b1 b2 b3 b4 b5 b6 b7 b8 b9|
v := StandardSystemView new.
vP := VerticalPanelView in:v.
vP origin:(0.0 @ 0.0) corner:(1.0 @ 1.0).
vP verticalLayout:#fit;
verticalSpace:0;
horizontalLayout:#fit.
hP1 := HorizontalPanelView in:vP.
hP1 horizontalLayout:#fitSpace;
verticalLayout:#center.
b1 := Button label:'button1' in:hP1.
b2 := Button label:'button2' in:hP1.
b3 := Button label:'button3' in:hP1.
hP2 := HorizontalPanelView in:vP.
hP2 horizontalLayout:#fitSpace;
verticalLayout:#center.
b4 := Button label:'button4' in:hP2.
b5 := Button label:'button5' in:hP2.
b6 := Button label:'button6' in:hP2.
hP3 := HorizontalPanelView in:vP.
hP3 horizontalLayout:#fitSpace;
verticalLayout:#center.
b7 := Button label:'button7' in:hP3.
b8 := Button label:'button8' in:hP3.
b9 := Button label:'button9' in:hP3.
v extent:300 @ 300.
v open
|
example: a browser like table, the two left tables have a fix width,
while the rightmost list extends to the far right.
|v p l1 l2 l3|
v := StandardSystemView new.
p := HorizontalPanelView in:v.
v label:'hL=leftFit hS=0; vL=fit'.
p horizontalLayout:#leftFit.
p horizontalSpace:0.
p verticalLayout:#fit.
p origin:(0.0 @ 0.0) corner:(1.0 @ 1.0).
l1 := ScrollableView for:FileSelectionList in:p.
l1 stayInDirectory:true.
l1 ignoreParentDirectory:true.
l1 directory:'/'.
l1 action:[:selection | l2 directory:(l1 selectedPathname)].
l2 := ScrollableView for:FileSelectionList in:p.
l2 stayInDirectory:true.
l2 directory:nil.
l2 ignoreParentDirectory:true.
l2 action:[:selection | l3 directory:(l2 selectedPathname)].
l3 := ScrollableView for:FileSelectionList in:p.
l3 directory:nil.
l3 ignoreParentDirectory:false.
v extent:400 @ 300.
v open
|
trouble example: self-resizing elements may cause trouble
|v p l1 l2 l3|
v := StandardSystemView new.
p := HorizontalPanelView origin:(0.0 @ 0.0) corner:(1.0 @ 1.0) in:v.
l1 := (Label label:'one' in:p) level:-1.
l2 := (Label label:'two' in:p) level:-1.
l3 := (Label label:'three' in:p) level:-1.
v extent:400 @ 300.
v open.
(Delay forSeconds:5) wait.
l1 label:'oneone'.
l2 label:'twotwo'.
l3 label:'threethree'.
|
fixed trouble example: tell the panel that this situation may happen
|v p l1 l2 l3|
v := StandardSystemView new.
p := HorizontalPanelView origin:(0.0 @ 0.0) corner:(1.0 @ 1.0) in:v.
p elementsChangeSize:true.
l1 := (Label label:'one' in:p) level:-1.
l2 := (Label label:'two' in:p) level:-1.
l3 := (Label label:'three' in:p) level:-1.
v extent:400 @ 300.
v open.
(Delay forSeconds:5) wait.
l1 label:'oneone'.
l2 label:'twotwo'.
l3 label:'threethree'.
|
|
