Palette with previews, categories and view modes

This changeset contains the following improvements to the palette:

1. Display modes. The palette now supports several different view
   modes, and you can switch these via the context menu. The modes
   are:

   a. Previews. This renders previews for all the views using the
      current SDK platform, theme, screen density, etc.
   b. Small Previews. This is like (a), but scaled down to 75% size.
   c. Tiny Previews. Like (a), but scaled down to 50% size.
   d. Text + Icon. This shows an icon and the name of the view; this
      is the same as what the palette has looked like before this
      changeset.
   e. Icons only.

   All the modes, except for the Text+Icon mode, will lay out the
   views in a row (with vertical centering) to fit as much as possible
   in the available space for that category.

   The view mode, along with other view flags described below, are
   preserved across IDE sessions.

2. An accordion view. The palette is now using an Accordion control,
   which means it by default will keep a single category open, and it
   will always ensure that ALL the category labels are visible in the
   current view without scrolling. Via the context menu you can turn
   off the auto-close of the previous category.  The accordion view
   uses vertical scrollbars within each category content area, if
   necessary.

   The accordion view renders the category headers using open/close
   folder icons, a bold font, and a background gradient which varies
   between the normal and hovered states.

3. Categories. The category metadata is now used to organize the views
   into a handful of different categories. The categories can be
   enabled and disabled via the context menu. When you turn off
   categories, you get all the views in a single large list.

4. Alphabetical sorting. By default, the views are now sorted
   "naturally" (e.g.  the metadata provided order, where important
   views are listed first). You can switch it to alphabetical order
   via the context menu, in which case the items are listed in
   alphabetical order, either within their individual categories, or
   if categories are turned off, the global view list.

This changeset also adds a new SWT ImageControl. This is necessary to
display the preview images, because the CLabel, which is usually used
to display images in SWT, is hardcoded to hide the icon if there is
not enough horizontal space to display the full label (even when it
has no text label), so for wide preview images the images would simply
disappear when the palette was resized.

Change-Id: I1e1fe051947809206ef9f3a2dfa2fbeae0341107

1 files changed, 43 insertions, 39 deletions

diff --git a/eclipse/plugins/com.android.ide.eclipse.adt/src/com/android/ide/eclipse/adt/internal/editors/layout/gre/extra-view-metadata.xml b/eclipse/plugins/com.android.ide.eclipse.adt/src/com/android/ide/eclipse/adt/internal/editors/layout/gre/extra-view-metadata.xml
index 31b71aaeb..9fa235b02 100644
--- a/eclipse/plugins/com.android.ide.eclipse.adt/src/com/android/ide/eclipse/adt/internal/editors/layout/gre/extra-view-metadata.xml
+++ b/eclipse/plugins/com.android.ide.eclipse.adt/src/com/android/ide/eclipse/adt/internal/editors/layout/gre/extra-view-metadata.xml
@@ -19,6 +19,8 @@
 <!ATTLIST view
     class CDATA #REQUIRED
     previewXml CDATA #IMPLIED
+    skip (true|false) "false"
+    render (alone|skip|normal) "normal"
     fill ( none|both|width|height|opposite|
           width_in_vertical|height_in_horizontal) "none"
 >
@@ -41,60 +43,62 @@
         <view class="android.widget.RatingBar" />
         <view class="android.widget.SeekBar" fill="width_in_vertical" />
     </category>
+    <category name="Layouts">
+        <view class="android.widget.LinearLayout" fill="opposite" render="skip"/>
+        <view class="android.widget.RelativeLayout" fill="opposite" render="skip"/>
+        <view class="android.widget.FrameLayout" fill="opposite" render="skip"/>
+        <view class="android.widget.AbsoluteLayout" fill="opposite" render="skip"/>
+        <view class="android.widget.TableLayout" fill="opposite" render="skip"/>
+        <view class="android.widget.TableRow" fill="opposite" render="skip"/>
+    </category>
     <category name="Composite">
-        <view class="android.widget.ListView" fill="width_in_vertical" />
-        <view class="android.widget.ExpandableListView" fill="width_in_vertical" />
-        <view class="android.widget.TwoLineListItem" />
-        <view class="android.widget.GridView" fill="opposite"/>
-        <view class="android.widget.ScrollView" fill="opposite"/>
-        <view class="android.widget.HorizontalScrollView" />
-        <view class="android.widget.SearchView" />
-        <view class="android.widget.SlidingDrawer" />
-        <view class="android.widget.TabHost" fill="width_in_vertical" />
-        <view class="android.widget.TabWidget" />
-        <view class="android.webkit.WebView" fill="opposite"/>
+        <view class="android.widget.ListView" fill="width_in_vertical"  render="skip"/>
+        <view class="android.widget.ExpandableListView" fill="width_in_vertical"  render="skip"/>
+        <view class="android.widget.TwoLineListItem"  render="skip"/>
+        <view class="android.widget.GridView" fill="opposite" render="skip"/>
+        <view class="android.widget.ScrollView" fill="opposite" render="skip"/>
+        <view class="android.widget.HorizontalScrollView" render="skip"/>
+        <view class="android.widget.SearchView" render="skip"/>
+        <view class="android.widget.SlidingDrawer"/>
+        <view class="android.widget.TabHost" fill="width_in_vertical" render="alone" />
+        <view class="android.widget.TabWidget" render="alone" />
+        <view class="android.webkit.WebView" fill="opposite" render="skip" />
     </category>
     <category name="Images &amp; Media">
         <view class="android.widget.ImageView" />
         <view class="android.widget.ImageButton" />
-        <view class="android.widget.Gallery" fill="width_in_vertical" />
-        <view class="android.widget.MediaController" />
-        <view class="android.widget.VideoView"  fill="opposite" />
-    </category>
-    <category name="Layouts">
-        <view class="android.widget.LinearLayout" fill="opposite"/>
-        <view class="android.widget.RelativeLayout" fill="opposite"/>
-        <view class="android.widget.FrameLayout" fill="opposite"/>
-        <view class="android.widget.AbsoluteLayout" fill="opposite"/>
-        <view class="android.widget.TableLayout" fill="opposite"/>
-        <view class="android.widget.TableRow" fill="opposite"/>
+        <view class="android.widget.Gallery" fill="width_in_vertical" render="skip"/>
+        <view class="android.widget.MediaController" render="skip"/>
+        <view class="android.widget.VideoView" fill="opposite" render="skip"/>
     </category>
     <category name="Time &amp; Date">
-        <view class="android.widget.TimePicker" />
-        <view class="android.widget.DatePicker" />
+        <view class="android.widget.TimePicker" render="alone"/>
+        <view class="android.widget.DatePicker" render="alone"/>
         <view class="android.widget.CalendarView" />
         <view class="android.widget.Chronometer" />
         <view class="android.widget.AnalogClock" />
         <view class="android.widget.DigitalClock" />
     </category>
     <category name="Transitions">
-        <view class="android.widget.ImageSwitcher" />
-        <view class="android.widget.AdapterViewFlipper" fill="opposite"/>
-        <view class="android.widget.StackView" fill="opposite"/>
-        <view class="android.widget.TextSwitcher" fill="opposite"/>
-        <view class="android.widget.ViewAnimator" fill="opposite"/>
-        <view class="android.widget.ViewFlipper" fill="opposite"/>
-        <view class="android.widget.ViewSwitcher" fill="opposite"/>
+        <view class="android.widget.ImageSwitcher" render="skip"/>
+        <view class="android.widget.AdapterViewFlipper" fill="opposite" render="skip"/>
+        <view class="android.widget.StackView" fill="opposite" render="skip"/>
+        <view class="android.widget.TextSwitcher" fill="opposite" render="skip"/>
+        <view class="android.widget.ViewAnimator" fill="opposite" render="skip"/>
+        <view class="android.widget.ViewFlipper" fill="opposite" render="skip"/>
+        <view class="android.widget.ViewSwitcher" fill="opposite" render="skip"/>
     </category>
     <category name="Advanced">
-        <view class="android.view.View" />
-        <view class="android.view.ViewStub" />
-        <view class="android.gesture.GestureOverlayView" />
-        <view class="android.view.SurfaceView" />
-        <view class="android.widget.NumberPicker" />
-        <view class="android.widget.ZoomButton" />
-        <view class="android.widget.ZoomControls" />
-        <view class="android.widget.DialerFilter" fill="width_in_vertical" />
+        <view class="android.view.View" render="skip"/>
+        <view class="android.view.ViewStub" render="skip"/>
+        <view class="android.gesture.GestureOverlayView" render="skip"/>
+        <view class="android.view.SurfaceView" render="skip"/>
+        <view class="android.widget.NumberPicker" render="alone"/>
+        <view class="android.widget.ZoomButton"/>
+        <view class="android.widget.ZoomControls"/>
+        <view class="include" skip="true" render="skip"/>
+        <view class="merge" skip="true" render="skip"/>
+        <view class="android.widget.DialerFilter" fill="width_in_vertical" render="skip"/>
     </category>
     <category name="Other">
         <!--  This is the catch-all category which contains unknown views if we encounter any -->