GtkBuilder界面开发

最初的想法

不能太复杂，但也不能太简单，因为那样没有含量，学不到什么。这次开发的界面至少应该这样：1、有一个主窗体跟若干构件；2、构件之间能够互相交互；3、最好能够明白GtkBuilder可能是怎样实现界面定制的。最后确定的界面大概如图1：

图1 整体界面

点击一下SayHello按钮，文本显示”Hello, World”，点击一下Goodbye按钮退出程序。

根据之前对GTK+信号机制的理解，点击SayHello按钮需要连接一个say_hello函数去响应，点击GoodBye按钮需要连接一个good_bye函数去响应。

绘制界面的注意点

整体界面就不介绍了，很简单，拖一个对话框出来，再拖两个按钮跟一个标签，搞定。最终结果如图2所示：

图2 最终设计界面

图2右边展示的分别是窗体的构件层次（上）和继承对象所关联的信号（下）。

设置关联信号

从图2可以留意到主窗体（标识为dialog-main）的”destroy”事件已经被我们关联到gtk_main_quit函数，这个函数用来退出整个程序。然后我们需要为GoodBye按钮关联good_bye函数。GoodBye按钮的ID是ButtonGoodBye，在GTK+中ID是我们获取子构件对象的唯一标识符号。图3显示了怎么设置ButtonGoodBye的”clicked”事件关联到good_bye函数。

图3 设置GoodBye按钮”clicked”信号

然后SayHello按钮的信号关联。但是在这里我们可以发现，之前的两个信号函数都不需要传递用户数据（即传递的参数为NULL）。在用户数据设置数值，传递的用户数据将会是我们设置数据的字符串形式（我猜测的，未验证）。与SayHello关联的数据say_hello函数需要接收标签控件的对象作为参数，所以在这里我们无法直接连接，只好在源代码处自己做信号关联。

完成界面绘制，保存，我们得到一个helloworld.glade文件（以XML格式保存）。

编写代码

GTK+采用GtkBuilder读取helloworld.glade文件，然后生成界面对象，获取到我们所需的对象，我们就可以释放GtkBuilder对象了。

源代码如下：

1. /*

2. 
   

3. * main.c

4. 
   

5. *

6. 
   

7. *  Created on: 2011-9-17

8. 
   

9. *      Author: kelvin

10. 
    

11. */

12. 
    

13. #include <gtk/gtk.h>

14. 
    

15. 
    

16. 
    

17. // good_bye 函数 与 GoodBye按钮的 "cilcked" 事件连接，由 UI 文件自动关联

18. 
    

19. G_MODULE_EXPORT void good_bye(GtkWidget *widget,gpointer data)

20. 
    

21. {

22. 
    

23.  gtk_main_quit();

24. 
    

25. }

26. 
    

27. 
    

28. 
    

29. // say_hello 函数 与 SayHello按钮的 "clicked" 事件连接，由于需要自己操作 data 参数，所以要手动关联

30. 
    

31. G_MODULE_EXPORT void say_hello(GtkWidget *widget,gpointer data)

32. 
    

33. {

34. 
    

35.       GtkLabel * labeltext = (GtkLabel *)data;

36. 
    

37.       if(g_strcmp0(gtk_label_get_label(labeltext), "Hello, World!") == 0)

38. 
    

39.       {

40. 
    

41.              gtk_label_set_label(labeltext, "Very Nice.");

42. 
    

43.       }

44. 
    

45.       else

46. 
    

47.       {

48. 
    

49.              gtk_label_set_label(labeltext, "Hello, World!");

50. 
    

51.       }

52. 
    

53. }

54. 
    

55. 
    

56. 
    

57. int main(int argc,char *argv[])

58. 
    

59. {

60. 
    

61.  GtkBuilder *builder = NULL;

62. 
    

63.  GError *error = NULL;

64. 
    

65.  GtkWidget *window = NULL;

66. 
    

67.  GtkLabel * text = NULL;

68. 
    

69.  GtkButton *button = NULL;

70. 
    

71. 
    

72. 
    

73.  gtk_init(&argc,&argv);

74. 
    

75. 
    

76. 
    

77.  // 初始化GtkBuilder，读取 UI 文件（由glade生成）

78. 
    

79.  builder=gtk_builder_new();

80. 
    

81.  gtk_builder_add_from_file(builder,"helloworld.glade",&error);

82. 
    

83. 
    

84. 
    

85.  // 自动关联已在 UI 文件配置好的信号

86. 
    

87.  gtk_builder_connect_signals(builder, NULL);

88. 
    

89. 
    

90. 
    

91.  // 根据 ID 获取子构件

92. 
    

93.  window=GTK_WIDGET(gtk_builder_get_object(builder,"dialog-main"));

94. 
    

95.  text = GTK_LABEL(gtk_builder_get_object(builder, "label-main"));

96. 
    

97.  button=GTK_BUTTON(gtk_builder_get_object(builder, "ButtonSayHello"));

98. 
    

99. 
    

100. 
     

101.  // 将 SayHello 按钮的 "clicked" 事件与 say_hello 函数关联

102. 
     

103.  gtk_signal_connect(GTK_OBJECT(button), "clicked", GTK_SIGNAL_FUNC(say_hello), (gpointer)text);

104. 
     

105. 
     

106. 
     

107.  // 获取到 UI 对象后，GtkBuilder 对象已没有作用，释放了

108. 
     

109.  g_object_unref(G_OBJECT(builder));

110. 
     

111. 
     

112. 
     

113.  // 设置主 UI 界面为可见

114. 
     

115.  gtk_widget_show_all(window);

116. 
     

117. 
     

118. 
     

119.  // 这里才正式运行界面

120. 
     

121.  gtk_main();

122. 
     

123. 
     

124. 
     

125.  return 0;

126. 
     

127. }