Beginner GtkBuilder interface development (refresh)

Source: Internet
Author: User


Preliminary ExplorationGtkBuilderInterface Development

Initial ideas

It cannot be too complex, but it cannot be too simple, because there is no content and nothing to learn. The interface for this development should at least be like this: 1. There is a main form with several components; 2. The components can interact with each other; 3. It is best to understand how GtkBuilder can implement interface customization. The final interface is roughly 1:

 

Figure 1 Overall Interface

 

Click "SayHello", "Hello, World" in the text, and click "Goodbye" to exit the program.

According to the previous understanding of the GTK + signal mechanism, click the SayHello button to connect to a say_hello function for response. Click the GoodBye button to connect to a good_bye function for response.

 

Notes for drawing the interface

The overall interface is not described. It is very simple to drag a dialog box and drag two buttons and a tag to complete the operation. The final result 2 is as follows:

 

 

Figure 2 final design interface

 

Figure 2 the right side shows the Component Hierarchy (top) of the form and the signal (bottom) associated with the inherited object ).

 

Set correlated signals

As shown in figure 2, we can see that the "destroy" event of the main form (marked as dialog-main) has been associated with the gtk_main_quit function, which is used to exit the entire program. Then we need to associate the good_bye function for the GoodBye button. The GoodBye button ID is ButtonGoodBye. In GTK +, ID is the unique identifier of the Child component object. Figure 3 shows how to set the "clicked" event of ButtonGoodBye to be associated with the good_bye function.

 

 

Figure 3 set the GoodBye button "clicked" Signal

 

Then, associate the signal of the SayHello button. However, we can find that neither of the previous two signal functions needs to transmit user data (that is, the transmitted parameter is NULL ). When user data is set to a value, the transmitted user data will be in the string format of the data we set (I guess, not verified ). The data say_hello function associated with SayHello needs to receive the object of the label control as a parameter, so we cannot directly connect here, so we have to do signal Association in the source code.

 

After drawing and saving the interface, we get a helloworld. glade file (saved in XML format ).

 

Write code

GTK + uses GtkBuilder to read the helloworld. glade file, generate the interface object, and obtain the object we need. Then we can release the GtkBuilder object.

The source code is as follows:

 

  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. // The good_bye function is connected to the "cilcked" event of the GoodBye button, which is automatically associated with the UI file.
  17.  
  18. G_MODULE_EXPORT void good_bye (GtkWidget * widget, gpointer data)
  19.  
  20. {
  21.  
  22. Gtk_main_quit ();
  23.  
  24. }
  25.  
  26.  
  27. // The say_hello function is connected to the "clicked" event of the SayHello button. You need to manually associate it because you need to operate the data parameters on your own.
  28.  
  29. G_MODULE_EXPORT void say_hello (GtkWidget * widget, gpointer data)
  30.  
  31. {
  32.  
  33. GtkLabel * labeltext = (GtkLabel *) data;
  34.  
  35. If (g_strcmp0 (gtk_label_get_label (labeltext), "Hello, World! ") = 0)
  36.  
  37. {
  38.  
  39. Gtk_label_set_label (labeltext, "Very Nice .");
  40.  
  41. }
  42.  
  43. Else
  44.  
  45. {
  46.  
  47. Gtk_label_set_label (labeltext, "Hello, World! ");
  48.  
  49. }
  50.  
  51. }
  52.  
  53.  
  54. Int main (int argc, char * argv [])
  55.  
  56. {
  57.  
  58. GtkBuilder * builder = NULL;
  59.  
  60. GError * error = NULL;
  61.  
  62. GtkWidget * window = NULL;
  63.  
  64. GtkLabel * text = NULL;
  65.  
  66. GtkButton * button = NULL;
  67.  
  68.  
  69. Gtk_init (& argc, & argv );
  70.  
  71.  
  72. // Initialize GtkBuilder and read the UI file (generated by glade)
  73.  
  74. Builder = gtk_builder_new ();
  75.  
  76. Gtk_builder_add_from_file (builder, "helloworld. glade", & error );
  77.  
  78.  
  79. // Automatically associate the signal configured in the UI File
  80.  
  81. Gtk_builder_connect_signals (builder, NULL );
  82.  
  83.  
  84. // Obtain the sub-component by ID
  85.  
  86. Window = GTK_WIDGET (gtk_builder_get_object (builder, "dialog-main "));
  87.  
  88. Text = GTK_LABEL (gtk_builder_get_object (builder, "label-main "));
  89.  
  90. Button = GTK_BUTTON (gtk_builder_get_object (builder, "ButtonSayHello "));
  91.  
  92.  
  93. // Associate the "clicked" event of the SayHello button with the say_hello Function
  94.  
  95. Gtk_signal_connect (GTK_OBJECT (button), "clicked", GTK_SIGNAL_FUNC (say_hello), (gpointer) text );
  96.  
  97.  
  98. // After obtaining the UI object, the GtkBuilder object has no effect and is released
  99.  
  100. G_object_unref (G_OBJECT (builder ));
  101.  
  102.  
  103. // Set the main UI to visible
  104.  
  105. Gtk_widget_show_all (window );
  106.  
  107.  
  108. // The interface is only officially run here
  109.  
  110. Gtk_main ();
  111.  
  112.  
  113. Return 0;
  114.  
  115. }

 

Compilation phase

Type the following command:

 

 

Gcc 'pkg-config -- cflags -- libs gtk +-2.0 '-export-dynamic-o "glade-helloworld" main. c

 

'Pkg-config -- cflags -- libs gtk +-2.0 ': the pkg-config command automatically adds the compilation parameters and link parameters. If you are interested, you can remove the quotation marks on both sides and run it.

-Export-dynamic: uses the dynamic link library method for link. Why? Do not remember that the dynamic link library obtains the function handle through the function name string, so that we can understand that GtkBuilder actually uses this method to associate the function with the event signal.

 

Finally run the program (the helloworld. glade file should be placed in the same directory as glade-helloworld ):

 

 

./Glade-helloworld

 

 

 

 

 

Figure 4 running result Overview

 

END

Author: "be_a_linuxer"

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.