Page 1 of 1

Reordering the rows or lines in a list field

Posted: Mon May 28, 2018 12:42 pm
by Simon Knight
Hi,

I'm a little stuck!

For reasons that I won't go into I wish to use a list field to present a list of thumb nail images for the user to interact with. One action I am trying to implement is using the mouse to change the order of the rows by select, hold and drag then release.

To do this I believe that I need to identify the selected row then detect where the user wishes the selected row moved to. This last part is proving difficult. I am trying to use the mouseloc at the time of mouse release as a means of calculating which row is under the mouse when it is released. The calculation is fairly simple if the lines all have the same height but in my field they don't because the thumbnails vary in size. Does anyone know of a method of getting the row heights from a list field or a better method of determining the row under the mouse?

My next step is to obtain and store list of heights of the images displayed in each row of the field but I wonder if there is a simpler way.

Re: Reordering the rows or lines in a list field

Posted: Mon May 28, 2018 1:18 pm
by Simon Knight
Answering my own question - this shows promise but there may well be a better way.

Code: Select all

on mouseMove pNewMouseH, pNewMouseV
   put mouseCharChunk()   into tCharChunk
   put  "Line No. " & GetLineNumber (tCharChunk) into field "debug2" 
end mouseMove

Function GetLineNumber pCharChunk
   put word 2 of pCharChunk into tPosnFirstChar  -- a number
   put field "imageList" into tFieldText  -- the plain text from the field
   put 1 into tLineCounter  -- line counts start at one
   repeat with count = 1 to tPosnFirstChar
      if char count of tFieldText is cr then
         add one to tLineCounter
      end if
   end repeat
   return tLinecounter
end GetLineNumber

Re: Reordering the rows or lines in a list field

Posted: Mon May 28, 2018 1:28 pm
by Klaus
Hi Keith,

you can have that much shorter:

Code: Select all

on mouseMove
   put  "Line No. " & the lineindex of the mouseCharChunk into field "debug2"  
end mouseMove
:D


Best

Klaus

Re: Reordering the rows or lines in a list field

Posted: Mon May 28, 2018 2:28 pm
by Simon Knight
Thanks and also Doh!!! :roll:

Re: Reordering the rows or lines in a list field

Posted: Mon May 28, 2018 7:38 pm
by Simon Knight
I have managed to get to a stage where my list field is fit for others to see. I have attached a stack file, all the code is stored in the single field's object script. I have never tried stretching the "simple" controls before and am quite surprised how effective a list field can be.

Thanks to all who offered help here and to Scott Rossi who published an example list field with bells and whistles back in 2007. I have removed some of the functions that Scott included which simplifies my code and helps my understanding. I have probably added to many comments for most peoples taste but I know they will help me in six months/weeks/hours time when I come to read the scripts

My field is populated with image thumb nails and may be reordered by dragging a row to a new location.

The next step will be to enable text entry and editing.

Re: Reordering the rows or lines in a list field

Posted: Fri Jul 06, 2018 10:43 pm
by trinitylogics
Nice work Simon.

I like the idea of using a single field for some complex tasks.

Here is an example of a group list (using graphics as the list items for demo) where the drag and drop to reorder the list is implemented. Probably needs more comments, but maybe you will find it useful.
DragOrderList.livecode.zip
(5.93 KiB) Downloaded 292 times

Re: Reordering the rows or lines in a list field

Posted: Wed Jul 11, 2018 1:00 pm
by Simon Knight
Thanks for the example. I like the way the your list adjusts to provide space for the dragged item ready for a drop. I have had a quick look at your code and will have a more in depth look when I have more time. Even my quick look has taught me something as I had not thought of using a static array to provide access to variables without declaring them at the start of the code.

Another excellent example of what may be achieved using "simple" controls without having to use a datagrid. Thanks,

Simon K.

Re: Reordering the rows or lines in a list field

Posted: Fri Jul 01, 2022 3:14 pm
by marksmithhfx
Simon Knight wrote:
Mon May 28, 2018 7:38 pm
Thanks to all who offered help here and to Scott Rossi who published an example list field with bells and whistles back in 2007. I have removed some of the functions that Scott included which simplifies my code and helps my understanding. I have probably added to many comments for most peoples taste but I know they will help me in six months/weeks/hours time when I come to read the scripts

My field is populated with image thumb nails and may be reordered by dragging a row to a new location.
Thanks for posting this terrific example Simon. I dropped it into a project I was working on and it worked perfectly (after a few tweaks to make it more closely fit the style I was looking for). One problem I did run into is that when built it causes macOS to pop-up an alert asking for permission to "copy the screen". This is probably a fairly recent addition to the OS. Following some advice from Mark Waddington, I eliminated the section titled "convert from screen to window coordinates - using globalLoc" and added "of me" to the export snapshot command and between the two of them (I did not test them separately) this got rid of the permissions pop-up dialog.

The sections I modified are in the handler "buildImageToDrag"

Hope this is useful to anyone else who might be interested in using your code.

best,
Mark

Re: Reordering the rows or lines in a list field

Posted: Fri Jul 01, 2022 5:34 pm
by Klaus
Hi Mark,

I usually (mis-)use a datagrid with the new features to provide a "text list" to the user that can be reordered by dragging.
All build-in nowadays, please check this lesson, which got me started:
https://lessons.livecode.com/m/datagrid ... -data-grid

Best

Klaus

Re: Reordering the rows or lines in a list field

Posted: Fri Jul 01, 2022 5:37 pm
by marksmithhfx
Klaus wrote:
Fri Jul 01, 2022 5:34 pm
I usually (mis-)use a datagrid with the new features to provide a "text list" to the user that can be reordered by dragging.
All build-in nowadays, please check this lesson, which got me started:
https://lessons.livecode.com/m/datagrid ... -data-grid
Good suggestion Klaus, thanks
Mark