PolyList and variable itemHeight to fit text in an item

[tomsve]

I'm trying to use itemPointer to change the itemHeight of an individual item in the PolyList, so it can fit the text in it (they all have a text . However, it seems to change all of the items in the list, not the individual item.

This is the code I use for testing.

Code: Select all

   set the itemPointer of widget "plList" to 1
   set the itemHeight of widget "plList" to 100

Is it even possible? Any ideas?

Thanks and regards.

[SWEdeAndy]

Is it even possible?

No, unfortunately not, as far as I know. The PolyList and PolyGrid don't have variable item/row height yet. I think there's an enhancement request in for that. You'll have to use the good old datagrid to get variable row height.

[stam]

Is it even possible?

No, unfortunately not, as far as I know. The PolyList and PolyGrid don't have variable item/row height yet. I think there's an enhancement request in for that. You'll have to use the good old datagrid to get variable row height.

There is much that the venerable DataGrid2 does much better than the newcomers - I just wish it was better encapsulated like PoyList and PolyGrid are, and had the clever multi-column facility of PolyList.

[bn]

Hi Tom,

If all you want is to fit more text into e.g. the top item then you can tweak the Polygrid to show more text without changing the overall appearence too much.

Assume you drag out a new Polylist in the IDE (I am using 9.6.9) and you want to change text in "Title" to accomodate more text than currently fits.
You could change "Title" to multiline and change its height and position.
This affects all items of the polygrid but barely shows.

Use this script to apply the necessary changes(I did not find an easier way)

Code: Select all

on mouseUp
   local tDataLayoutA, tItemContentA
   
   ## change top text item "Title" of standard widget "Polylist" as in IDE (9.6.9)
   
   put the dataLayout of widget 1 into tDataLayoutA
   put 0 into tDataLayoutA[2]["top"]
   put 60 into tDataLayoutA[2]["height"]
   put "text-multiline" into tDataLayoutA[2]["content-type"]
   set the dataLayout of widget 1 to tDataLayoutA
   
   ## change text of first item and set text of "Title"
   set the itemPointer of widget"PolyList" to 1
   put the itemContent of widget"PolyList" into tItemContentA
   
   put "New content" & cr & "new line is much longer than fits" into tItemContentA["title"] ## with cr
   -- put "New content new line is much longer than fits" into tItemContentA["title"] ## auto wrap
   set the itemContent of widget"PolyList" to tItemContentA
   
   ## increase itemHeight slightly to make room for multiline text
   set the itemHeight of widget"PolyList" to 50
end mouseUp

It looks a bit intimidating but that seems to work for small tweaks. (DataGrid is also not the easiest to tweak)

But maybe that is not what you are after then it was a nice exercise in configuring a Polygrid.

Kind regards
Bernd

[bn]

Hi Tom,

I had a look at the Polygrid using the Properties Inspector. You can set all the paramters I've set via script manually using the Properties Inspector.

Kind regards
Bernd

[marksmithhfx]

that. You'll have to use the good old datagrid to get variable row height.

Andreas, do you happen to know of a code example that demonstrates how to get variable row height in the data grid? I've been wanting to add that to my Organize app for eons but just didn't know it was possible.

Thanks
Mark

[SWEdeAndy]

Andreas, do you happen to know of a code example that demonstrates how to get variable row height in the data grid? I've been wanting to add that to my Organize app for eons but just didn't know it was possible.

I seem to remember using a LiveCode lesson on how to make a messenger-type app as a basis, when I needed to make a messenger-type feature once, but I can't find that one now.

But I found this one that might even better suit your needs:
https://lessons.livecode.com/m/datagrid ... ne-heights
(how-do-i-create-a-form-with-variable-line-heights)

[marksmithhfx]

But I found this one that might even better suit your needs:
https://lessons.livecode.com/m/datagrid ... ne-heights
(how-do-i-create-a-form-with-variable-line-heights)

Thanks Andreas for reminding me about this one I posted about it in the message section of the lesson back in 2020 but never got around to trying it... where does the time fly? (However my procrastination may have a benefit as Elanor added a modification in 2021 which she said may make the process clearer. I hope!!)

Cheers,
Mark

[cealansmith]

It looks like using DataGrid might be the best solution for achieving variable row heights. The example provided by Andreas on how to create a form with variable line heights could be quite useful. Has anyone tried this approach recently? Does it work well for dynamically adjusting item heights based on content?

[Klaus]

DO NOT DELETE THE POST ABOVE YET!
Heather needs to take a look first!

[bobcole]

In a DataGrid, creating a field with variable height is fairly easy if you have an example to follow.
The following assumes you have a DataGrid already and just want to make a field to have variable height.

Using the Pointer tool, double click on the DataGrid to bring up the Property Inspector.
Click on the second icon (Data Grid) and then click on the button "Edit Script" of the Row Behavior.
In the code, you will see the LayoutControl handler. The LayoutControl handler is what you need to modify.

I took this code from somewhere else, I don't remember where.
Here is the LayoutControl from my app which has words (in item 1) and their definitions (in item 3).
The field "Definition" is the field I want to have as a variable height.
The constants (+6, -5, etc.) may have to adjusted for your app.

Code: Select all

	
on LayoutControl pControlRect, pWorkingRect
   local theFieldRect
      
   ## Expand the field to fill the available width
   put the rect of field "Definition" of me into theFieldRect
   put item 3 of pControlRect - 5 into item 3 of theFieldRect
   set the rect of field "Definition" of me to theFieldRect
   
   ## Now resize the field to fit its content
   put item 2 of theFieldRect \
         + the formattedheight of field "Definition" of me + 6 \
         - the bottommargin of field "Definition" of me \
         into item 4 of theFieldRect
   set the rect of field "Definition" of me to theFieldRect
   
   ## Now update the bounding rect to match total the height 
   ## you want this row to have (note there is an additional 4 
   ## pixels added to the bottom
   put item 4 of theFieldRect + 4 into item 4 of pControlRect
   
   set the rect of graphic "Background" of me to pControlRect 
end LayoutControl

That is it; it works. Let me know if it doesn't work for you.
Bob