Drag and Drop Feature

Got a LiveCode personal license? Are you a beginner, hobbyist or educator that's new to LiveCode? This forum is the place to go for help getting started. Welcome!

Moderators: Klaus, FourthWorld, heatherlaine, kevinmiller

Einherjar
Posts: 18
Joined: Thu Dec 12, 2013 7:38 pm

Drag and Drop Feature

Post by Einherjar » Fri Dec 13, 2013 9:08 am

Hi guys,

I'm working on a fantasy football application and I have a few questions (i'm completely new to LiveCode).

I'm looking for a drag and drop feature taking information from a Datagrid and transfering it to say a block on the left hand side.

Is it possible to display the information of the selected item on or around the square itself with appropriate formatting?

Additionally, I'd like to know how Datagrid items work and are they objects themselves which can act dynamically (such as give data to selected object)?

I apologize for being vague.

Thanks in advance.

If you google DraftKings (I can't post links or pictures) you should be able to see a sample of the team selection process, GUI and it should explain what I'm after.

Einherjar
Posts: 18
Joined: Thu Dec 12, 2013 7:38 pm

Re: Drag and Drop Feature

Post by Einherjar » Fri Dec 13, 2013 10:26 am

So, i've been searching and this: "7313-how-do-i-get-data-associated-with-a-row-or-column" looks like a winner.

Can someone confirm this?

MaxV
Posts: 1576
Joined: Tue May 28, 2013 2:20 pm
Location: Italy
Contact:

Re: Drag and Drop Feature

Post by MaxV » Fri Dec 13, 2013 11:25 am

Drag and drop can be activated with:

Code: Select all

on mouseDown
  grab me
end mouseDown
or

Code: Select all

on mousemove X,Y
  set the loc of me to X,256     
end mousemove
If you need to limit movement to X or Y or whatever.
The problem is how to add it to a datagrid. I suppose that it's better to create a behavior that clicking on a datagrid element you create a new one button with grab me.
Livecode Wiki: http://livecode.wikia.com
My blog: https://livecode-blogger.blogspot.com
To post code use this: http://tinyurl.com/ogp6d5w

Einherjar
Posts: 18
Joined: Thu Dec 12, 2013 7:38 pm

Re: Drag and Drop Feature

Post by Einherjar » Fri Dec 13, 2013 11:39 am

Will the GrabMe take the relevant id of the data selected and transfer the values on to the target object?

MaxV
Posts: 1576
Joined: Tue May 28, 2013 2:20 pm
Location: Italy
Contact:

Re: Drag and Drop Feature

Post by MaxV » Fri Dec 13, 2013 12:51 pm

No, grab me just make the element "draggable and droppable", you have to add all the data needed in the behaviour.
Fisrt of all add the customproperty defscript in the card like:

Code: Select all

On MouseDown
 gab me
end Mousedown

on mousemove X,Y
  #check if we are in the releasing zone
  if X is < 50 and Y < 50 then
    #release the grabbed data stored in the allRelevantInformation of me
 end if
end mousemove

On MouseUp
  delete me
end MouseUp

then the datagrid behaviour could be something similar to:

Code: Select all

create button "tempbutton"
set the allRelevantInformation of button "tempbutton" to id,data #it's just an example
set the script of button "tempButton" to the defscript of this card

Livecode Wiki: http://livecode.wikia.com
My blog: https://livecode-blogger.blogspot.com
To post code use this: http://tinyurl.com/ogp6d5w

Klaus
Posts: 11825
Joined: Sat Apr 08, 2006 8:41 am
Location: Germany
Contact:

Re: Drag and Drop Feature

Post by Klaus » Fri Dec 13, 2013 2:31 pm

Hi Einherjar,

well "grab me" is a way to let the user grab and move an object, but "Drag'n'Drop" is something else 8)
We have a lot of "drag..." related messages that can do the job better.

But explaining how this and datagrids in general work, is just too much to write here, sorry.
If you have specific questions, OK :D


Best

Klaus

Einherjar
Posts: 18
Joined: Thu Dec 12, 2013 7:38 pm

Re: Drag and Drop Feature

Post by Einherjar » Fri Dec 13, 2013 3:10 pm

MaxV wrote:

Code: Select all

On MouseDown
 gab me
end Mousedown

[b]on mousemove X,Y
  #check if we are in the releasing zone
  if X is < 50 and Y < 50 then
    #release the grabbed data stored in the allRelevantInformation of me
 end if
end mousemove[/b]

On MouseUp
  delete me
end MouseUp

So if I have a square for example at X,Y location then I need to input each of these details into the #check to allow it to be placed at each different location?

I have a football team layout, so there will be 11 'slots' to choose from. I need to make sure that the user selects which 'position' to place playerA into.

Klaus
Posts: 11825
Joined: Sat Apr 08, 2006 8:41 am
Location: Germany
Contact:

Re: Drag and Drop Feature

Post by Klaus » Fri Dec 13, 2013 4:13 pm

Hi Einherjar,

could you please describe what you are trying to do?

1. You want to le the user DRAG one (or more?) line(s) from a datagrid....
Is that correct so far?

2. ... then you want ot let the user DROP the "dragged" info onto WHAT?
Hint: A "block" is no valid Livecode object :D
So what info will be displayed on DROP and HOW should it look like?


Best

Klaus

dunbarx
VIP Livecode Opensource Backer
VIP Livecode Opensource Backer
Posts: 6707
Joined: Wed May 06, 2009 2:28 pm
Location: New York, NY

Re: Drag and Drop Feature

Post by dunbarx » Fri Dec 13, 2013 4:32 pm

Klaus.

A "block" must be a field.

Einherjar.

Note that if you drag text from the datagrid to a field, or from any one place to any other, you actually extract that data from the source into the target. Is that what you want to do? Or do you merely want to copy the data from the source to the target?

Craig Newman

Einherjar
Posts: 18
Joined: Thu Dec 12, 2013 7:38 pm

Re: Drag and Drop Feature

Post by Einherjar » Fri Dec 13, 2013 5:21 pm

I'm creating a fantasy football application of you are aware of the concept. Players are selected from all teams in the league to create the best team for that week. For selection, I'd like to have a drag and drop system where you can select your players and place them where appropriate. Goal keepers in the goal keeping position for example. I'd also be happy with working out how to add a button besides their name to add them to your team. I'm using a data grid at the moment which I think suffices but I'm a bit stuck on where exactly to place the player and then display their basic data.

One player selection at a time is what I want.

If I can add a 'add player to team' button besides the selection data grid then that's also acceptable.

For reference, as I can't add url's, please Google draft Kings and then select images.

Thank you.

MaxV
Posts: 1576
Joined: Tue May 28, 2013 2:20 pm
Location: Italy
Contact:

Re: Drag and Drop Feature

Post by MaxV » Fri Dec 13, 2013 5:32 pm

Einherjar wrote: So if I have a square for example at X,Y location then I need to input each of these details into the #check to allow it to be placed at each different location?

I have a football team layout, so there will be 11 'slots' to choose from. I need to make sure that the user selects which 'position' to place playerA into.
Yes, exactly.
Livecode Wiki: http://livecode.wikia.com
My blog: https://livecode-blogger.blogspot.com
To post code use this: http://tinyurl.com/ogp6d5w

Einherjar
Posts: 18
Joined: Thu Dec 12, 2013 7:38 pm

Re: Drag and Drop Feature

Post by Einherjar » Fri Dec 13, 2013 5:36 pm

If I were to limit the formation or player limit to one goal keeper, 4 defenders, 4 midfielders and two attackers and the selection system was by a button (rather than drag and drop) I think this is also possible - any ideas?

Klaus
Posts: 11825
Joined: Sat Apr 08, 2006 8:41 am
Location: Germany
Contact:

Re: Drag and Drop Feature

Post by Klaus » Sat Dec 14, 2013 1:49 pm

Hi Einherjar,

there are many, many, many ways to do this in Livecode, even from a datagrid.
But you will have to decide HOW your interface should look, then we can
provide a working solution! 8)

Specivo:
From WHERE should the user start the DRAGging and WHERE is the user supposed
to DROP the dragged info?

Hint:
We can DRAG from EVERYWHERE and can DROP that also on EVERYTHING :D


Best

Klaus

Einherjar
Posts: 18
Joined: Thu Dec 12, 2013 7:38 pm

Re: Drag and Drop Feature

Post by Einherjar » Wed Dec 18, 2013 9:31 pm

Hi guys,

I'd like the simplest way to select a 'player' from the data grid I currently have and for it to transfer it's basic details over to a 'box' object on the left hand side.

This type of player selection is crucial to my project at this early stage. Around 5 pieces of Data is all that will be needed currently.

Is there anyway of making a DataGrid show only certain parts of the 'player' data?

Klaus
Posts: 11825
Joined: Sat Apr 08, 2006 8:41 am
Location: Germany
Contact:

Re: Drag and Drop Feature

Post by Klaus » Thu Dec 19, 2013 4:50 pm

Hi Einherjar,

I created a little stack for you!
You will notice that I have no idea about "Fussball" (soccer), just a faint memory of
the names of some of its german heroes :D

Hint:
Please get used to the Liveocde terminology***, so we will be able to better understand
whart you mean and what you want to achieve!

*** I may repeat mayself, but there is still no BOX object in Livecode, so I used a FIELD
in my example stack 8)


Best

Klaus
Attachments
drag_drop_from_datagrid.livecode.zip
(5.9 KiB) Downloaded 102 times

Post Reply

Return to “Getting Started with LiveCode - Complete Beginners”