Forum Discussion

DanyTurcotte's avatar
DanyTurcotte
Community Member
2 months ago

Drag-and-Drop or Display Issues

Hello everyone,

I would like to get some advice on a project I'm working on. I will share my file with you so you can better understand it. If you have any suggestions or alternative ideas, I would appreciate it if you could share them.

The project illustrates an iceberg representing a person. The items numbered from 1 to 8 will be replaced by qualities, values, or other characteristics that the person can move if they apply to them. For example, item #1 could be replaced by “I love traveling.” If the person likes to travel, they move this item onto the iceberg, and so on. I have created a semi-transparent rectangle with 8 states to represent the water level. The displayed number is the result of the nb_items variable used for testing, but it will be removed in the final version. This variable changes depending on the number of items moved onto the iceberg.

Test #1 (Drag and Drop)
I have set up a drag-and-drop activity, where the drop zone is above the iceberg image. When I drag an item onto the iceberg, the water level changes according to the nb_items variable. The main issue I’m encountering is that when I remove an item from the iceberg, I’m unable to subtract 1 from the variable to adjust the water level. One positive aspect is that the items are positioned at the top of the drop zone and return to their original location when removed.

Test #2 (Rectangles)
Here’s a version without the drag-and-drop functionality. The drop zones are rectangles with no background. In this example, the calculations work correctly. However, when items are dropped, they center within the respective rectangles, and the texts become unreadable because they overlap.

Do you have any solutions to resolve these issues and help me successfully complete my project?

Thank you very much for your help.

https://360.articulate.com/review/content/5f458ed2-24c9-462e-aef6-3eb248148db6/review

storyline 360
  • JudyNollet's avatar
    JudyNollet
    Super Hero
    2 months ago

    The attached file has an edited version of the drag-and-drop that works the way you want it to. 

    • I redid the triggers for each object so that the associated T/F variable is set to True and 1 is added to "nb_concept" when the item reaches the Drop Correct state.
    • The opposite happens when the item returns to Normal.
      • For those triggers, I used "is not Drop Correct." Why? Because all built-in states are based on Normal, so using "is Normal" doesn't always work as expected. 
    • As an example, here's what the triggers for item 1 look like:

    FYI: I added references to the T/F variables to the temporary text box that references the "nb_concept" variable. I also gave that a bright red fill. That's just my way of marking something that will need to be deleted. 😊

    By the way, I commend you on giving meaningful names to objects and variables. That always helps with programming and troubleshooting. 👏

    Best wishes for success with your project. 

  • NedimRamic-88da's avatar
    NedimRamic-88da
    Community Member
    2 months ago

    If variables are not essential, you can add to and subtract from nb_concept with only one trigger per each drag item.  See the attached example. 

    Although it's possible to ensure the drag items return to their original positions by using Motion Paths, I don't see a way to tile or stack them on top of each other when dropped onto the respective rectangles without using the drag-and-drop functionality.

  • DanyTurcotte's avatar
    DanyTurcotte
    Community Member
    2 months ago

    Thank you very much @Judy and @Nedim for your help; it is greatly appreciated. I focused too much on the deposit area. I'm grateful for your collaboration on this.

Related Content