<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html;
      charset=windows-1252">
  </head>
  <body bgcolor="#FFFFFF" text="#000000">
    <br>
    ook, this is what i did to solve your problem. <br>
    <br>
    I defined a class CenteringMorph. It is simply a rectangle which has
    a 'son' element, it  keeps the 'son' always in its center. <br>
    <br>
    Then, you put  CenteringMorph instances in the TableLayout, and let
    them expand to eat all the available space. <br>
    <br>
    The class CenteringMorph is defined in this Package:<br>
    <a title="static project url"
      href="http://www.squeaksource.com/MorphicAddendum.html"
      style="color: rgb(54, 0, 132); text-decoration: none; font-family:
      Geneva, Arial, Helvetica, sans-serif; font-size: 15.04px;
      font-style: normal; font-variant-ligatures: normal;
      font-variant-caps: normal; font-weight: 400; letter-spacing:
      normal; orphans: 2; text-align: justify; text-indent: 0px;
      text-transform: none; white-space: normal; widows: 2;
      word-spacing: 0px; -webkit-text-stroke-width: 0px;
      background-color: rgb(255, 255, 255);">http://www.squeaksource.com/MorphicAddendum.html</a><br>
    <br>
    Look in the CenteringMorph class documentation to see how to run the
    example.<br>
    <br>
    bye<br>
    Nicola <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <div class="moz-cite-prefix">On 9/7/19 12:35 AM, Thiede, Christoph
      wrote:<br>
    </div>
    <blockquote type="cite"
      cite="mid:107a18021aa148f69c6eac6c078d102e@student.hpi.uni-potsdam.de">
      <meta http-equiv="Content-Type" content="text/html;
        charset=windows-1252">
      <style type="text/css" style="display:none;"><!-- P {margin-top:0;margin-bottom:0;} --></style>
      <div id="divtagdefaultwrapper"
style="font-size:12pt;color:#000000;font-family:Calibri,Helvetica,sans-serif;"
        dir="ltr">
        <p>Thank you for your answer.</p>
        <p><br>
        </p>
        <p>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?</p>
        <p><br>
        </p>
        <p><img size="3785" contenttype="image/png" id="img640548"
            style="max-width: 99.9%; user-select: none;"
            contextid="img550848" tabindex="0"
            src="cid:part2.32DEF195.251BC561@gmail.com" class=""><br>
        </p>
        <p><br>
        </p>
        <p>Best,</p>
        <p>Christoph</p>
        <div id="Signature">
          <div name="divtagdefaultwrapper"
            style="font-family:Calibri,Arial,Helvetica,sans-serif;
            font-size:; margin:0">
          </div>
        </div>
      </div>
      <hr style="display:inline-block;width:98%" tabindex="-1">
      <div id="divRplyFwdMsg" dir="ltr"><font style="font-size:11pt"
          face="Calibri, sans-serif" color="#000000"><b>Von:</b> Nicola
          Mingotti <a class="moz-txt-link-rfc2396E" href="mailto:nmingotti@gmail.com"><nmingotti@gmail.com></a><br>
          <b>Gesendet:</b> Samstag, 7. September 2019 00:24:16<br>
          <b>An:</b> A friendly place to get answers to even the most
          basic questions about Squeak.; Thiede, Christoph<br>
          <b>Betreff:</b> Re: [Newbies] Morphic layout: Proportional
          centering of cells</font>
        <div> </div>
      </div>
      <div><br>
        I guess you are looking from something like this: <br>
        <br>
        note: the ButtonMorph is the only one that by default put the<br>
        text in center of its geometry. StringM and TextM do not.<br>
        <br>
        ========================<br>
        <br>
        m := RectangleMorph new.<br>
        m openInWorld.<br>
        m extent: 300@300; position: 100@100.<br>
        <br>
        m layoutPolicy: TableLayout new.<br>
        m listDirection: #topToBottom.   "default, place elements as
        rows in a table."<br>
        m listCentering: #topLeft. <br>
        m layoutInset: 5.   "space to container morph."<br>
        m cellInset: 5@5. "Space between table cells."<br>
        m hResizing: #spaceFill. <br>
        m vResizing: #spaceFill.<br>
        m color: (Color yellow darker darker darker).<br>
        <br>
        t1 := SimpleButtonMorph new.<br>
        t1 openInWorld. <br>
        t1 color: ((Color green) lighter lighter lighter) .<br>
        t1 borderColor: (Color black). <br>
        t1 borderWidth: 2.<br>
        t1 hResizing: #spaceFill.<br>
        t1 vResizing: #spaceFill.<br>
        m addMorphBack: t1.<br>
        <br>
        t2 := SimpleButtonMorph new. <br>
        t2 openInWorld. <br>
        t2 color: ((Color yellow) lighter lighter lighter) .<br>
        t2 borderColor: (Color black). <br>
        t2 borderWidth: 2.<br>
        t2 hResizing: #spaceFill.<br>
        t2 vResizing: #spaceFill.<br>
        m addMorphBack: t2.<br>
        <br>
        ========================<br>
        <br>
        <br>
        <div class="moz-cite-prefix">On 9/6/19 6:22 AM, Thiede,
          Christoph wrote:<br>
        </div>
        <blockquote type="cite"
          cite="mid:c4bba99decfa4922a89bb641e2e7ea23@student.hpi.uni-potsdam.de">
          <style type="text/css" style="display:none;"><!-- P {margin-top:0;margin-bottom:0;} --></style>
          <div id="divtagdefaultwrapper" dir="ltr" style="font-size:
            12pt; color: rgb(0, 0, 0); font-family: Calibri, Helvetica,
            sans-serif, EmojiFont, "Apple Color Emoji",
            "Segoe UI Emoji", NotoColorEmoji, "Segoe UI
            Symbol", "Android Emoji", EmojiSymbols;">
            <p>Hi,</p>
            <p><br>
            </p>
            <p>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:</p>
            <p><br>
            </p>
            <p><img naturalheight="372" naturalwidth="379" size="5762"
                id="img271117" tabindex="0" style="max-width: 99.9%;
                user-select: none;" class=""
                src="cid:part3.32F0D7A8.27DD6F5C@gmail.com"><br>
            </p>
            <p><br>
            </p>
            <p>If I use a ProportionalLayout, I can position the
              TextMorphs at the offsets <a
                class="moz-txt-link-abbreviated" href="mailto:0.5@0.25"
                moz-do-not-send="true">
                0.5@0.25</a> and <a class="moz-txt-link-abbreviated"
                href="mailto:0.5@0.75" moz-do-not-send="true">0.5@0.75</a>,
              but only with their upper left corner, so they will not
              really be centered.</p>
            <p>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.</p>
            <p>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.)</p>
            <p><br>
            </p>
            <p>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?</p>
            <p><br>
            </p>
            <p>Thanks in advance,</p>
            <p>Christoph</p>
            <div id="Signature">
              <div name="divtagdefaultwrapper"
                style="font-family:Calibri,Arial,Helvetica,sans-serif;
                font-size:; margin:0">
              </div>
            </div>
          </div>
          <br>
          <fieldset class="mimeAttachmentHeader"></fieldset>
          <pre class="moz-quote-pre" wrap="">_______________________________________________
Beginners mailing list
<a class="moz-txt-link-abbreviated" href="mailto:Beginners@lists.squeakfoundation.org" moz-do-not-send="true">Beginners@lists.squeakfoundation.org</a>
<a class="moz-txt-link-freetext" href="http://lists.squeakfoundation.org/mailman/listinfo/beginners" moz-do-not-send="true">http://lists.squeakfoundation.org/mailman/listinfo/beginners</a>
</pre>
        </blockquote>
        <br>
      </div>
    </blockquote>
    <br>
  </body>
</html>