
<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<style type="text/css" style="display:none;"><!-- P {margin-top:0;margin-bottom:0;} --></style>

</head>

<body dir="ltr">

<div id="divtagdefaultwrapper" style="font-size:12pt;color:#000000;font-family:Calibri,Helvetica,sans-serif;" dir="ltr">

<p>Hi all,</p>

<p><br>

</p>

<p>does Morphic has an equivalent of JavaScript's 'display: none'?</p>

<p><span style="font-size: 12pt;">#show/#hide/#visible: reserve space for the hidden morph. However, there are other scenarios where you do not want to reserve space. (A simple example would be a list that should only appear iff it has items.)</span><br>

</p>

<p>In JS, you can use 'display: none' instead of 'visibility: hidden' to give the space back to the element's remaining siblings.</p>

<p>But in Morphic, is there currently any better option than #delete (and #addMorph:) later?</p>

<p><br>

</p>

<p>(IMO, delete'n'add is not always the best pattern to do this. You need to remember the index and owner of the relevant morph for adding it later.)</p>

<p><br>

</p>

<p>Provided that I did not overlook any existing features, would you consider this a useful extension for Morphic?</p>

<p>I was thinking of a property (#skipLayout, if you do not have any better idea) and a convenience method (#nonSkippedSubmorphs) that rejects suppressed submorphs. TableLayout would need to use this selector instead of regular #submorphs.</p>

<p>Or would this break too many existing things that rely on #submorphs?</p>

<p><br>

</p>

<p>Another approach would be a selector in the TableLayoutProperties to have all submorphs skipped that are hidden via classical #visible. But this would be less powerful as you couldn't combine both kinds of hiding in the same morph. But maybe this would be

 even better in terms of avoiding complexity?</p>

<p><br>

</p>

<p>I'm looking forward to your opinions.</p>

<p><br>

</p>

<p>Best,</p>

<p>Christoph</p>

<div id="Signature">

<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;">

<div name="divtagdefaultwrapper" style="font-family:Calibri,Arial,Helvetica,sans-serif; font-size:; margin:0">

<div><font size="2" color="#808080"></font></div>

</div>

</div>

</div>

</div>

</body>

</html>