2 Replies Latest reply on Nov 7, 2009 4:04 AM by Louder6Pounder

    Advice on Drag and Drop

    Louder6Pounder Level 1

      Hi Forum,  Just wondering if anyone had time to give me a little advice on how best to roughly go about making a drag and drop component in Flex. I'm moderately familiar with the framework and have used drag and drop before, but this is a bit more complicated.   I'm making a drag and drop form builder.

       

      The user will be able to create a fieldset which will then allow them to drag form fields into it.  Once the form field has been created it will become dragable around the current fieldset and also into other fieldsets.   This is the bit which i was wondering about.  What flex components should i use as a field and how best should i handle them being dragged around the fieldset.  When the field is dragged over another one in the fieldset they must all move down to create a space for it to be dropped into, and if its dragged out of the fieldset the gap where it was should be filled with the other fields.

       

      Any ideas? Thanks Tom 

        • 1. Re: Advice on Drag and Drop
          Ratsnackbar Level 2

          Forgive me if this is not entirely Flexish.  I have been doing a lot of work in AS3 lately and I am thinking in that mode right now.

           

          Since your fields you are going to using are realy just tools to store data that will eventually be used to build our real fields I would use a simple rectangle that perhaps has a right click menu to open screens to set values related to the field specifically.

           

          The fields themselves can use mouse down / move events for the movement (I will assume you know how to do that.)

           

          When moving the fields around the field that is moving can update a value object with it's coordinates.

           

          You can perform a hit test between fields that are already placed.  If one field touches another (Hovers over it), both fields trade x,y coordinates and use the centers of the fields to identify which way the field underneath should move itself.

           

          When the dragged field is dropped any fields that had previously moved out of the way would commit their current coordinates to perminant storage and the dropped field would add itself to your fieldset data structure.

           

          The field sets, which I assume are simple containers, would only need contain a list of the fields it contains and any values related specificaly to itself.  The fields would contain their own coordinate details and any other values that were set.

           

          The whole thing could be broken down into a relatively simple XML data structure or kept in a relational database.  You might want to consider handling events and data structure updates using Blaze DS or LCDS.  That way others could view the changes that are being made in real time from a different browser.

           

          I realize implementation is more difficult them brainstorming but I hope that at least helps to give you some ideas.

           

          -Joe

          • 2. Re: Advice on Drag and Drop
            Louder6Pounder Level 1

            Cheers for your help mate.  I've already made a version one with boxs in a VBox and it works ok but it does some funky things sometimes when you wave the mouse all about the screen while dragging.  I guess i need to make it more robust somehow.  All the rest is ok, i have got a 32page spec for all that, its just getting a bug free drag and drop system which is my problem.