toggle button: Convert to css nodes

Convert GtkToggleButton and its subclasses to CSS nodes.
Keep the button element name for when we want to render
these button-like (but with .toggle, .check and .radio
style classes for differentiation).

When we want to render them with an indicator, use distinct
element names checkbutton and radiobutton, and add a subnode
for the indicator with name check or radio.
This commit is contained in:
Matthias Clasen 2015-10-30 00:27:13 -04:00
parent 826633b5b7
commit c631656f0c
5 changed files with 152 additions and 34 deletions

View File

@ -367,6 +367,7 @@ gtk_private_h_sources = \
gtkbuttonprivate.h \
gtkcairoblurprivate.h \
gtkcellareaboxcontextprivate.h \
gtkcheckbuttonprivate.h \
gtkclipboardprivate.h \
gtkcolorswatchprivate.h \
gtkcoloreditorprivate.h \

View File

@ -33,6 +33,9 @@
#include "gtkprivate.h"
#include "gtkrender.h"
#include "gtkwidgetprivate.h"
#include "gtkcssnodeprivate.h"
#include "gtkcssstylepropertyprivate.h"
#include "gtkradiobutton.h"
/**
@ -47,6 +50,15 @@
*
* The important signal ( #GtkToggleButton::toggled ) is also inherited from
* #GtkToggleButton.
*
* # CSS nodes
*
* A GtkCheckButton with indicator (see gtk_toggle_button_set_mode()) has a
* main CSS node with name checkbutton and a subnode with name check.
*
* A GtkCheckButton without indicator changes the name of its main node
* to button and adds a .check style class to it. The subnode is invisible
* in this case.
*/
@ -85,23 +97,19 @@ static void gtk_check_button_draw_indicator (GtkCheckButton *check_but
static void gtk_real_check_button_draw_indicator (GtkCheckButton *check_button,
cairo_t *cr);
G_DEFINE_TYPE (GtkCheckButton, gtk_check_button, GTK_TYPE_TOGGLE_BUTTON)
typedef struct {
GtkCssNode *indicator_node;
} GtkCheckButtonPrivate;
G_DEFINE_TYPE_WITH_PRIVATE (GtkCheckButton, gtk_check_button, GTK_TYPE_TOGGLE_BUTTON)
static void
gtk_check_button_state_flags_changed (GtkWidget *widget,
GtkStateFlags previous_state_flags)
{
/* FIXME
* This is a hack to get around the optimizations done by the CSS engine.
*
* The CSS engine will notice that no CSS properties changed on the
* widget itself when going from one state to another and not queue
* a redraw.
* And the reason for no properties changing will be that only the
* checkmark itself changes, but that is hidden behind a
* gtk_style_context_save()/_restore() pair, so it won't be caught.
*/
gtk_widget_queue_draw (widget);
GtkCheckButtonPrivate *priv = gtk_check_button_get_instance_private (GTK_CHECK_BUTTON (widget));
gtk_css_node_set_state (priv->indicator_node, gtk_widget_get_state_flags (widget));
GTK_WIDGET_CLASS (gtk_check_button_parent_class)->state_flags_changed (widget, previous_state_flags);
}
@ -124,8 +132,6 @@ gtk_check_button_class_init (GtkCheckButtonClass *class)
class->draw_indicator = gtk_real_check_button_draw_indicator;
gtk_widget_class_set_accessible_role (widget_class, ATK_ROLE_CHECK_BOX);
gtk_widget_class_install_style_property (widget_class,
g_param_spec_int ("indicator-size",
P_("Indicator Size"),
@ -142,6 +148,9 @@ gtk_check_button_class_init (GtkCheckButtonClass *class)
G_MAXINT,
INDICATOR_SPACING,
GTK_PARAM_READABLE));
gtk_widget_class_set_accessible_role (widget_class, ATK_ROLE_CHECK_BOX);
gtk_widget_class_set_css_name (widget_class, "checkbutton");
}
static void
@ -150,21 +159,72 @@ draw_indicator_changed (GObject *object,
gpointer user_data)
{
GtkButton *button = GTK_BUTTON (object);
GtkCheckButtonPrivate *priv = gtk_check_button_get_instance_private (GTK_CHECK_BUTTON (button));
GtkCssNode *widget_node;
widget_node = gtk_widget_get_css_node (GTK_WIDGET (button));
G_GNUC_BEGIN_IGNORE_DEPRECATIONS
if (gtk_toggle_button_get_mode (GTK_TOGGLE_BUTTON (button)))
gtk_button_set_alignment (button, 0.0, 0.5);
{
gtk_button_set_alignment (button, 0.0, 0.5);
gtk_css_node_set_visible (priv->indicator_node, TRUE);
if (GTK_IS_CHECK_BUTTON (button))
gtk_css_node_set_name (widget_node, I_("checkbutton"));
else if (GTK_IS_RADIO_BUTTON (button))
gtk_css_node_set_name (widget_node, I_("radiobutton"));
}
else
gtk_button_set_alignment (button, 0.5, 0.5);
{
gtk_button_set_alignment (button, 0.5, 0.5);
gtk_css_node_set_visible (priv->indicator_node, FALSE);
gtk_css_node_set_name (widget_node, I_("button"));
}
G_GNUC_END_IGNORE_DEPRECATIONS
}
static void
node_style_changed_cb (GtkCssNode *node,
GtkCssStyle *old_style,
GtkCssStyle *new_style,
GtkWidget *widget)
{
GtkBitmask *changes;
static GtkBitmask *affects_size = NULL;
if (G_UNLIKELY (affects_size == NULL))
affects_size = _gtk_css_style_property_get_mask_affecting (GTK_CSS_AFFECTS_SIZE | GTK_CSS_AFFECTS_CLIP);
changes = _gtk_bitmask_new ();
changes = gtk_css_style_add_difference (changes, old_style, new_style);
if (_gtk_bitmask_intersects (changes, affects_size))
gtk_widget_queue_resize (widget);
else
gtk_widget_queue_draw (widget);
_gtk_bitmask_free (changes);
}
static void
gtk_check_button_init (GtkCheckButton *check_button)
{
GtkCheckButtonPrivate *priv = gtk_check_button_get_instance_private (check_button);
GtkCssNode *widget_node;
gtk_widget_set_receives_default (GTK_WIDGET (check_button), FALSE);
g_signal_connect (check_button, "notify::draw-indicator", G_CALLBACK (draw_indicator_changed), NULL);
gtk_toggle_button_set_mode (GTK_TOGGLE_BUTTON (check_button), TRUE);
gtk_style_context_remove_class (gtk_widget_get_style_context (GTK_WIDGET (check_button)), "toggle");
widget_node = gtk_widget_get_css_node (GTK_WIDGET (check_button));
priv->indicator_node = gtk_css_node_new ();
gtk_css_node_set_name (priv->indicator_node, I_("check"));
gtk_css_node_set_parent (priv->indicator_node, widget_node);
gtk_css_node_set_state (priv->indicator_node, gtk_css_node_get_state (widget_node));
g_signal_connect_object (priv->indicator_node, "style-changed", G_CALLBACK (node_style_changed_cb), check_button, 0);
g_object_unref (priv->indicator_node);
}
/**
@ -548,6 +608,7 @@ static void
gtk_real_check_button_draw_indicator (GtkCheckButton *check_button,
cairo_t *cr)
{
GtkCheckButtonPrivate *priv = gtk_check_button_get_instance_private (check_button);
GtkWidget *widget;
GtkButton *button;
gint x, y;
@ -579,17 +640,23 @@ gtk_real_check_button_draw_indicator (GtkCheckButton *check_button,
if (gtk_widget_get_direction (widget) == GTK_TEXT_DIR_RTL)
x = allocation.width - (indicator_size + x);
gtk_style_context_save (context);
gtk_style_context_save_to_node (context, priv->indicator_node);
gtk_render_background (context, cr,
border_width, border_width,
allocation.width - (2 * border_width),
allocation.height - (2 * border_width));
gtk_style_context_add_class (context, GTK_STYLE_CLASS_CHECK);
gtk_render_check (context, cr,
x, y, indicator_size, indicator_size);
gtk_style_context_restore (context);
}
GtkCssNode *
gtk_check_button_get_indicator_node (GtkCheckButton *check_button)
{
GtkCheckButtonPrivate *priv = gtk_check_button_get_instance_private (check_button);
return priv->indicator_node;
}

View File

@ -0,0 +1,40 @@
/* GTK - The GIMP Toolkit
* Copyright (C) 2015 Red Hat, Inc.
*
* This library is free software; you can redistribute it and/or
* modify it under the terms of the GNU Lesser General Public
* License as published by the Free Software Foundation; either
* version 2 of the License, or (at your option) any later version.
*
* This library is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU
* Lesser General Public License for more details.
*
* You should have received a copy of the GNU Lesser General Public
* License along with this library. If not, see <http://www.gnu.org/licenses/>.
*/
/*
* Modified by the GTK+ Team and others 1997-2000. See the AUTHORS
* file for a list of people on the GTK+ Team. See the ChangeLog
* files for a list of changes. These files are distributed with
* GTK+ at ftp://ftp.gtk.org/pub/gtk/.
*/
#ifndef __GTK_CHECK_BUTTON_PRIVATE_H__
#define __GTK_CHECK_BUTTON_PRIVATE_H__
#include "gtkcheckbutton.h"
#include "gtkcssnodeprivate.h"
G_BEGIN_DECLS
GtkCssNode *gtk_check_button_get_indicator_node (GtkCheckButton *check_button);
G_END_DECLS
#endif /* __GTK_CHECK_BUTTON_PRIVATE_H__ */

View File

@ -29,11 +29,13 @@
#include "gtkcontainerprivate.h"
#include "gtkbuttonprivate.h"
#include "gtktogglebuttonprivate.h"
#include "gtkcheckbuttonprivate.h"
#include "gtklabel.h"
#include "gtkmarshalers.h"
#include "gtkprivate.h"
#include "gtkintl.h"
#include "a11y/gtkradiobuttonaccessible.h"
#include "gtkstylecontextprivate.h"
/**
* SECTION:gtkradiobutton
@ -70,6 +72,15 @@
* The group list does not need to be freed, as each #GtkRadioButton will remove
* itself and its list item when it is destroyed.
*
* # CSS nodes
*
* A GtkRadioButton with indicator (see gtk_toggle_button_set_mode()) has a
* main CSS node with name radiobutton and a subnode with name radio.
*
* A GtkRadioButton without indicator changes the name of its main node
* to button and adds a .radio style class to it. The subnode is invisible
* in this case.
*
* ## How to create a group of two radio buttons.
*
* |[<!-- language="C" -->
@ -200,12 +211,14 @@ gtk_radio_button_class_init (GtkRadioButtonClass *class)
G_TYPE_NONE, 0);
gtk_widget_class_set_accessible_type (widget_class, GTK_TYPE_RADIO_BUTTON_ACCESSIBLE);
gtk_widget_class_set_css_name (widget_class, "radiobutton");
}
static void
gtk_radio_button_init (GtkRadioButton *radio_button)
{
GtkRadioButtonPrivate *priv;
GtkCssNode *css_node;
radio_button->priv = gtk_radio_button_get_instance_private (radio_button);
priv = radio_button->priv;
@ -215,6 +228,9 @@ gtk_radio_button_init (GtkRadioButton *radio_button)
_gtk_toggle_button_set_active (GTK_TOGGLE_BUTTON (radio_button), TRUE);
priv->group = g_slist_prepend (NULL, radio_button);
css_node = gtk_check_button_get_indicator_node (GTK_CHECK_BUTTON (radio_button));
gtk_css_node_set_name (css_node, I_("radio"));
}
static void
@ -786,6 +802,7 @@ gtk_radio_button_draw_indicator (GtkCheckButton *check_button,
gint indicator_size, indicator_spacing;
gint baseline;
guint border_width;
GtkCssNode *css_node;
widget = GTK_WIDGET (check_button);
button = GTK_BUTTON (check_button);
@ -807,15 +824,14 @@ gtk_radio_button_draw_indicator (GtkCheckButton *check_button,
if (gtk_widget_get_direction (widget) == GTK_TEXT_DIR_RTL)
x = allocation.width - (indicator_size + x);
gtk_style_context_save (context);
css_node = gtk_check_button_get_indicator_node (check_button);
gtk_style_context_save_to_node (context, css_node);
gtk_render_background (context, cr,
border_width, border_width,
allocation.width - (2 * border_width),
allocation.height - (2 * border_width));
gtk_style_context_add_class (context, GTK_STYLE_CLASS_RADIO);
gtk_render_option (context, cr,
x, y, indicator_size, indicator_size);

View File

@ -59,6 +59,11 @@
*
* To simply switch the state of a toggle button, use gtk_toggle_button_toggled().
*
* # CSS nodes
*
* GtkToggleButton has a single CSS node with name button. To differentiate
* it from a plain #GtkButton, it gets the .toggle style class.
*
* ## Creating two #GtkToggleButton widgets.
*
* |[<!-- language="C" -->
@ -215,6 +220,7 @@ gtk_toggle_button_class_init (GtkToggleButtonClass *class)
G_TYPE_NONE, 0);
gtk_widget_class_set_accessible_type (widget_class, GTK_TYPE_TOGGLE_BUTTON_ACCESSIBLE);
gtk_widget_class_set_css_name (widget_class, "button");
}
static void
@ -413,24 +419,12 @@ gtk_toggle_button_set_mode (GtkToggleButton *toggle_button,
if (priv->draw_indicator != draw_indicator)
{
GtkStyleContext *context;
priv->draw_indicator = draw_indicator;
if (gtk_widget_get_visible (GTK_WIDGET (toggle_button)))
gtk_widget_queue_resize (GTK_WIDGET (toggle_button));
g_object_notify_by_pspec (G_OBJECT (toggle_button), toggle_button_props[PROP_DRAW_INDICATOR]);
/* Make toggle buttons conditionally have the "button"
* class depending on draw_indicator.
*/
context = gtk_widget_get_style_context (GTK_WIDGET (toggle_button));
if (draw_indicator)
gtk_style_context_remove_class (context, GTK_STYLE_CLASS_BUTTON);
else
gtk_style_context_add_class (context, GTK_STYLE_CLASS_BUTTON);
}
}