Saturday January 08, 2005

Okay, this is not hidden in the same sense as the previous hidden Creator features I've blogged about, but nevertheless it's a feature that is probably not well known and is not documented anywhere.

Let's say you want to add an image to your page. As of patch 5, all you need to do is locate your image on the desktop, then drag and drop it on your page in the designer. You can even swipe out a selection of images, then drag these to the designer and they are all added.



When you're done, the images are placed where you dropped them. You can now move them around further etc.

The images shown here are a couple of images I had lying around; one is a splash screen used internally in early Creator builds, back when it was called Rave. The ball is the image used as a dock icon for Creator on Apple OSX. Notice how transparency for overlapping images works in web pages too (the "shadow" portion of the ball icon is casting a shadow on the yellow splash screen); I checked and both Mozilla and Safari handle this as well. There are some problems with Internet Explorer.

The drop handler is not limited to images. You can drop text as well. Select some text, and drop it on the designer. This will automatically create an Output Text component, assign the clipboard text as the output text value, and position the output text at the drop position.

You can also drop files to quickly add these to the project. If the file happens to be a stylesheet, then the current web page that you dropped the stylesheet on will also be added to the list of stylesheets associated with that page. You can use drag & drop from the Project Navigator as well. Let's say you've added a stylesheet to your project, but it's not used by the current web page. Just drag from the stylesheet in the Project Navigator to the web form, and this will add a style link reference from the page to this stylesheet.

One final tip related to drag & drop: when you're editing let's say the Java page bean for a file, and you need to refer to a component, just drag that component from the application outline into the source editor. This will insert the instance name in the editor. For example, if your application outline looks like the one shown on the right, you can drag for example the last item shown into the source editor, and at the caret position it will insert dropdown1Converter.