diff options
author | Benjamin Otte <otte@redhat.com> | 2014-10-07 05:58:09 +0200 |
---|---|---|
committer | Benjamin Otte <otte@redhat.com> | 2014-10-08 05:20:30 +0200 |
commit | be19ee29c28d3c692d95b18d415bb554bd806b99 (patch) | |
tree | 7e35be8b0f2a6efa4ad9ce3358a5a3c7be633811 | |
parent | 3897041f4a6707372da64bc9c6ef52449cb2d14c (diff) | |
download | gtk+-be19ee29c28d3c692d95b18d415bb554bd806b99.tar.gz |
colorswatch: Simplify drawing code
This adds a CSS box (complete with padding and border) for the icon. The
box is even drawn when no icon is present. Use the ".image" as the style
class here instead of -active-color-badge.
Use this box to draw the circle around the selection icon in Adwaita.
-rw-r--r-- | gtk/gtkcolorswatch.c | 72 | ||||
-rw-r--r-- | gtk/resources/theme/Adwaita/_common.scss | 26 | ||||
-rw-r--r-- | gtk/resources/theme/Adwaita/gtk-contained-dark.css | 24 | ||||
-rw-r--r-- | gtk/resources/theme/Adwaita/gtk-contained.css | 24 |
4 files changed, 73 insertions, 73 deletions
diff --git a/gtk/gtkcolorswatch.c b/gtk/gtkcolorswatch.c index 9218a2c731..77846a62e9 100644 --- a/gtk/gtkcolorswatch.c +++ b/gtk/gtkcolorswatch.c @@ -101,7 +101,7 @@ gtk_color_swatch_init (GtkColorSwatch *swatch) } #define INTENSITY(r, g, b) ((r) * 0.30 + (g) * 0.59 + (b) * 0.11) -#define ACTIVE_BADGE_RADIUS 10 +#define PIXBUF_SIZE 16 static gboolean swatch_draw (GtkWidget *widget, @@ -113,18 +113,19 @@ swatch_draw (GtkWidget *widget, GtkStyleContext *context; GtkStateFlags state; GtkIconTheme *theme; + GtkBorder border, padding; + GdkRectangle rect; GtkIconInfo *icon_info = NULL; theme = gtk_icon_theme_get_default (); context = gtk_widget_get_style_context (widget); - state = gtk_widget_get_state_flags (widget); + state = gtk_style_context_get_state (context); width = gtk_widget_get_allocated_width (widget); height = gtk_widget_get_allocated_height (widget); cairo_save (cr); gtk_style_context_save (context); - gtk_style_context_set_state (context, state); _gtk_theming_background_init (&background, context, 0, 0, width, height, @@ -184,54 +185,39 @@ swatch_draw (GtkWidget *widget, if (swatch->priv->icon) { - icon_info = gtk_icon_theme_lookup_icon (theme, swatch->priv->icon, 16, + icon_info = gtk_icon_theme_lookup_icon (theme, swatch->priv->icon, PIXBUF_SIZE, GTK_ICON_LOOKUP_GENERIC_FALLBACK | GTK_ICON_LOOKUP_USE_BUILTIN); } else if ((state & GTK_STATE_FLAG_SELECTED) != 0) { - GdkRGBA bg, border; - GtkBorder border_width; GIcon *gicon; - gtk_style_context_add_class (context, "color-active-badge"); - _gtk_theming_background_init (&background, context, - (width - 2 * ACTIVE_BADGE_RADIUS) / 2, (height - 2 * ACTIVE_BADGE_RADIUS) / 2, - 2 * ACTIVE_BADGE_RADIUS, 2* ACTIVE_BADGE_RADIUS, - GTK_JUNCTION_NONE); + gicon = g_themed_icon_new ("object-select-symbolic"); + /* fallback for themes that don't have object-select-symbolic */ + g_themed_icon_append_name (G_THEMED_ICON (gicon), "gtk-apply"); - if (_gtk_theming_background_has_background_image (&background)) - { - _gtk_theming_background_render (&background, cr); - } - else - { -G_GNUC_BEGIN_IGNORE_DEPRECATIONS - gtk_style_context_get_background_color (context, state, &bg); - gtk_style_context_get_border_color (context, state, &border); -G_GNUC_END_IGNORE_DEPRECATIONS - gtk_style_context_get_border (context, state, &border_width); - - cairo_new_sub_path (cr); - cairo_arc (cr, width / 2, height / 2, ACTIVE_BADGE_RADIUS, 0, 2 * G_PI); - cairo_close_path (cr); - gdk_cairo_set_source_rgba (cr, &bg); - cairo_fill_preserve (cr); - - gdk_cairo_set_source_rgba (cr, &border); - cairo_set_line_width (cr, border_width.left); - cairo_stroke (cr); + icon_info = gtk_icon_theme_lookup_by_gicon (theme, gicon, PIXBUF_SIZE, + GTK_ICON_LOOKUP_GENERIC_FALLBACK + | GTK_ICON_LOOKUP_USE_BUILTIN); + g_object_unref (gicon); + } - gicon = g_themed_icon_new ("object-select-symbolic"); - /* fallback for themes that don't have object-select-symbolic */ - g_themed_icon_append_name (G_THEMED_ICON (gicon), "gtk-apply"); + gtk_style_context_restore (context); - icon_info = gtk_icon_theme_lookup_by_gicon (theme, gicon, 16, - GTK_ICON_LOOKUP_GENERIC_FALLBACK - | GTK_ICON_LOOKUP_USE_BUILTIN); - g_object_unref (gicon); - } - } + /* now draw the overlay image */ + gtk_style_context_save (context); + gtk_style_context_add_class (context, GTK_STYLE_CLASS_IMAGE); + + gtk_style_context_get_border (context, state, &border); + gtk_style_context_get_padding (context, state, &padding); + rect.width = PIXBUF_SIZE + border.left + border.right + padding.left + padding.right; + rect.height = PIXBUF_SIZE + border.top + border.bottom + padding.top + padding.bottom; + rect.x = (width - rect.width) / 2; + rect.y = (height - rect.height) / 2; + + gtk_render_background (context, cr, rect.x, rect.y, rect.width, rect.height); + gtk_render_frame (context, cr, rect.x, rect.y, rect.width, rect.height); if (icon_info != NULL) { @@ -243,8 +229,8 @@ G_GNUC_END_IGNORE_DEPRECATIONS if (pixbuf != NULL) { gtk_render_icon (context, cr, pixbuf, - (width - gdk_pixbuf_get_width (pixbuf)) / 2, - (height - gdk_pixbuf_get_height (pixbuf)) / 2); + rect.x + border.left + padding.left, + rect.y + border.top + padding.top); g_object_unref (pixbuf); } diff --git a/gtk/resources/theme/Adwaita/_common.scss b/gtk/resources/theme/Adwaita/_common.scss index 3c5a0e5a67..b010bce8ae 100644 --- a/gtk/resources/theme/Adwaita/_common.scss +++ b/gtk/resources/theme/Adwaita/_common.scss @@ -2832,16 +2832,22 @@ GtkColorSwatch { &:only-child { border-radius: 5px; } - &.color-active-badge { - border-width: 2px; - &:hover { background-image: none; } - &.color-light, &.color-light:hover { - color: transparentize(black,0.7); - border-color: transparentize(black,0.7); - } - &.color-dark, &.color-dark:hover { - color: transparentize(white,0.5); - border-color: transparentize(white,0.5); + &.image, &.image:hover { + /* turn off everything from regular color swatch */ + border-width: 0px; + border-radius: 50%; + box-shadow: none; + background-image: none; + &:selected { + border-width: 2px; + &.color-light, &.color-light:hover { + color: transparentize(black,0.7); + border-color: transparentize(black,0.7); + } + &.color-dark, &.color-dark:hover { + color: transparentize(white,0.5); + border-color: transparentize(white,0.5); + } } } } diff --git a/gtk/resources/theme/Adwaita/gtk-contained-dark.css b/gtk/resources/theme/Adwaita/gtk-contained-dark.css index 7e71c3a599..6dee234634 100644 --- a/gtk/resources/theme/Adwaita/gtk-contained-dark.css +++ b/gtk/resources/theme/Adwaita/gtk-contained-dark.css @@ -4188,16 +4188,20 @@ GtkColorSwatch { border-bottom-right-radius: 5px; } GtkColorSwatch:only-child { border-radius: 5px; } - GtkColorSwatch.color-active-badge { - border-width: 2px; } - GtkColorSwatch.color-active-badge:hover { - background-image: none; } - GtkColorSwatch.color-active-badge.color-light, GtkColorSwatch.color-active-badge.color-light:hover { - color: rgba(0, 0, 0, 0.3); - border-color: rgba(0, 0, 0, 0.3); } - GtkColorSwatch.color-active-badge.color-dark, GtkColorSwatch.color-active-badge.color-dark:hover { - color: rgba(255, 255, 255, 0.5); - border-color: rgba(255, 255, 255, 0.5); } + GtkColorSwatch.image, GtkColorSwatch.image:hover { + /* turn off everything from regular color swatch */ + border-width: 0px; + border-radius: 50%; + box-shadow: none; + background-image: none; } + GtkColorSwatch.image:selected, GtkColorSwatch.image:hover:selected { + border-width: 2px; } + GtkColorSwatch.image:selected.color-light, GtkColorSwatch.image:selected.color-light:hover, GtkColorSwatch.image:hover:selected.color-light, GtkColorSwatch.image:hover:selected.color-light:hover { + color: rgba(0, 0, 0, 0.3); + border-color: rgba(0, 0, 0, 0.3); } + GtkColorSwatch.image:selected.color-dark, GtkColorSwatch.image:selected.color-dark:hover, GtkColorSwatch.image:hover:selected.color-dark, GtkColorSwatch.image:hover:selected.color-dark:hover { + color: rgba(255, 255, 255, 0.5); + border-color: rgba(255, 255, 255, 0.5); } GtkColorChooserWidget #add-color-button { border-color: #2a2f2f; diff --git a/gtk/resources/theme/Adwaita/gtk-contained.css b/gtk/resources/theme/Adwaita/gtk-contained.css index 1221968c7a..81eed0e3a5 100644 --- a/gtk/resources/theme/Adwaita/gtk-contained.css +++ b/gtk/resources/theme/Adwaita/gtk-contained.css @@ -4349,16 +4349,20 @@ GtkColorSwatch { border-bottom-right-radius: 5px; } GtkColorSwatch:only-child { border-radius: 5px; } - GtkColorSwatch.color-active-badge { - border-width: 2px; } - GtkColorSwatch.color-active-badge:hover { - background-image: none; } - GtkColorSwatch.color-active-badge.color-light, GtkColorSwatch.color-active-badge.color-light:hover { - color: rgba(0, 0, 0, 0.3); - border-color: rgba(0, 0, 0, 0.3); } - GtkColorSwatch.color-active-badge.color-dark, GtkColorSwatch.color-active-badge.color-dark:hover { - color: rgba(255, 255, 255, 0.5); - border-color: rgba(255, 255, 255, 0.5); } + GtkColorSwatch.image, GtkColorSwatch.image:hover { + /* turn off everything from regular color swatch */ + border-width: 0px; + border-radius: 50%; + box-shadow: none; + background-image: none; } + GtkColorSwatch.image:selected, GtkColorSwatch.image:hover:selected { + border-width: 2px; } + GtkColorSwatch.image:selected.color-light, GtkColorSwatch.image:selected.color-light:hover, GtkColorSwatch.image:hover:selected.color-light, GtkColorSwatch.image:hover:selected.color-light:hover { + color: rgba(0, 0, 0, 0.3); + border-color: rgba(0, 0, 0, 0.3); } + GtkColorSwatch.image:selected.color-dark, GtkColorSwatch.image:selected.color-dark:hover, GtkColorSwatch.image:hover:selected.color-dark, GtkColorSwatch.image:hover:selected.color-dark:hover { + color: rgba(255, 255, 255, 0.5); + border-color: rgba(255, 255, 255, 0.5); } GtkColorChooserWidget #add-color-button { border-color: #c7c7c7; |