Picture changes as you drag it.

May 15, 2012

As I make mostly software simulations at the moment i would love to know this is possible but realise it is a bit unrealistic.

Is it possible to make a picture change state, from the time you select it, to then drag it, to then place it.

To make this clearer, think of when you drag and drop a file into another folder. You select the item and then when you drag it, it turns into a circle with a line through it, then when you reach a spot you can place the file it turns into a plus sign.

At the moment I am trying to solve the first step by placing a picture of a circle with a diagonal line through it behind the item that is supposed to be selected and dragged. However when I test it you can't select the circle because it is behind something (pretty obvious problem). can I make an item click-through-able? and yes I am inventing new words.

All ideas welcome - Thanks

13 Replies
James Brandwood

Thanks Phil,

I have managed to get to the same stage as you with the shape changing state when you first move it and then again when it reaches the drop area. I have managed to simulate dragging and dropping emails with all the correct icons. 

This is probably good enough for what I want but the perfectionist in me is still working on it because when you drop the shape in the wrong place it goes back to it's orginal location but doesn't change back to it's default state (in your case a square) it stays as whatever the shape was went you dropped it.

John doesn't seem to have this problem with his fireman and somehow has done the whole thing with only one trigger (unlike the two triggers we are using). I still can't replicate this with the one trigger so if someone can see what John has done that I can't see please let me know.


John U

James Brandwood said:

Hi John,

If the Fireman stayed where he was and it was just the circle and plus signs appearing as you dragged around it would be perfect.

How did you make the picture change states as it moved over different areas? Because if I did that to a transparent box it would be exactly what I am after.


See if this Story does what you want.

Check the states on Fireman 1.   The "no" symbol appears on mouse down and the plus appears when dragged over the transparent rectangle.


James Brandwood

Looks good - I hadn't thought of making a change of state based on mouse click.

One small thing and I know it's nit picking but when you select the fireman, he turns into a crossed out circle, then when you move over the drop area he turns into a plus, then when you keep going past the drop aea he turns into a fireman again and not a crossed out circle.

I am at a loss on how to fix that but I will have a look later and try be helpful.

James Brandwood

You've hit that one out of the park; works perfectly.

I will now reverse engineer what you have done and put it into my modules. I can see that sort of drag and drop function being useful to anyone making a software simulation and would recommend your work here gets turned into one of those tutorial screeners.

I really appreciate your help on this!

This discussion is closed. You can start a new discussion or contact Articulate Support.