GWT Part 2: Drag & Drop

Now that I have GWTDesigner by Instantiations, I am well armed to continue development in GWT.

I am building an agile project planning tool that makes heavy use of drag and drop to facilitate planning of user stories into iterations as recommended by the eXtreme Programming Planning Game.

I will show screenshots once I have the tool nearly completed, but in the meantime, let me say that I had great success using drag and drop in GWT due to the ease of their API. And, GWTDesigner made things easier as it enabled me to design UI visually without sacrificing code quality since it generates simple-to-understand code. In fact, I can modify generated code and GWTDesigner would still understand it and let me visually edit it since it works by reverse-engineering the source code.

Drag and Drop works in GWT as follows:

• Make sure that the root panel containing all widgets is an AbsolutePanel
  
• Create a single DragController instance for that root panel. Normally, you instantiate the implementing class PickupDragController unless you require special customizations.
• Depending on the drop action you need, create a DropController instance for every drop target. For example, you would use an IndexedDropController for a VerticalPanel drop target.
• Register all DropControllers with the single DragController
• Call DragController.makeDraggable(Widget) on every widget that will act as a drag source.

With Object-Oriented abstraction and encapsulation, I was able to hide most of that logic in Composite objects, making drag and drop very transparent in the code.

In the future, I will experiment with GWT remoting, and see how easy it can be used to facilitate transparent AJAX programming without the pain normally experienced with writing Javascript that works with different browsers.