【Linux】特别篇--GTK界面设计
- 一、GTK界面常用函数
- 1、控件大小设置
- 2、创建窗口
- 3、创建控件
- (1)标签label
- (2)按键button
- (3)行辑器
- 二、GTK常用布局方法
- 1、布局的使用方法(以水平布局为例)
- 2、表格布局
- 3、固定布局
- 4、使用案例
- 三、GTK信号与回调
- 1、信号注册函数(库函数提供)
- 2、回调函数(自己编写)
- 3、使用案例
GTK(GIMP Toolkit)是一个 图形用户编程的接口。它完全免费,现在很多Linux集成系统都已经将GTK1.2版本打包进去了。
头文件为 #include <gtk/gtk.h>
一、GTK界面常用函数
1、控件大小设置
gtk_widget_set_usize(控件,宽度,高度);
gtk_widget_set_size_request(控件,宽度,高度);
2、创建窗口
窗口是一个只能容纳一个控件的容器
#include <gtk/gtk.h> //linux系统下包含int main()
{gtk_init(NULL,NULL);GtkWidget* window = gtk_window_new(GTK_WINDOW_TOPLEVEL);//GTK_WINDOW_TOPLEVEL表示顶层显示gtk_widget_show(window);//gtk_widget_show()函数, 让GTK知道, 我们已经处理完设定其属性的工作, 并且可以显示它. gtk_main(); //界面监控打开return 0;
}
3、创建控件
(1)标签label
①创建一个lable
GtkWidget *label_one = gtk_label_new("label one");
②设置label的值
gtk_label_set_text(GTK_LABEL(label_one), "change the label_three text");
③获取label的值
const char *str = gtk_label_get_label(GTK_LABEL(label_one));
(2)按键button
①创建一个空按钮
GtkWidget *button = gtk_button_new();
②创建带文本的按钮
GtkWidget* button = gtk_button_new_with_label("Hello world");
③创建带图片的按钮
GtkWidget *image = gtk_image_new_from_file("./img/1.jpg");//当前目录下/img/1.jpg
④将按钮背景设为透明
gtk_button_set_relief(GTK_BUTTON(button2), GTK_RELIEF_NONE);
⑤修改按钮的文本
gtk_button_set_label(GTK_BUTTON(button1), "change");
⑥修改按钮的图片
gtk_button_set_image(GTK_BUTTON(button2), image);
⑦获取按钮的文本
const char *str = gtk_button_get_label(GTK_BUTTON(button1));
⑧获取按钮的图片
const char *str = gtk_button_get_label(GTK_BUTTON(button1));
(3)行辑器
①创建行辑器
GtkWidget *entry = gtk_entry_new();
②设置行辑器最大内容字符长度
gtk_entry_set_max_length(GTK_ENTRY(entry), 100);
③获取行辑器内容
entry_text = gtk_entry_get_text(GTK_ENTRY(entry));
④设置行辑器内容
gtk_entry_set_text(GTK_ENTRY(entry), "hello entry");
二、GTK常用布局方法
1、布局的使用方法(以水平布局为例)
①创建布局
GtkWidget* hbox = gtk_hbox_new(TRUE,10);//TRUE 决定是容器内控件大小否一致,10代表控件之间间隔以像素点为单位
②将布局添加到窗口当中
gtk_container_add(GTK_CONTAINER(window),hbox);
③将控件添加到布局当中
gtk_container_add(GTK_CONTAINER(hbox),button1);
④显示
gtk_widget_show_all(window);
2、表格布局
①创建布局
GtkWidget* table = gtk_table_new(5,4,TRUE);//创建一个表格布局,5行4列,TRUE表示内部控件大小相等
②将布局添加到窗口中
gtk_container_add(GTK_CONTAINER(window),table);
③将控件添加到布局中
gtk_table_attach_defaults(GTK_TABLE(table),button0,0,1,4,5);
④显示
gtk_widget_show_all(window);
3、固定布局
①创建布局
GtkWidget *fixed = gtk_fixed_new();
②将控件添加到布局中
gtk_fixed_put(GTK_FIXED(fixed),button,100,100);
4、使用案例
编译C文件
①水平布局
#include <gtk/gtk.h>int main(int argc, char const *argv[])
{gtk_init(NULL,NULL);//任何gtk程序都以这个开始GtkWidget* window = gtk_window_new(GTK_WINDOW_TOPLEVEL);GtkWidget* button = gtk_button_new_with_label("hello");GtkWidget* button1 = gtk_button_new_with_label("hello1");GtkWidget* hbox = gtk_hbox_new(TRUE,10);gtk_widget_set_usize(window,200,200);gtk_container_add(GTK_CONTAINER(window),hbox);gtk_container_add(GTK_CONTAINER(hbox),button);gtk_container_add(GTK_CONTAINER(hbox),button1);gtk_widget_show_all(window);gtk_main();//gtk事件监听return 0;
}
效果
②布局嵌套
#include <gtk/gtk.h>int main(int argc, char const *argv[])
{gtk_init(NULL,NULL);//任何gtk程序都以这个开始GtkWidget* window = gtk_window_new(GTK_WINDOW_TOPLEVEL);GtkWidget* button = gtk_button_new_with_label("hello");GtkWidget* button1 = gtk_button_new_with_label("hello1");GtkWidget* button3 = gtk_button_new_with_label("hello3");GtkWidget* button4 = gtk_button_new_with_label("hello4");GtkWidget* vbox = gtk_vbox_new(TRUE,10);GtkWidget* hbox1 = gtk_hbox_new(TRUE,10);gtk_widget_set_usize(window,200,200);gtk_container_add(GTK_CONTAINER(window),vbox);gtk_container_add(GTK_CONTAINER(vbox),hbox1);gtk_container_add(GTK_CONTAINER(hbox1),button3);gtk_container_add(GTK_CONTAINER(hbox1),button4);gtk_container_add(GTK_CONTAINER(vbox),button);gtk_container_add(GTK_CONTAINER(vbox),button1);gtk_widget_show_all(window);gtk_main();//gtk事件监听return 0;
}
效果
③表格布局
#include <gtk/gtk.h>int main(int argc, char const *argv[])
{gtk_init(NULL,NULL);GtkWidget* window = gtk_window_new(GTK_WINDOW_TOPLEVEL);GtkWidget* table = gtk_table_new(5,4,TRUE);GtkWidget* button1 = gtk_button_new_with_label("button1");gtk_container_add(GTK_CONTAINER(window),table);gtk_table_attach_defaults(GTK_TABLE(table),button1,2,3,1,2);gtk_widget_show_all(window);gtk_main();return 0;
}
效果
④固定布局
#include <gtk/gtk.h>int main(int argc, char const *argv[])
{gtk_init(NULL,NULL);GtkWidget* window = gtk_window_new(GTK_WINDOW_TOPLEVEL);GtkWidget* fixed = gtk_fixed_new();GtkWidget* button = gtk_button_new_with_label("hahaha");gtk_widget_set_usize(window,200,200);gtk_container_add(GTK_CONTAINER(window),fixed);gtk_fixed_put(GTK_FIXED(fixed),button,100,100);gtk_widget_show_all(window);gtk_main();return 0;
}
效果
三、GTK信号与回调
1、信号注册函数(库函数提供)
g_signal_connect(button0, "pressed", G_CALLBACK(deal_num), entry);
g_signal_connect(控件, "信号", G_CALLBACK(回调函数名), 传递的数据);
按键常用信号
- “clicked” : 单击按钮时触发
- “pressed” : 按下按钮时触发
- “released” : 释放按钮时触发
行辑器常用信号:
- “activate”:当用户在文本输入控件内部按回车键时引发activate信号;
2、回调函数(自己编写)
示例1:
void deal_pressed(GtkButton *button, gpointer user_data)
{const char *text = gtk_button_get_label(button);printf("%s----%s\n",(char *)user_data, text );return;
}
示例2:
void deal_num(GtkButton *button,gpointer data){const char* text = gtk_button_get_label(button);if(0==strcmp(text,"c")){buf[strlen(buf)-1] = 0; }else{int a = 0,b = 0;char c;strcat(buf,text);if(0==strcmp("=",text)){printf("text==##%s##\n",text);sscanf(buf,"%d%c%d",&a,&c,&b);printf("-------001----%c---\n",c);if('+'==c){sprintf(buf,"%d",a+b);}else if('-'==c){sprintf(buf,"%d",a-b);}else if('*'==c){sprintf(buf,"%d",a*b); }else if('/'==c){sprintf(buf,"%d",a/b); }}}gtk_entry_set_text(GTK_ENTRY(data),buf);
}
3、使用案例
#include <stdio.h>
#include <gtk/gtk.h>const char* ch="";void deal_num(GtkButton* button,gpointer* udata){ch = gtk_button_get_label(GTK_BUTTON(button));gtk_entry_set_text(GTK_ENTRY(udata),ch);
}int main(int argc, char const *argv[])
{gtk_init(NULL,NULL);GtkWidget* window = gtk_window_new(GTK_WINDOW_TOPLEVEL);GtkWidget* button1 = gtk_button_new_with_label("1");GtkWidget* button2 = gtk_button_new_with_label("2");GtkWidget* entry = gtk_entry_new();GtkWidget* table = gtk_table_new(5,4,TRUE);gtk_container_add(GTK_CONTAINER(window),table);gtk_table_attach_defaults(GTK_TABLE(table),entry,0,4,0,1);gtk_table_attach_defaults(GTK_TABLE(table),button1,0,1,1,2);g_signal_connect(button1,"pressed",G_CALLBACK(deal_num),entry);gtk_widget_show_all(window);gtk_main();return 0;
}
效果: