[Pharo-project] Making layouts using anchors

Fernando Olivero fernando.olivero at usi.ch
Fri Apr 8 09:41:40 CEST 2011


In the current LayoutPolicy scheme there's no knowledge between the
brothers, for the anchors this would present a potential problem.

What about moving this dependency to the parent, which knows all the
morphs, instead of introducing this knowledge in the brothers?

In your example:
window anchorMorph: morph at: left
window anchorMorph: morph2 rightTo: morph.

Then  it would be transparent to the current LayoutPolicy scheme, and
IMO the responsibilities are better distributed.
Eliminating the knowledge between brothers greatly simplifies the UI framework.

Fernando

On Fri, Apr 8, 2011 at 9:13 AM, Igor Stasenko <siguctua at gmail.com> wrote:
> On 8 April 2011 08:51, Fernando Olivero <fernando.olivero at usi.ch> wrote:
>> The idea is simple yet powerful, i'm favor.
>> Can they be somehow integrated into the current layout mechanism?
>> LayoutPolicy subclass: #AnchorPolicy
>> Then they are just another option, and the merge could be transparent.
>> I could add them in the context of SMx.
>> Fernando
>>
>
> I don't think so. The layout policies usually is about positioning submorphs
> while anchors is about placing the morph itself.
> You can, actually, maintain layout policy by setting anchors to submorphs.
>
>> On Thu, Apr 7, 2011 at 8:45 PM, Igor Stasenko <siguctua at gmail.com> wrote:
>>> Hi,
>>>
>>> i hacked morphs a bit to use anchors for laying out the morphs.
>>>
>>> The idea that you can force morph to make one of its edges (left, top,
>>> bottom, right)
>>> be dependent from other morph's edge.
>>>
>>> Here an example:
>>>
>>> | window morph morph2 |
>>>
>>> window := StandardWindow labelled: 'foo'.
>>> window color: Color red.
>>> morph := Morph new.
>>>
>>> morph anchorLeft: window leftAnchor + (window widthAnchor * 0.5) - 20.
>>> morph anchorRight: window leftAnchor + (window widthAnchor * 0.5) + 20.
>>> morph anchorTop: window topAnchor + 20.
>>> morph anchorBottom: window bottomAnchor - 20.
>>>
>>> morph2 := Morph new.
>>> morph2 color: Color green.
>>>
>>> morph2 anchorLeft: morph rightAnchor + 10.
>>> morph2 anchorRight: morph rightAnchor + 50.
>>> morph2 anchorTop: window topAnchor + 20.
>>> morph2 anchorBottom: window bottomAnchor - 20.
>>>
>>> window addMorph: morph2.
>>> window addMorph: morph.
>>>
>>> window openInWorld.
>>>
>>> window extent: 200 at 200.
>>>
>>>
>>> You can of course implement same layout using proportional layouts
>>> i.e. you can do
>>>
>>> window addMorph: fullFrame: ...
>>>
>>> but note that while its okay for first morph you add , a morph2 left
>>> edge is actually depending on first morph right edge.
>>> So, if it will be resized by other means (like stretched by inner
>>> morph), you won't be able to align sibling accordingly,
>>> and then you are forced to use table layout or something else.
>>>
>>> What i like about anchors that it reflects the natural way of thinking
>>> of UI designer i.e. : "I want this morph to align to window right
>>> edge"
>>> or "I want this morph to align to previous morph right edge with 10
>>> pixels offset"
>>>
>>> For example, if i have two morphs, left and right, and i want to put
>>> my morph in the middle of them to fill the space between them,
>>> i can simply do:
>>>
>>> middle := Morph new.
>>>
>>> middle anchorLeft: leftMorph rightAnchor + 10.
>>> middle anchorRight: rightMorph leftAnchor - 10.
>>>
>>> so, you will get a following layout:
>>>
>>> [leftMorph] [ 10 pixels ] [ ... middle morph ..... ] [ 10 pixels ]
>>> [right morph ]
>>>
>>> with just two lines of code!
>>>
>>> P.S. Of course , anchors are in conflict with layouts, because you
>>> cannot have both. But some combination of them could still be used.
>>>
>>> --
>>> Best regards,
>>> Igor Stasenko AKA sig.
>>>
>>
>>
>
>
>
> --
> Best regards,
> Igor Stasenko AKA sig.
>



More information about the Pharo-project mailing list