Robust way to fit RTBox around variable text

Previous Topic Next Topic
 
classic Classic list List threaded Threaded
4 messages Options
Reply | Threaded
Open this post in threaded view
|

Robust way to fit RTBox around variable text

Fuhrmanator
Hello, 

I'd like to visualize a graph where the nodes are boxes and they have text inside. The boxes should grow or shrink horizontally so the text doesn't go outside the box.

I saw the answer at http://forum.world.st/Roassal2-Label-width-td4847887.html which led me to a solution. However, I've commented the "not robust" part below, since it's passing by "lbl" which I suspect could change.

~~~~~~~~~~~~~~~~
| b label el | 

b := RTView new.
el :=  RTBox new elementOn: 'hello world'.
label := RTLabeled new center.
b add: el.

el @ label.
"not robust"
el width: label lbl width.
el height: label lbl height.

b
~~~~~~~~~~~~~~~~~~~~~~
Inline image 1

I found the unit tests for RTLabel (RTLabelTest) and I found another solution, but maybe it's equally fragile?

~~~~~~~~~~~~~~~~~~~~~~~~~
| text b lblBox lblForCalc dummyElement |

text := 'Text inside the box'.

b := RTView new.

lblBox := (RTBox new elementOn: text) + RTLabel.
lblForCalc := RTLabel new text: text.

dummyElement := RTElement new.
lblBox height: (lblForCalc heightFor: dummyElement).
lblBox width: (lblForCalc widthFor: dummyElement).

b add: lblBox.

b
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Inline image 2

I'd love to get some feedback on these approaches. Maybe there's a simpler robust way? Thanks!

_______________________________________________
Moose-dev mailing list
[hidden email]
https://www.list.inf.unibe.ch/listinfo/moose-dev
Reply | Threaded
Open this post in threaded view
|

Re: Robust way to fit RTBox around variable text

abergel
Hi Cris,

You are right. The examples you provide are a bit hacky. The standard way in Roassal is to use composite shapes.

Try this:
-=-=-=-=-=-=-=-=-=-=-=-=
v := RTView new.

boxShape := RTBox new color: Color veryLightGray.
labelShape := RTLabel new text: #name.
composite := RTCompositeShape new.
composite add: boxShape.
composite add: labelShape.
composite allOfSameSizeWithPadding.

elements := composite elementsOn: (Collection withAllSubclasses copyFrom: 1 to: 5).
v addAll: elements.

elements when: TRMouseClick do: [ :evt | 
evt element model: Collection withAllSubclasses atRandom.
evt element update.
RTGridLayout on: elements. ].

RTGridLayout on: elements.
-=-=-=-=-=-=-=-=-=-=-=-=

The code I provide defines a callback that changes the label. You can see how to adapt it.

Let us know how it goes.

Cheers,
Alexandre


On Sep 15, 2016, at 12:10 PM, Cris Fuhrman <[hidden email]> wrote:

Hello, 

I'd like to visualize a graph where the nodes are boxes and they have text inside. The boxes should grow or shrink horizontally so the text doesn't go outside the box.

I saw the answer at http://forum.world.st/Roassal2-Label-width-td4847887.html which led me to a solution. However, I've commented the "not robust" part below, since it's passing by "lbl" which I suspect could change.

~~~~~~~~~~~~~~~~
| b label el | 

b := RTView new.
el :=  RTBox new elementOn: 'hello world'.
label := RTLabeled new center.
b add: el.

el @ label.
"not robust"
el width: label lbl width.
el height: label lbl height.

b
~~~~~~~~~~~~~~~~~~~~~~
<image.png>

I found the unit tests for RTLabel (RTLabelTest) and I found another solution, but maybe it's equally fragile?

~~~~~~~~~~~~~~~~~~~~~~~~~
| text b lblBox lblForCalc dummyElement |

text := 'Text inside the box'.

b := RTView new.

lblBox := (RTBox new elementOn: text) + RTLabel.
lblForCalc := RTLabel new text: text.

dummyElement := RTElement new.
lblBox height: (lblForCalc heightFor: dummyElement).
lblBox width: (lblForCalc widthFor: dummyElement).

b add: lblBox.

b
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
<image.png>

I'd love to get some feedback on these approaches. Maybe there's a simpler robust way? Thanks!
_______________________________________________
Moose-dev mailing list
[hidden email]
https://www.list.inf.unibe.ch/listinfo/moose-dev


_______________________________________________
Moose-dev mailing list
[hidden email]
https://www.list.inf.unibe.ch/listinfo/moose-dev
Reply | Threaded
Open this post in threaded view
|

Re: Robust way to fit RTBox around variable text

Fuhrmanator
Indeed, much cleaner. 

Your code also made it clear to me that I was wrongly making a new shape each time I added an element to the view (I'm guessing this makes a big deal in some of my bigger models). 

Here's what I came up with in my context:

~~~~~~~~~~~~~~~~~~~~~
| v boxedTextShape boxedTextElement classA classB |

classA := FAMIXType new name:'Façade'.
classB := FAMIXType new name:'BridgeOfSighs'.
v := RTView new.

boxedTextShape := RTCompositeShape new.
boxedTextShape add: (RTBox new color: Color blue). 
boxedTextShape add: (RTLabel new text:#name; color: Color white).
boxedTextShape allOfSameSizeWithPadding.

boxedTextElement := boxedTextShape elementOn: classA.
boxedTextElement @ RTDraggable.
v add: boxedTextElement.

boxedTextElement := boxedTextShape elementOn: classB.
boxedTextElement @ RTDraggable.
v add: boxedTextElement.

RTGridLayout on: v elements.

v
~~~~~~~~~~~~~~~~~~~~~~~~



On Thu, Sep 15, 2016 at 11:39 AM, Alexandre Bergel <[hidden email]> wrote:
Hi Cris,

You are right. The examples you provide are a bit hacky. The standard way in Roassal is to use composite shapes.

Try this:
-=-=-=-=-=-=-=-=-=-=-=-=
v := RTView new.

boxShape := RTBox new color: Color veryLightGray.
labelShape := RTLabel new text: #name.
composite := RTCompositeShape new.
composite add: boxShape.
composite add: labelShape.
composite allOfSameSizeWithPadding.

elements := composite elementsOn: (Collection withAllSubclasses copyFrom: 1 to: 5).
v addAll: elements.

elements when: TRMouseClick do: [ :evt | 
evt element model: Collection withAllSubclasses atRandom.
evt element update.
RTGridLayout on: elements. ].

RTGridLayout on: elements.
-=-=-=-=-=-=-=-=-=-=-=-=

The code I provide defines a callback that changes the label. You can see how to adapt it.

Let us know how it goes.

Cheers,
Alexandre


On Sep 15, 2016, at 12:10 PM, Cris Fuhrman <[hidden email]> wrote:

Hello, 

I'd like to visualize a graph where the nodes are boxes and they have text inside. The boxes should grow or shrink horizontally so the text doesn't go outside the box.

I saw the answer at http://forum.world.st/Roassal2-Label-width-td4847887.html which led me to a solution. However, I've commented the "not robust" part below, since it's passing by "lbl" which I suspect could change.

~~~~~~~~~~~~~~~~
| b label el | 

b := RTView new.
el :=  RTBox new elementOn: 'hello world'.
label := RTLabeled new center.
b add: el.

el @ label.
"not robust"
el width: label lbl width.
el height: label lbl height.

b
~~~~~~~~~~~~~~~~~~~~~~
<image.png>

I found the unit tests for RTLabel (RTLabelTest) and I found another solution, but maybe it's equally fragile?

~~~~~~~~~~~~~~~~~~~~~~~~~
| text b lblBox lblForCalc dummyElement |

text := 'Text inside the box'.

b := RTView new.

lblBox := (RTBox new elementOn: text) + RTLabel.
lblForCalc := RTLabel new text: text.

dummyElement := RTElement new.
lblBox height: (lblForCalc heightFor: dummyElement).
lblBox width: (lblForCalc widthFor: dummyElement).

b add: lblBox.

b
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
<image.png>

I'd love to get some feedback on these approaches. Maybe there's a simpler robust way? Thanks!
_______________________________________________
Moose-dev mailing list
[hidden email]
https://www.list.inf.unibe.ch/listinfo/moose-dev


_______________________________________________
Moose-dev mailing list
[hidden email]
https://www.list.inf.unibe.ch/listinfo/moose-dev



_______________________________________________
Moose-dev mailing list
[hidden email]
https://www.list.inf.unibe.ch/listinfo/moose-dev
Reply | Threaded
Open this post in threaded view
|

Re: Robust way to fit RTBox around variable text

abergel
Yes!

Alexandre


On Sep 15, 2016, at 5:16 PM, Cris Fuhrman <[hidden email]> wrote:

Indeed, much cleaner. 

Your code also made it clear to me that I was wrongly making a new shape each time I added an element to the view (I'm guessing this makes a big deal in some of my bigger models). 

Here's what I came up with in my context:

~~~~~~~~~~~~~~~~~~~~~
| v boxedTextShape boxedTextElement classA classB |

classA := FAMIXType new name:'Façade'.
classB := FAMIXType new name:'BridgeOfSighs'.
v := RTView new.

boxedTextShape := RTCompositeShape new.
boxedTextShape add: (RTBox new color: Color blue). 
boxedTextShape add: (RTLabel new text:#name; color: Color white).
boxedTextShape allOfSameSizeWithPadding.

boxedTextElement := boxedTextShape elementOn: classA.
boxedTextElement @ RTDraggable.
v add: boxedTextElement.

boxedTextElement := boxedTextShape elementOn: classB.
boxedTextElement @ RTDraggable.
v add: boxedTextElement.

RTGridLayout on: v elements.

v
~~~~~~~~~~~~~~~~~~~~~~~~



On Thu, Sep 15, 2016 at 11:39 AM, Alexandre Bergel <[hidden email]> wrote:
Hi Cris,

You are right. The examples you provide are a bit hacky. The standard way in Roassal is to use composite shapes.

Try this:
-=-=-=-=-=-=-=-=-=-=-=-=
v := RTView new.

boxShape := RTBox new color: Color veryLightGray.
labelShape := RTLabel new text: #name.
composite := RTCompositeShape new.
composite add: boxShape.
composite add: labelShape.
composite allOfSameSizeWithPadding.

elements := composite elementsOn: (Collection withAllSubclasses copyFrom: 1 to: 5).
v addAll: elements.

elements when: TRMouseClick do: [ :evt | 
evt element model: Collection withAllSubclasses atRandom.
evt element update.
RTGridLayout on: elements. ].

RTGridLayout on: elements.
-=-=-=-=-=-=-=-=-=-=-=-=

The code I provide defines a callback that changes the label. You can see how to adapt it.

Let us know how it goes.

Cheers,
Alexandre


On Sep 15, 2016, at 12:10 PM, Cris Fuhrman <[hidden email]> wrote:

Hello, 

I'd like to visualize a graph where the nodes are boxes and they have text inside. The boxes should grow or shrink horizontally so the text doesn't go outside the box.

I saw the answer at http://forum.world.st/Roassal2-Label-width-td4847887.html which led me to a solution. However, I've commented the "not robust" part below, since it's passing by "lbl" which I suspect could change.

~~~~~~~~~~~~~~~~
| b label el | 

b := RTView new.
el :=  RTBox new elementOn: 'hello world'.
label := RTLabeled new center.
b add: el.

el @ label.
"not robust"
el width: label lbl width.
el height: label lbl height.

b
~~~~~~~~~~~~~~~~~~~~~~
<image.png>

I found the unit tests for RTLabel (RTLabelTest) and I found another solution, but maybe it's equally fragile?

~~~~~~~~~~~~~~~~~~~~~~~~~
| text b lblBox lblForCalc dummyElement |

text := 'Text inside the box'.

b := RTView new.

lblBox := (RTBox new elementOn: text) + RTLabel.
lblForCalc := RTLabel new text: text.

dummyElement := RTElement new.
lblBox height: (lblForCalc heightFor: dummyElement).
lblBox width: (lblForCalc widthFor: dummyElement).

b add: lblBox.

b
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
<image.png>

I'd love to get some feedback on these approaches. Maybe there's a simpler robust way? Thanks!
_______________________________________________
Moose-dev mailing list
[hidden email]
https://www.list.inf.unibe.ch/listinfo/moose-dev


_______________________________________________
Moose-dev mailing list
[hidden email]
https://www.list.inf.unibe.ch/listinfo/moose-dev


_______________________________________________
Moose-dev mailing list
[hidden email]
https://www.list.inf.unibe.ch/listinfo/moose-dev


_______________________________________________
Moose-dev mailing list
[hidden email]
https://www.list.inf.unibe.ch/listinfo/moose-dev