GTK4   チェックボタン

ホーム   C/C++チュートリアル  
目次

チェックボタン

チェックボタンはチェックされているか、いないかを選べるボタンです。複数のチェックボタンがある時にも そのうちの何個をチェックしたり、すべてのチェックボタンをチェックすることもできます。

以下のファイルを check.c というファイル名で記述して任意の場所に保存してください。

コードが少し簡単になりました

check.c


/*************************************
    check.c
    copyright    :  vivacocoa.jp
    last modified:  Mar. 19, 2025
************************************/

#include <gtk/gtk.h>

guchar  r, g, b;

static void
color (GtkWidget *btn, GtkWidget *area)
{
	if (g_strcmp0 (gtk_widget_get_name (btn), "red") == 0)
	{
		if (gtk_check_button_get_active (GTK_CHECK_BUTTON (btn)))
		{r = 255;} else {r = 0;}
		gtk_widget_queue_draw (area);
	}
	if (g_strcmp0 (gtk_widget_get_name (btn), "green") == 0)
	{
		if (gtk_check_button_get_active (GTK_CHECK_BUTTON (btn)))
		{g = 255;} else {g = 0;}
		gtk_widget_queue_draw (area);
	}
	if (g_strcmp0 (gtk_widget_get_name (btn), "blue") == 0)
	{
		if (gtk_check_button_get_active (GTK_CHECK_BUTTON (btn)))
		{b = 255;} else {b = 0;}
		gtk_widget_queue_draw (area);
	}
}

static void
draw (GtkDrawingArea *area, cairo_t *cr, int width, int height, gpointer data)
{
    GdkRGBA     color;
    gchar       *rgb;
    
    rgb     =   g_strdup_printf     ("rgb(%d,%d,%d)", r, g, b);
    gdk_rgba_parse                  (&color, rgb);
    g_free                          (rgb);
    gdk_cairo_set_source_rgba       (cr, &color);
    cairo_paint                     (cr);
}

static void
activate(GtkApplication *app, gpointer data)
{
    GtkWidget *win   = gtk_application_window_new (GTK_APPLICATION (app));
    GtkWidget *hbox  = gtk_box_new (GTK_ORIENTATION_HORIZONTAL, 5);
    GtkWidget *area  = gtk_drawing_area_new ();
    GtkWidget *vbox  = gtk_box_new (GTK_ORIENTATION_VERTICAL, 5);
    GtkWidget *red   = gtk_check_button_new_with_label("Red");
    GtkWidget *green = gtk_check_button_new_with_label("Green");
    GtkWidget *blue  = gtk_check_button_new_with_label("Blue");
    
    gtk_window_set_child (GTK_WINDOW(win), hbox);
    
    gtk_box_append (GTK_BOX (hbox), area);
    gtk_box_append (GTK_BOX (hbox), vbox);
    gtk_box_append (GTK_BOX (vbox), red);
    gtk_box_append (GTK_BOX (vbox), green);
    gtk_box_append (GTK_BOX (vbox), blue);
    
    gtk_window_set_title (GTK_WINDOW(win), "Check");
    gtk_window_set_default_size (GTK_WINDOW(win), 300, 200);

    gtk_widget_set_size_request (area, 100, 100);
    gtk_widget_set_hexpand (area, TRUE);
    gtk_widget_set_vexpand (area, TRUE);
    
    gtk_widget_set_name (red,   "red");
    gtk_widget_set_name (green, "green");
    gtk_widget_set_name (blue,  "blue");
    
    gtk_drawing_area_set_draw_func (GTK_DRAWING_AREA (area), draw, NULL, NULL);
    g_signal_connect (red,   "toggled", G_CALLBACK (color), area);
    g_signal_connect (green, "toggled", G_CALLBACK (color), area);
    g_signal_connect (blue,  "toggled", G_CALLBACK (color), area);
    
    gtk_window_present (GTK_WINDOW (win));
}

int main(int argc, char **argv)
{
    GtkApplication  *app;
    int             stat;
    
    app  = gtk_application_new ("jp.vivacocoa.togglebutton", 0 );
    g_signal_connect (app, "activate", G_CALLBACK( activate), NULL);
    stat = g_application_run (G_APPLICATION (app), argc, argv);
    g_object_unref (app);
    
    return stat;
}

コード説明

  1. static void
    color (GtkWidget *btn, GtkWidget *area)
    チェックボタンがクリックされたときに呼び出さる関数です。この関数で、グローバル変数 r, g, b の値を変更して、 実際の描画を gtk_widget_queue_draw 関数で draw 関数に依頼しています。
  2. static void
    draw (GtkDrawingArea *area, cairo_t *cr, int width, int height, gpointer data)
    実際に描画を担当している関数です。この関数の説明は「GTK4 カイロ」で詳しく説明します。この関数は ドローイングエリアが最初に表示されたときと、ドローイングエリアがリサイズされたときと、gtk_widget_queue_draw 関数が呼びだれたときに呼び出されます。
  3. gtk_widget_set_name (red, "red");
    どのチェックボタンかを識別できるように名前をつけています。static void color 関数では、この名前を利用して、 どの色の値を変更すれば良いかを判断しています。
  4. g_signal_connect (red, "toggled", G_CALLBACK (color), area);
    red チェックボタンで toggled イベントが発生したときに color 関数を呼び出します。color 関数の第1引数には red チェックボタンのポインターが渡され、color 関数の第2引数には g_signal_connect の第4引数のドローイングエリア (area) が渡されます。なお toggled イベントは、チェックボタンをクリックして、 チェックを入れたときと、チェックを外したときに発生します。

コンパイルと実行

以下のとおりです。Windows の場合は通常版でも ARM64版 でも mingw64 で行ってください。


// コンパイル
cc `pkg-config --cflags gtk4` check.c -o check `pkg-config --libs gtk4`

もしくは

gcc $(pkg-config --cflags gtk4) -o check check.c $(pkg-config --libs gtk4)

// 実行
./check

Red ボタンをクリックしてチェックを入れると赤色が表示 されます。

Red と Green にチェックを入れると、黄色になります。

Red と Blue にチェックを入れると、紫になります。

Red と Green と Blue にチェックを入れると、白色になります。

光の三原色になっています。いろいろと試してみてください。

難しいほうのコードも残しておきます

check.c


/*************************************
    check.c
    copyright    :  vivacocoa.jp
    last modified:  Mar. 19, 2025
************************************/

#include <gtk/gtk.h>

static cairo_surface_t *surface = NULL;

static void
color (GtkWidget *widget, gpointer data)
{
	static double r, g, b;
	if (g_strcmp0 (gtk_widget_get_name (widget), "red") == 0)
	{
		if (gtk_check_button_get_active (GTK_CHECK_BUTTON (widget)))
			{r = 1.0;} else {r = 0.0;}
			gtk_widget_queue_draw (data);
	}
	if (g_strcmp0 (gtk_widget_get_name (widget), "green") == 0)
	{
		if (gtk_check_button_get_active (GTK_CHECK_BUTTON (widget)))
			{g = 1.0;} else {g = 0.0;}
			gtk_widget_queue_draw (data);
	}
	if (g_strcmp0 (gtk_widget_get_name (widget), "blue") == 0)
	{
		if (gtk_check_button_get_active (GTK_CHECK_BUTTON (widget)))
			{b = 1.0;} else {b = 0.0;}
			gtk_widget_queue_draw (data);
	}
	cairo_t *cr;
	cr = cairo_create (surface);
	cairo_set_source_rgb (cr, r, g, b);
	cairo_paint (cr);
	cairo_destroy (cr);
}

static void
resize (GtkWidget *widget, int width, int height, gpointer data)
{
	if (surface)
	{
		cairo_surface_destroy (surface);
		surface = NULL;
	}
	if (gtk_native_get_surface (gtk_widget_get_native (widget)))
	{
		surface = cairo_image_surface_create (CAIRO_FORMAT_ARGB32,
					gtk_widget_get_width (widget),
					gtk_widget_get_height (widget));
		color (widget, widget);
	}
}

static void
func (GtkDrawingArea *area, cairo_t *cr, int width, int height, gpointer data)
{
	cairo_set_source_surface (cr, surface, 0, 0);
	cairo_paint (cr);
}

static void
activate (GApplication *app, gpointer data)
{
	GtkWidget * win  = gtk_application_window_new (GTK_APPLICATION (app));
	GtkWidget *hbox  = gtk_box_new (GTK_ORIENTATION_HORIZONTAL, 5);
	GtkWidget *area  = gtk_drawing_area_new ();
	GtkWidget *vbox  = gtk_box_new (GTK_ORIENTATION_VERTICAL, 5);
	GtkWidget *red   = gtk_check_button_new_with_label ("Red");
	GtkWidget *green = gtk_check_button_new_with_label ("Green");
	GtkWidget *blue  = gtk_check_button_new_with_label ("Blue");
	
	gtk_window_set_title (GTK_WINDOW (win), "Check");
	gtk_window_set_default_size (GTK_WINDOW (win), 300, 200);
	
	gtk_window_set_child (GTK_WINDOW (win), hbox);
	gtk_widget_set_size_request (area, 100, 100);
	gtk_widget_set_hexpand (area, TRUE);
	gtk_widget_set_vexpand (area, TRUE);
	
	gtk_box_append (GTK_BOX (hbox), area);
	gtk_box_append (GTK_BOX (hbox), vbox);
	gtk_box_append (GTK_BOX (vbox), red);
	gtk_box_append (GTK_BOX (vbox), green);
	gtk_box_append (GTK_BOX (vbox), blue);
	
	gtk_widget_set_name (red, "red");
	gtk_widget_set_name (green, "green");
	gtk_widget_set_name (blue, "blue");
	
	g_signal_connect_after (area, "resize", G_CALLBACK (resize), NULL);
	gtk_drawing_area_set_draw_func (GTK_DRAWING_AREA (area), func, NULL, NULL);
	g_signal_connect (red,   "toggled", G_CALLBACK (color), area);
	g_signal_connect (green, "toggled", G_CALLBACK (color), area);
	g_signal_connect (blue,  "toggled", G_CALLBACK (color), area);
	
	gtk_window_present (GTK_WINDOW (win));
}

int
main (int argc, char **argv)
{
	GtkApplication *app;
	int stat;
	
	app = gtk_application_new ("jp.vivacocoa.check", G_APPLICATION_DEFAULT_FLAGS);
	g_signal_connect (app, "activate", G_CALLBACK (activate), NULL);
	stat = g_application_run (G_APPLICATION (app), argc, argv);
	g_object_unref (app);
	
	return stat;
}


232 visits
Posted: Mar. 17, 2025
Update: Mar. 22, 2025

ホーム   C/C++チュートリアル   目次