Xfce Wiki

Sub domains
 

Differences

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

Link to this comparison view

Next revision		Previous revision
howto:gtk_theme [2011/12/15 23:43] – created peterhowto:gtk_theme [2019/03/27 22:23] (current) – [Xfce GTK Engine theme how to] blueberrybrownie
Line 1: Line 1:
-====== Xfce Gtk engine theme how-to ====== +====== Xfce GTK Engine Theme how to ====== 
-This document is under development.+This document is under development
  
 ===== Introduction ===== ===== Introduction =====
-gtk-xfce-egine, Xfce4's gtk engine provides a render engine for Gtk 2 and Gtk 3.+gtk-xfce-engine, Xfce4's gtk engine provides a render engine for Gtk 2 and Gtk 3.
 This page contains information about the extra theming settings the gtk-xfce-engine provides. This page contains information about the extra theming settings the gtk-xfce-engine provides.
 Both Gtk 2 and Gtk 3 are described here to make it easier to get a consistent look between them both. Both Gtk 2 and Gtk 3 are described here to make it easier to get a consistent look between them both.
Line 12: Line 12:
 To use the xfce engine in Gtk 2 set the engine to xfce. In the engine block the style properties can be set. To use the xfce engine in Gtk 2 set the engine to xfce. In the engine block the style properties can be set.
 The following simple properties are available. The following simple properties are available.
-| smooth_edge | boolean            | FALSE | Draw smooth rounded edges          | +| smooth_edge  | boolean             | FALSE  | Draw smooth rounded edges           | 
-| grip_style  | none, rough, slide | rough | Draw style of the grips on sliders |+| grip_style   | none, rough, slide  | rough  | Draw style of the grips on sliders  |
 The block property boxfill can be used for gradient backgrounds. The block property boxfill can be used for gradient backgrounds.
 Within the boxfill block the following properties can be set. Within the boxfill block the following properties can be set.
-| fill_style  | plain, gradient                                                  | plain | Draw style of the background                                 | +| fill_style   | plain, gradient                                                   | plain  | Draw style of the background                                  | 
-| orientation | auto, vertical, horizontal, northern_diagonal, southern_diagonal | auto  | The direction of the gradient background                     | +| orientation  | auto, vertical, horizontal, northern_diagonal, southern_diagonal  | auto   | The direction of the gradient background                      | 
-| shade_start | float                                                            | 1.10  | The shade of the background color to start the gradient with | +| shade_start  | float                                                             | 1.10   | The shade of the background color to start the gradient with  | 
-| shade_end   | float                                                            | 0.90  | The shade of the background color to end the gradient with   |+| shade_end    | float                                                             | 0.90   | The shade of the background color to end the gradient with    |
 Example showing the default values. Example showing the default values.
 <code> <code>
Line 42: Line 42:
 To use the xfce engine in Gtk 3 set the engine to xfce. The style properties can be directly set using the -xfce prefix. To use the xfce engine in Gtk 3 set the engine to xfce. The style properties can be directly set using the -xfce prefix.
 The following properties are available. The following properties are available.
-| -xfce-smooth-edge | boolean                | FALSE | Draw smooth rounded edges          | +| -xfce-smooth-edge  | boolean                 | FALSE  | Draw smooth rounded edges           | 
-| -xfce-grip-style  | disabled, rough, slide | rough | Draw style of the grips on sliders |+| -xfce-grip-style   | disabled, rough, slide  | rough  | Draw style of the grips on sliders  | 
 +Other properties can be set with default Gtk 3 settings. For example with background-image: -gtk-gradient() the background can be set to gradient. 
 +Here is a list of some of the properties. See the GtkCssProvider documentation for more details. 
 +| engine            | GtkThemingEngine  | The render engine to use. Set to xfce to use the gtk-xfce-engine                                  | 
 +| color             | GdkColor          | The foreground or text color                                                                      | 
 +| background-color  | GdkColor          | The background or base color                                                                      | 
 +| background-image  | cairo_pattern_t   | The pattern to draw the background. Either a -gtk-gradient of an url()                            | 
 +| border-color      | GdkColor          | The border color. Set it to darker() from the background-color for compatibility with Gtk 2       | 
 +| border-image      |                   | Not supported by the xfce engine                                                                  | 
 +| border-width      | GtkBorder         | The width reserved for the border. The xfce engine will only use 2 pixels at most for the border  | 
 +| border-radius     |                   | Not supported by the xfce engine                                                                  | 
 +| margin            | GtkBorder         | Margin to the widget content. Only a few widgets support this                                     | 
 +| padding           | GtkBorder         | Padding around the widget. Only a few widgets support this                                        | 
 +| text-shadow       | GtkTextShadow     | The text shadow. Set text-shadow: 1 1 white; for *:insensitive for compatibility with Gtk 2       |
  
 ==== Gtk compatibility ==== ==== Gtk compatibility ====
 The simple Gtk 2 style properties can be directly converted. With one exception of grip_style none. The value none in css will set the property value to default which is rough and not disabled. The simple Gtk 2 style properties can be directly converted. With one exception of grip_style none. The value none in css will set the property value to default which is rough and not disabled.
-The boxfill property is replaced by background-image: -gtk-gradient. By using the -gtk-gradient it is not possible to reproduce the northern_diagonal and southern_diagonal gradients. These are never or rarely used so the support is dropped until requested.+The boxfill property is replaced by background-image: -gtk-gradient(). By using the -gtk-gradient it is not possible to reproduce the northern_diagonal and southern_diagonal gradients. These are never or rarely used so the support is dropped until requested.
 The auto orientation is not automatically supported and must be configured manually see the examples for more details. The auto orientation is not automatically supported and must be configured manually see the examples for more details.
 +
 +The xthickness end ythickness are replaced by border-width. usages: border-width: <x> <y>; border-width: <width>; border-width: <left> <top> <right> <bottom>;
 +
 Linear vertical gradient example. Linear vertical gradient example.
 Gtk 2 Gtk 2
Line 631: Line 647:
 | Height of resize grip                                                                                               ||||| | Height of resize grip                                                                                               |||||
  
 +===== See also =====
 +  * [[howto:xfwm4_theme|Xfwm4 theme how-to]]
 +  * [[http://developer.gnome.org/gtk3/3.2/gtk-migrating-GtkStyleContext.html|Gtk 3 Theming changes]]