Xfce Wiki

Sub domains
 

Differences

This shows you the differences between two versions of the page.

Link to this comparison view

Both sides previous revisionPrevious revision
Next revision		Previous revision
Next revisionBoth sides next revision
dev:hig:panel-plugins [2012/05/08 21:59] – [General] landrydev:hig:panel-plugins [2012/06/03 19:06] – [Size] mike
Line 63: Line 63:
  
 The button has to display the image at the left or at the top given the panel's orientation. The button has to display the image at the left or at the top given the panel's orientation.
 +
 +==== Labels ====
 +
 +Labels should be oriented horizontally in the horizontal and deskbar mode and vertically (rotated clockwise) in the vertical mode.
 +
 +(RFC) For consistency with other panel plugins and for good aligning of plugins in the panel, I'd suggest aligning all labels to the left edge of the plugin, or icon, if present. Currently many plugins center their labels, which looks poorly in the deskbar mode, or if multiple rows are used in other modes.
 +
 +If plugin displays multiple rows of labels, it should preserve their native spacing (e.g. vbox with labels should be wrapped with a GtkAdjustment widget to prevent expanding the box).
 +
 +If multiple labels don't fit in the panel row, then either some of them should be hidden/rearranged, or "small" property should be disabled.
 +
 +==== Images or Icons ====
 +
 +If the plugin displays an icon-sized image, it should be aligned with the left edge (or top edge in the vertical mode) of the plugin. The size of the icon should match the size of icons embedded in buttons (launchers etc.). If all image sizes are same, the user may be able to set the size of the plugin in such a way that the images are not resized (resizing leads to smoothing the icon).
  
 ==== Input ==== ==== Input ====
Line 80: Line 94:
 The different elements are contained inside a box, the border width of the box is 0, and the spacing between the children is 2 pixels.  For the comments about the labels refer to the button class. The different elements are contained inside a box, the border width of the box is 0, and the spacing between the children is 2 pixels.  For the comments about the labels refer to the button class.
  
 +Some comments on the above design:
 +  * IMHO it would be better to flush all labels to the left (align them with the icon) and to stop them expand vertically.
 +  * It would be really nice to get rid of the progress bars.  What if we could replace all the progress bars with custom indicators drawn on top of the icon itself?
 +    * They will never be properly aligned across rows (we could try putting them between the icon and the labels but what if there is no icon?). 
 +    * It would be nice to use the above design in the deskbar mode as well, but currently if the number of rows is 1, labels and progress bars wouldn'd fit next to the icon.
 +    * It would be nice if the monitor plugin could display only an icon and still be useful (have the gauge displayed on it) - not too different from the mixer plugin.
 +
 +The above would result in the following layout (mockup):
 +
 +{{http://img837.imageshack.us/img837/2050/horizontal.png}}
 +
 +In a horizontal panel.
 +
 +{{http://img85.imageshack.us/img85/9162/deskbar.png}}
 +
 +In a deskbar.
 +
 +Note that the icons/labels are aligned wrt. each other, and that the monitor is still usable even if only icon is displayed.
 ===== Panel properties ===== ===== Panel properties =====
  
-==== mode ====+==== Mode ==== 
 + 
 +The panel has three modes: horizontal, vertical, and deskbar. 
 + 
 +=== Horizontal mode === 
 +  * Widgets are placed horizontally 
 +  * Progressbars are placed vertically 
 + 
 +=== Vertical mode === 
 +  * Widgets are placed vertically 
 +  * Labels are rotated to 90 degrees 
 +  * Progressbars are placed horizontally 
 + 
 +=== Deskbar mode === 
 +  * Widgets are placed vertically 
 +  * Composited widgets can be packed horizontally 
 +  * Labels are not rotated 
 +  * Progressbars are placed horizontally 
 + 
 +==== Size ==== 
 + 
 +Two category of sizes can be distinguished for the panel: small and large size.
  
-The panel (starting with 4.10) has 3 modes : horizontal, vertical and deskbar. A plugin should layout its widgets following those rules : +=== Padding ===
-  * use a vertical XfceHVBox if the panel is in vertical or deskbar mode, horizontal otherwise. +
-  * labels should be oriented vertically (using ''gtk_label_set_angle()'') in vertical mode. +
-  * progressbars should be oriented vertically in horizontal mode, horizontally otherwise.+
  
-==== size ==== +  * Plugins that include a padding have to stick to 1px for a size < 28px and 2px otherwise. 
-plugins should be tested to still render fine in all panel sizes, starting from 16px to 40px at least.+  * When displaying a frame around the plugin, the padding has to be 0px for a size of < 28px and 1px otherwise.
 ==== number of rows ==== ==== number of rows ====