diff --git a/demos/gtk-demo/demo.gresource.xml b/demos/gtk-demo/demo.gresource.xml index 17eb5c430c..583d29ec7f 100644 --- a/demos/gtk-demo/demo.gresource.xml +++ b/demos/gtk-demo/demo.gresource.xml @@ -232,6 +232,9 @@ decor1.png decor2.png + + portland-rose.jpg + markup.txt diff --git a/demos/gtk-demo/portland-rose.jpg b/demos/gtk-demo/portland-rose.jpg new file mode 100644 index 0000000000..89974da6c7 Binary files /dev/null and b/demos/gtk-demo/portland-rose.jpg differ diff --git a/demos/gtk-demo/transparent.c b/demos/gtk-demo/transparent.c index c307de4508..5d87dba98d 100644 --- a/demos/gtk-demo/transparent.c +++ b/demos/gtk-demo/transparent.c @@ -1,184 +1,10 @@ /* Overlay/Transparency * - * Use transparent background on GdkWindows to create a shadow effect on a GtkOverlay widget. + * Blur the background behind an overlay. */ #include -#define SHADOW_OFFSET_X 7 -#define SHADOW_OFFSET_Y 7 -#define SHADOW_RADIUS 5 - -static void -draw_shadow_box (cairo_t *cr, - GdkRectangle rect, - double radius, - double transparency) -{ - cairo_pattern_t *pattern; - double x0, x1, x2, x3; - double y0, y1, y2, y3; - - x0 = rect.x; - x1 = rect.x + radius; - x2 = rect.x + rect.width - radius; - x3 = rect.x + rect.width; - - y0 = rect.y; - y1 = rect.y + radius; - y2 = rect.y + rect.height - radius; - y3 = rect.y + rect.height; - - /* Fill non-border part */ - cairo_set_source_rgba (cr, 0, 0, 0, transparency); - cairo_rectangle (cr, - x1, y1, x2 - x1, y2 - y1); - cairo_fill (cr); - - /* Upper border */ - - pattern = cairo_pattern_create_linear (0, y0, 0, y1); - - cairo_pattern_add_color_stop_rgba (pattern, 0.0, 0.0, 0, 0, 0.0); - cairo_pattern_add_color_stop_rgba (pattern, 1.0, 0.0, 0, 0, transparency); - - cairo_set_source (cr, pattern); - cairo_pattern_destroy (pattern); - - cairo_rectangle (cr, - x1, y0, - x2 - x1, y1 - y0); - cairo_fill (cr); - - /* Bottom border */ - - pattern = cairo_pattern_create_linear (0, y2, 0, y3); - - cairo_pattern_add_color_stop_rgba (pattern, 0.0, 0.0, 0, 0, transparency); - cairo_pattern_add_color_stop_rgba (pattern, 1.0, 0.0, 0, 0, 0.0); - - cairo_set_source (cr, pattern); - cairo_pattern_destroy (pattern); - - cairo_rectangle (cr, - x1, y2, - x2 - x1, y3 - y2); - cairo_fill (cr); - - /* Left border */ - - pattern = cairo_pattern_create_linear (x0, 0, x1, 0); - - cairo_pattern_add_color_stop_rgba (pattern, 0.0, 0.0, 0, 0, 0.0); - cairo_pattern_add_color_stop_rgba (pattern, 1.0, 0.0, 0, 0, transparency); - - cairo_set_source (cr, pattern); - cairo_pattern_destroy (pattern); - - cairo_rectangle (cr, - x0, y1, - x1 - x0, y2 - y1); - cairo_fill (cr); - - /* Right border */ - - pattern = cairo_pattern_create_linear (x2, 0, x3, 0); - - cairo_pattern_add_color_stop_rgba (pattern, 0.0, 0.0, 0, 0, transparency); - cairo_pattern_add_color_stop_rgba (pattern, 1.0, 0.0, 0, 0, 0.0); - - cairo_set_source (cr, pattern); - cairo_pattern_destroy (pattern); - - cairo_rectangle (cr, - x2, y1, - x3 - x2, y2 - y1); - cairo_fill (cr); - - /* NW corner */ - - pattern = cairo_pattern_create_radial (x1, y1, 0, - x1, y1, radius); - - cairo_pattern_add_color_stop_rgba (pattern, 0.0, 0.0, 0, 0, transparency); - cairo_pattern_add_color_stop_rgba (pattern, 1.0, 0.0, 0, 0, 0.0); - - cairo_set_source (cr, pattern); - cairo_pattern_destroy (pattern); - - cairo_rectangle (cr, - x0, y0, - x1 - x0, y1 - y0); - cairo_fill (cr); - - /* NE corner */ - - pattern = cairo_pattern_create_radial (x2, y1, 0, - x2, y1, radius); - - cairo_pattern_add_color_stop_rgba (pattern, 0.0, 0.0, 0, 0, transparency); - cairo_pattern_add_color_stop_rgba (pattern, 1.0, 0.0, 0, 0, 0.0); - - cairo_set_source (cr, pattern); - cairo_pattern_destroy (pattern); - - cairo_rectangle (cr, - x2, y0, - x3 - x2, y1 - y0); - cairo_fill (cr); - - /* SW corner */ - - pattern = cairo_pattern_create_radial (x1, y2, 0, - x1, y2, radius); - - cairo_pattern_add_color_stop_rgba (pattern, 0.0, 0.0, 0, 0, transparency); - cairo_pattern_add_color_stop_rgba (pattern, 1.0, 0.0, 0, 0, 0.0); - - cairo_set_source (cr, pattern); - cairo_pattern_destroy (pattern); - - cairo_rectangle (cr, - x0, y2, - x1 - x0, y3 - y2); - cairo_fill (cr); - - /* SE corner */ - - pattern = cairo_pattern_create_radial (x2, y2, 0, - x2, y2, radius); - - cairo_pattern_add_color_stop_rgba (pattern, 0.0, 0.0, 0, 0, transparency); - cairo_pattern_add_color_stop_rgba (pattern, 1.0, 0.0, 0, 0, 0.0); - - cairo_set_source (cr, pattern); - cairo_pattern_destroy (pattern); - - cairo_rectangle (cr, - x2, y2, - x3 - x2, y3 - y2); - cairo_fill (cr); -} - -static gboolean -draw_callback (GtkWidget *widget, - cairo_t *cr, - gpointer data) -{ - GdkRectangle rect; - - gtk_widget_get_allocation (widget, &rect); - rect.x += SHADOW_OFFSET_X; - rect.y += SHADOW_OFFSET_Y; - rect.width -= SHADOW_OFFSET_X; - rect.height -= SHADOW_OFFSET_Y; - - draw_shadow_box (cr, - rect, SHADOW_RADIUS, 0.4); - - return FALSE; -} - GtkWidget * do_transparent (GtkWidget *do_widget) { @@ -186,12 +12,12 @@ do_transparent (GtkWidget *do_widget) if (!window) { - GtkWidget *view; GtkWidget *sw; GtkWidget *overlay; - GtkWidget *entry; - GtkCssProvider *provider; - gchar *css; + GtkWidget *button; + GtkWidget *label; + GtkWidget *box; + GtkWidget *image; window = gtk_window_new (GTK_WINDOW_TOPLEVEL); gtk_window_set_screen (GTK_WINDOW (window), @@ -203,33 +29,42 @@ do_transparent (GtkWidget *do_widget) gtk_window_set_title (GTK_WINDOW (window), "Transparency"); - view = gtk_text_view_new (); + overlay = gtk_overlay_new (); + gtk_container_add (GTK_CONTAINER (window), overlay); + + button = gtk_button_new_with_label ("Don't click this button!"); + label = gtk_bin_get_child (GTK_BIN (button)); + g_object_set (label, "margin", 50, NULL); + + gtk_widget_set_opacity (button, 0.7); + gtk_widget_set_halign (button, GTK_ALIGN_FILL); + gtk_widget_set_valign (button, GTK_ALIGN_START); + + gtk_overlay_add_overlay (GTK_OVERLAY (overlay), button); + gtk_container_child_set (GTK_CONTAINER (overlay), button, "blur", 5.0, NULL); + + button = gtk_button_new_with_label ("Maybe this one?"); + label = gtk_bin_get_child (GTK_BIN (button)); + g_object_set (label, "margin", 50, NULL); + + gtk_widget_set_opacity (button, 0.7); + gtk_widget_set_halign (button, GTK_ALIGN_FILL); + gtk_widget_set_valign (button, GTK_ALIGN_END); + + gtk_overlay_add_overlay (GTK_OVERLAY (overlay), button); + gtk_container_child_set (GTK_CONTAINER (overlay), button, "blur", 5.0, NULL); sw = gtk_scrolled_window_new (NULL, NULL); + sw = gtk_scrolled_window_new (NULL, NULL); + gtk_container_add (GTK_CONTAINER (overlay), sw); gtk_scrolled_window_set_policy (GTK_SCROLLED_WINDOW (sw), GTK_POLICY_AUTOMATIC, GTK_POLICY_AUTOMATIC); - gtk_container_add (GTK_CONTAINER (sw), view); + box = gtk_box_new (GTK_ORIENTATION_VERTICAL, 0); + gtk_container_add (GTK_CONTAINER (sw), box); + image = gtk_image_new_from_resource ("/transparent/portland-rose.jpg"); - overlay = gtk_overlay_new (); - gtk_container_add (GTK_CONTAINER (overlay), sw); - gtk_container_add (GTK_CONTAINER (window), overlay); - - entry = gtk_entry_new (); - provider = gtk_css_provider_new (); - css = g_strdup_printf ("* { border-width: 0px %dpx %dpx 0px; }", - SHADOW_OFFSET_X, SHADOW_OFFSET_Y); - gtk_css_provider_load_from_data (provider, css, -1); - g_free (css); - gtk_style_context_add_provider (gtk_widget_get_style_context (entry), - GTK_STYLE_PROVIDER (provider), - GTK_STYLE_PROVIDER_PRIORITY_APPLICATION); - g_signal_connect (entry, "draw", G_CALLBACK (draw_callback), NULL); - gtk_overlay_add_overlay (GTK_OVERLAY (overlay), entry); - gtk_widget_set_halign (entry, GTK_ALIGN_CENTER); - gtk_widget_set_valign (entry, GTK_ALIGN_START); - - gtk_widget_show (overlay); + gtk_container_add (GTK_CONTAINER (box), image); } if (!gtk_widget_get_visible (window))