Debugging Eclipse UI layouts with Picasso
I always seem to spend too much time dinking around with UI layouts. In fact, today I’ve been fighting an odd problem where I had a bunch of extra space in a dialog between two other elements. I had spent excessive time trying things, over and over again, with no success. That’s usually a sign to take a step back from the keyboard.
I vaguely remembered there was a tool that painted each composite in the UI a different color. I Googled and found Simon Archer and Chris Aniszczyk’s Picasso tool. Picasso is found in the PDE incubator source code (unfortunately it doesn’t get full billing on the PDE incubator page).
I ran my app with Picasso enabled, and clearly saw that something was amiss between my text and my table. I hovered over the lime green box and was able to get a large screen of useful information (not shown): what the element is, its parentage, layout, etc. I was able to quickly fix my mistake.
How to use:
- Import the project into your workspace from the PDE incubator repository.
- In your run config:
- Plug-ins: add org.eclipse.pde.picasso.
- Tracing: enable tracing and turn on org.eclipse.pde.picasso.
- Start your app.