[Newbies] Morphic layout: Proportional centering of cells

Thiede, Christoph Christoph.Thiede at student.hpi.uni-potsdam.de
Sat Sep 7 07:35:14 UTC 2019


Thank you for your answer.


Actually, I chose TextMorphs as an example for a non-scalable morph. It is interesting to hear that SimpleButtons center themselves, but how could I achieve the same for, let me say, two ImageMorphs?


[cid:536e67a6-33b4-49ee-9d61-fb5f6cb1a90b]


Best,

Christoph

________________________________
Von: Nicola Mingotti <nmingotti at gmail.com>
Gesendet: Samstag, 7. September 2019 00:24:16
An: A friendly place to get answers to even the most basic questions about Squeak.; Thiede, Christoph
Betreff: Re: [Newbies] Morphic layout: Proportional centering of cells


I guess you are looking from something like this:

note: the ButtonMorph is the only one that by default put the
text in center of its geometry. StringM and TextM do not.

========================

m := RectangleMorph new.
m openInWorld.
m extent: 300 at 300; position: 100 at 100.

m layoutPolicy: TableLayout new.
m listDirection: #topToBottom.   "default, place elements as rows in a table."
m listCentering: #topLeft.
m layoutInset: 5.   "space to container morph."
m cellInset: 5 at 5. "Space between table cells."
m hResizing: #spaceFill.
m vResizing: #spaceFill.
m color: (Color yellow darker darker darker).

t1 := SimpleButtonMorph new.
t1 openInWorld.
t1 color: ((Color green) lighter lighter lighter) .
t1 borderColor: (Color black).
t1 borderWidth: 2.
t1 hResizing: #spaceFill.
t1 vResizing: #spaceFill.
m addMorphBack: t1.

t2 := SimpleButtonMorph new.
t2 openInWorld.
t2 color: ((Color yellow) lighter lighter lighter) .
t2 borderColor: (Color black).
t2 borderWidth: 2.
t2 hResizing: #spaceFill.
t2 vResizing: #spaceFill.
m addMorphBack: t2.

========================


On 9/6/19 6:22 AM, Thiede, Christoph wrote:

Hi,


I am probably not seeing the wood for the trees: How can I achieve the following situation? When the layout changes, both texts should keep their center relative to their owner's bounds:


[cid:part1.C7592CF9.AA979317 at gmail.com]


If I use a ProportionalLayout, I can position the TextMorphs at the offsets 0.5 at 0.25<mailto:0.5 at 0.25> and 0.5 at 0.75<mailto:0.5 at 0.75>, but only with their upper left corner, so they will not really be centered.

If I use a TableLayout, I can center the TextMorphs at the top and the bottom using #listCentering:. However, I cannot center each morph relative to one vertical halft of the owner.

How can I stretch both cells to half the height of the morph? I also experimented with #cellSpacing: but still did not achieve the desired layout. (Also, I did not found any senders of the property in the image.)


Of course, I could use two auxiliary morphs which are arranged using a ProportionalLayout and each contain one text as a centered cell (with #listCentering: and #wrapCentering:). But for me, this feels a quite heavy solution for such a simple problem. Or is this the only way to go?


Thanks in advance,

Christoph



_______________________________________________
Beginners mailing list
Beginners at lists.squeakfoundation.org<mailto:Beginners at lists.squeakfoundation.org>
http://lists.squeakfoundation.org/mailman/listinfo/beginners


-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.squeakfoundation.org/pipermail/beginners/attachments/20190907/4ccd1ad5/attachment-0001.html>
-------------- next part --------------
A non-text attachment was scrubbed...
Name: pastedImage.png
Type: image/png
Size: 5762 bytes
Desc: pastedImage.png
URL: <http://lists.squeakfoundation.org/pipermail/beginners/attachments/20190907/4ccd1ad5/attachment-0003.png>
-------------- next part --------------
A non-text attachment was scrubbed...
Name: pastedImage.png
Type: image/png
Size: 3581 bytes
Desc: pastedImage.png
URL: <http://lists.squeakfoundation.org/pipermail/beginners/attachments/20190907/4ccd1ad5/attachment-0004.png>
-------------- next part --------------
A non-text attachment was scrubbed...
Name: pastedImage.png
Type: image/png
Size: 3785 bytes
Desc: pastedImage.png
URL: <http://lists.squeakfoundation.org/pipermail/beginners/attachments/20190907/4ccd1ad5/attachment-0005.png>


More information about the Beginners mailing list