Total Morphic newbie here - I am trying to build a simple app with two panes (BorderedRectangles), each pane contains a column of rows. Each row contains a String for a label and a TextMorph to contain data that I want to display and possibly edit.
Some of the TextMorphs contain long strings which cause the parent pane to expand out past the boundaries of the SystemWindow which contains it. I can't figure out how to limit the width of the row and let the height of the TextMorph vary based on the size of its contents.
Any suggestions?
jrm
From: John-Reed Maffeo Sent: Monday, September 5, 2016 3:49 PM
Total Morphic newbie here - I am trying to build a simple app with two panes (BorderedRectangles), each pane contains a column of rows. Each row contains a String for a label and a TextMorph to contain data that I want to display and possibly edit.
Some of the TextMorphs contain long strings which cause the parent pane to expand out past the boundaries of the SystemWindow which contains it. I can't figure out how to limit the width of the row and let the height of the TextMorph vary based on the size of its contents.
Any suggestions?
[Ron Teitelbaum] Hi John-Reed,
There are a number of method available to you on TextMorph. Browse TextMorph and press the instVars button. Select wrapFlag to see Accesses to that. In general the TextMorph has methods that should update the text to wrap the contents when you update or add text. You can also probably wrap the text manually (calling the wrap method yourself) as you add it depending on the width of the string you are adding. Also look for how to set the height of the row, and set that based on the results of the number of lines returned from the wrapping times the font height + some bounds between lines. It may do that already in some cases (not reading the code so not sure). In general you need some sort of compose method that looks for all the variables. The length of the string, the width of the column, the font size, and it should trim the strings based on width to rows (possibly in something like a paragraph), and set the height of the row to accommodate the string, and possibly add a scroll bar if it doesn’t fit. (remember to add the width of the scroll bar in your compose method). That method needs to be called whenever something changes, like when the component is resized or new text is added or removed.
I would think that there is already a method that does all this so start with the wrap flag method and see how others are doing the same thing.
Not sure if that is much help but you never know!
All the best,
Ron Teitelbaum
jrm
Hi John,
It might be better to separate the labels from the text morph. Each of your current panes would contain two morphs: a list morph with the labels and beside it a text pane with the text associated with the selected label. Text panes wrap text well, but list panes do not.
- Dan Norton
Ron / Dan, Thanks.
I have resolved the issue, by trying a lot of different, minor modifications to my methods; 59 versions of the most problematic one!
The answer to my question seems to be rooted in my choice of a #layoutPolicy: ( btw, what is the appropriate use of the # sign when talking about Smalltalk code?) and specifying the height of containing morph based on the height of the largest contained morph.
Comment to anyone reading this in search of information, be patient and confident of finding a solution. Keep searching for answers and asking questions.
---- begin createEditMorphFor: dataItem title: string "Use a standard definition of the data entry elements in the form. The changes I make here will propagate to all the items in the form and keep the calling method cleaner"
| container contents title | container := BorderedMorph new. container color: Color tan. container layoutPolicy: ProportionalLayout new. container borderColor: Color tan. container hResizing: #spaceFill; hResizing: #spaceFill. title := StringMorph contents: string. title emphasis: 1. contents :=TextMorph new contents: dataItem. contents wrapFlag: true. container height: contents height. container addMorph: title fullFrame:((LayoutFrame fractions: (0.0 @ 0.0 corner: 0.3@ 1))). ^ container addMorph: contents fullFrame:((LayoutFrame fractions: (0.3 @ 0.0 corner: 1.0 @ 1.0))). --- end
On Mon, Sep 5, 2016 at 5:58 PM, Dan Norton dnorton@mindspring.com wrote:
Hi John,
It might be better to separate the labels from the text morph. Each of your current panes would contain two morphs: a list morph with the labels and beside it a text pane with the text associated with the selected label. Text panes wrap text well, but list panes do not.
- Dan Norton
Beginners mailing list Beginners@lists.squeakfoundation.org http://lists.squeakfoundation.org/mailman/listinfo/beginners
From: John-Reed Maffeo Sent: Wednesday, September 7, 2016 10:37 PM
Ron / Dan, Thanks.
I have resolved the issue, by trying a lot of different, minor modifications to my methods; 59 versions of the most problematic one!
[Ron Teitelbaum] Excellent I’m glad you figured it out!
The answer to my question seems to be rooted in my choice of a #layoutPolicy: ( btw, what is the appropriate use of the # sign when talking about Smalltalk code?
[Ron Teitelbaum] # followed by some string literal indicates a symbol which are great for things like parameters (#spaceFill) which are easy to compare. In the context of discussing code in an email I will sometimes use #foo to indicate a method name but I’m also likely to use Object >> foo or anObject >> foo because of how the debugger shows messages. Had you not asked the question “my choice of a #layoutPolicy: “ was perfectly understandable.
) and specifying the height of containing morph based on the height of the largest contained morph.
Comment to anyone reading this in search of information, be patient and confident of finding a solution. Keep searching for answers and asking questions.
---- begin
createEditMorphFor: dataItem title: string
"Use a standard definition of the data entry elements in the form. The changes I make here will propagate to all the items in the form and keep the calling method cleaner"
| container contents title |
container := BorderedMorph new.
container color: Color tan.
container layoutPolicy: ProportionalLayout new.
container borderColor: Color tan.
container hResizing: #spaceFill; hResizing: #spaceFill.
title := StringMorph contents: string.
title emphasis: 1.
contents :=TextMorph new contents: dataItem.
contents wrapFlag: true.
container height: contents height.
container addMorph: title fullFrame:((LayoutFrame fractions: (0.0 @ 0.0 corner: 0.3@ 1))).
^ container addMorph: contents fullFrame:((LayoutFrame fractions: (0.3 @ 0.0 corner: 1.0 @ 1.0))).
--- end
On Mon, Sep 5, 2016 at 5:58 PM, Dan Norton dnorton@mindspring.com wrote:
Hi John,
It might be better to separate the labels from the text morph. Each of your current panes would contain two morphs: a list morph with the labels and beside it a text pane with the text associated with the selected label. Text panes wrap text well, but list panes do not.
- Dan Norton
_______________________________________________ Beginners mailing list Beginners@lists.squeakfoundation.org http://lists.squeakfoundation.org/mailman/listinfo/beginners
On 08/09/16 04:37, John-Reed Maffeo wrote:
The answer to my question seems to be rooted in my choice of a #layoutPolicy:...and specifying the height of containing morph based on the height of the largest contained morph.
Indeed. I've found it helpful to copy one of the complex layoutPolicies and strip it to do just what I needed. All those features make understanding difficult.
Stephan
beginners@lists.squeakfoundation.org
-
Dan Norton -
John-Reed Maffeo -
Ron Teitelbaum -
Stephan Eggermont