Learn graphical interface programming, the first level you have to be familiar with the use of controls, quickly master the use of controls, the layout of the initiator is the most urgent requirement, this article is interested in using GTK 2.0 development graphical interface applications in Linux. Scholars and friends pointed out this way
GTK (GIMP Toolkit) is a cross-platform graphical interface (GUI) development tool, is one of the more common graphical interface development tools in the Linux operating system, which uses a very distinctive object-oriented C language development framework (C Framework), applying it to develop a beautiful graphics interface application in the X Window environment of the Linux system platform. Directly use GTK development applications must use C / C language, so you must have a certain C language basis, and it is best to develop applications with C language.
GTK 2.0 is a graphic foundation for the GNOME2 desktop environment, which is part of the GNU project, which is distributed by the LGPL terms. It was officially released in March 2002, the most stable version is 2.0.6, the latest version 2.1.0 is developing testing process, you can go to ftp://ftp.gtk.org/pub/gtk/v2.1 download Its source code.
Classification of controls
The controls in GTK actually use the C language to the simple package of the controls in the X Window system. In GTK , the control can be substantially divided into two categories, namely:
Container control non-container control non-container control
Non-container controls in GTK include the most basic elements such as text tags, images, single-line input, and other graphical interfaces. Here is a simple sample code:
GTKWIDGET * LABEL; gtkwidget * device; gtkwidget * Entry;
Label = gtk_label_new ("this is a test label"); / * Create a text tag control * /
Image = gtk_image_new_from_file ("image.png"); / * Create an image control, specify the image name to display * /
Entry = gtk_entry_new (); / * Create a single line input control * /
Container control
In GTK , in addition to non-container controls, all other controls are container controls. All containers are based on GTKCONTAINER objects, which are divided into two categories: only a control container and containers that can accommodate multiple controls.
Can only accommodate a container of a control
Containers that can only accommodate a control are based on GTKBIN objects, including:
Control window class (GtkWindow, GtkDialog, GtkMessageDialog, mainly various windows and dialog boxes) scrolling window (GtkScrolledWindow) type of control frame (GtkFrame, GtkAspectFrame) viewport (GtkViewport) various buttons (GtkButton, GtkToggleButton) floating window (GtkHandleBox) The characteristics of these controls such as gtkeventbox can only accommodate a child control. To accommodate multiple sub-controls, you must add a container that can accommodate multiple controls, and then add controls to this container.
Container that can accommodate multiple controls
Containers that can accommodate multiple controls can be divided into two modes: one is only the order of the sub-control can be set, and the container of the sub-control geometry is not set; the other is the geometry of the subsidiary Position of the container. Unable to set a container of a child control geometry
Only the order of the sub-control can be set, and the container of the sub-control geometry is not set, which is the most commonly used container control in GTK , which includes the following categories:
It can only accommodate a line or a sub-control container-box-shaped container (gtkbox), which is divided into two transverse cassette containers (gtkhbox) and longitudinal cassette containers (gtkvbox); subclass of box-shaped containers - button box (GtkbuttonBox), also divided into a horizontal button box (gtkhbuttonbox); gtkvbuttonbox; container capable of accommodating multi-column protocols; container capable of controlling the size of the child control - separation Panel (GTKPaned), which is also divided into a lateral separator panel (gtkvpaned); can display multiple sub-control containers - multi-page display controls (GTKNOTEBOOK), which also include menu bars, tool bars, listings Controls, etc., they are actually the flexibility of the above container controls, this tutorial does not make a detailed introduction
Can set the container of the sub-control geometry
The container that can be set to the Sub-control geometry is similar to the FORM control in Windows programming, mainly including two:
Free Layout Control (gtkfixed) - Container layout control (gtklayout) with fixed coordinates - is an infinity scroll area, which can contain sub-controls, or custom drawing or higher classification lists all common use of GTK . The basic situation of container controls, contains most of the GTK controls. The container in the GTK can also contain a container, which creates a complex application interface to make it very easy, and make it difficult to create a graphical interface in Linux.
Layout skills
Use a box-shaped container
The box-like container is the most commonly used container control in the layout, which can place a series of sub-controls into a specific rectangular area, or a row or a column, the child control has the same width or height; The height of the sub-control in the lateral cassette container is consistent, while the width of the sub-control in the longitudinal cassette container is consistent.
The box-like container introduces the concept of "emissions", refers to the starting position of the sub-control sequence in the box-shaped container. From the front or backward, for the lateral box-shaped container is from left to right For the longitudinal cassette container, from top to bottom, the function gtk_box_pack_start represents the previously arranged sub-control, and the function gtk_box_pack_end represents the backward arrangement of sub-controls, or both, but also set the container when aligned. The pitch of the neutron control (in pixels), whether it is expandable, is filled with the entire container space, etc .; it can also be used to set the border width of the container with a function gtk_container_set_border_width.
The following code creates a simple lateral box-shaped container, and the results are shown in the figure:
box = gtk_hbox_new (FALSE, 0); button1 = gtk_button_new_with_label ( "button a"); gtk_box_pack_start (GTK_BOX (box), button1, FALSE, FALSE, 3); button2 = gtk_button_new_with_label ( "button two"); gtk_box_pack_start (GTK_BOX (box ), button2, FALSE, FALSE, 3); button3 = gtk_button_new_with_label ( "button for three"); gtk_box_pack_start (GTK_BOX (box), button3, TRUE, TRUE, 3); button4 = gtk_button_new_with_label ( "button four"); gtk_box_pack_start (GTK_BOX (Box), Button4, False, False, 3); button one
Second, III, set its scalable attribute as false, cannot change the size with the change of the window, and the scalable attribute of the button three is set to True, so the size can be changed, so the button is three times when the window is pulled It turned away and saw such an effect picture. Also we can use gtk_vbox_new (false, 0); function to create a longitudinal cassette container.
Use button box
The button box is a subclass of a cassette container, so it has all the functions of the box-shaped container, and has its own characteristics, such as setting a sub-control arrangement. The following code creates a simple buttons box, the results are shown in the figure:
bbox = gtk_hbutton_box_new (); gtk_box_set_spacing (GTK_BOX (bbox), 5); / * This code control sub-set button box gap * / gtk_button_box_set_layout (GTK_BUTTON_BOX (bbox), GTK_BUTTONBOX_END); / * This code setting button box sub control arrangement * / button1 = gtk_button_new_with_label ( "press"); gtk_box_pack_start (GTK_BOX (bbox), button1, FALSE, FALSE, 0); button2 = gtk_button_new_with_label ( "button"); gtk_box_pack_start (GTK_BOX (bbox), button2, FALSE, False, 0); Button3 = gtk_button_new_with_label ("box"); gtk_box_pack_start (gtk_box (bbox), Button3, False, False, 0);
With a cassette
As in the button box, the button box is used to use the gtk_box_pack_ * series function. In the code, we set the spacing of the sub-control in the button box to 5 pixels, set the attribute of the button box to gtk_buttonbox_end, ie the alignment of the sub-control is the end. Align (leaning against the lower left or longitudinal to the horizontal), this effect is seen. You can also use the GTK_VBUTTON_BOX_NEW function to create a portrait button box.
Create buttons with images and texts using the box-shaped container
The button is a container that can only accommodate a control, and we add a box-like container, add images and buttons to the cassette container to form a button with images and text. This is why the window is a container that can only accommodate a control, but it has accomplisted a lot of controls, and the other such containers are true. The following code creates a button with an image and tag (image on the left, text on the right), change the emission order of the image and text, or creates the other three forms of buttons after the back longitudinal cassette, the effect can be created. The show: (After reading this code, I believe that you will never be worried about the button with the image) image = gtk_image_new_from_stock (gtk_stock_help, gtk_icon_size_menu); label = gtk_label_new ("Buttons"); Box = GTK_HBOX_NEW (False) , 0); GTK_BOX_PACK_START (GTK_BOX (Box), Image, False, False, 2); GTK_BOX_PACK_START (GTK_BOX (Box), Label, False, False, 2); Button = gtk_button_new (); / * Create button * / gtk_container_add ( GTK_CONTAINER (Button), Box); / * Add a box-shaped container to the button * /
Use scrolling windows
The following code creates a scrolling window and joining a vertical cassette container with three buttons, as shown in the figure:
swin = gtk_scrolled_window_new (NULL, NULL); gtk_scrolled_window_set_policy (GTK_SCROLLED_WINDOW (swin), GTK_POLICY_AUTOMATIC, GTK_POLICY_AUTOMATIC); vbox = gtk_vbox_new (FALSE, 0); gtk_container_set_border_width (GTK_CONTAINER (vbox), 10); gtk_scrolled_window_add_with_viewport (GTK_SCROLLED_WINDOW (swin), vbox); button1 = gtk_button_new_with_label ( "test button a"); gtk_box_pack_start (GTK_BOX (vbox), button1, FALSE, FALSE, 5); button2 = gtk_button_new_with_label ( "test button two"); gtk_box_pack_start (GTK_BOX (vbox), button2, FALSE, FALSE , 5); Button3 = gtk_button_new_with_label ("test button three"); gtk_box_pa_start (GTK_BOX (VBOX), Button3, False, False, 5);
Function G
TK_SCROLLED_WINDOW_SET_POLICY to set the scroll mode of the scroll window, that is, the lateral scroll bar or a longitudinal scroll bar appears, where gtk_policy_automatic is automatically appearing. If the child control has scrolling properties, we can also use the function gtk_containe_add to add a sub-control to the scroll window, such as the commonly used text editing control gtktextView can be added directly to the scroll window, which will automatically have a scroll bar.
Use a grid container (1)
The grid container can accommodate multi-line or multi-column controls, which can specify the number of rows, columns, and sub-controls to be expanded when creating a grid container. The sub-control in the grid container can take up a plurality of or lateral or longitudinal continuous container space. The grid container is the origin (0, 0) of the sub-control, the left corner of the coordinate, so it is necessary to design the position of the child control, and its coordinates The expression of space is (x1, x2, y1, y2), readers must pay attention. The following code also created a 3-row of 3 columns of a grid container, but we only arranged three buttons, so that the spacespace spaced were different, as shown in the figure: Table = GTK_TABLE_NEW (3, 3 , TRUE); button1 = gtk_button_new_with_label ( "one button"); gtk_table_attach (GTK_TABLE (table), button1,0,1,0,3, GTK_FILL, GTK_FILL, 0,0); button2 = gtk_button_new_with_label ( "button two"); GTK_TABLE_ATTACH_DEFAULTS (GTK_TABLE (TABLE), Button2, 1, 3, 0, 1); Button3 = gtk_button_new_with_label ("Buttons Three"); gtk_table_attach_defaults (gtk_table (table), Button3, 1, 3, 1, 3);
Use a grid container (2)
The above code is too cumbersome, if the child control only occupies a container space, there is a simpler way. The following code creates a 3-row of 3 columns of a grid container, and uniformly arranges 9 buttons, the effect is shown in the figure:
Table = gtk_table_new (3, 3, true); for (i = 0; i <3; i ) for (j = 0; j <3; j ) {buttonx = gtk_button_new_with_label ("x"); gtk_table_attach_defaults (gtk_table (table ), Buttonx, I, I 1, J, J 1);
Use the separator panel
The separator panel only provides two container space, which means that only two sub-controls can only be accommodated in the separated panel, and add sub-controls in it with function gtk_paned_add1 and gtk_paned_add2, where the first space corresponds to the left side of the lateral separator panel. The vertical partition panel is the upper portion of the panel, and the other is the second container space. The characteristic of the separator panel is a partition in the container, which can adjust the size of the sub-control at runtime. The following code creates three separated panel controls to divide the window into four areas, we can put the mouse to the separator. After the mouse type changes, press the mouse free to change the size of each sub-control, as shown in the figure:
paned1 = gtk_vpaned_new (); paned2 = gtk_hpaned_new (); gtk_paned_add1 (GTK_PANED (paned1), paned2); button1 = gtk_button_new_with_label ( "button a"); gtk_paned_add2 (GTK_PANED (paned1), button1); button2 = gtk_button_new_with_label ( "button two" ); gtk_paned_add1 (GTK_PANED (paned2), button2); paned3 = gtk_vpaned_new (); gtk_paned_add2 (GTK_PANED (paned2), paned3); button3 = gtk_button_new_with_label ( "button for three"); gtk_paned_add1 (GTK_PANED (paned3), button3); button4 = GTK_BUTTON_NEW_WITH_LABEL ("Button 4"); gtk_paned_add2 (gtk_paned (paned3), button4); use multiple page display
Page Display Controls There are multiple controls in the interface to occupy the same container space, which can be used to add a function such as gtk_notebook_append_page to add a display page to the paging display control, and the display page can be a separate control, or a more A container of a child control. The following code created a simple paging display layout with three display pages, as shown in the figure:
Notebook = gtk_notebook_new (); label1 = gtk_label_new ("This is the first page / N displayed content."); gtk_notebook_append_page (gtk_notebook (Notebook), label1, null; label2 = gtk_label_new ("This is the second page / N display content. "); gtk_notebook_append_page (GTK_NOTEBOOK (notebook), label2, NULL); label3 = gtk_label_new (" this is the third page of the content / n display ");. gtk_notebook_append_page (GTK_NOTEBOOK (notebook), label3, NULL);
In GTK mid-range display control, it is very powerful. If you can add images in the title, you can scroll through the display, you can display the right-click menu, etc., you can find its test code in the TestGtk.c file in the Tests directory of the GTK source code.
Free layout
A plurality of child controls can be added in the free layout control, which is fixed to the location of the control with the coordinates, which is similar to the FORM control in Windows programming. The following code creates a simple free layout control, which set three buttons to different locations, as shown in the figure:
fixed = gtk_fixed_new (); gtk_widget_set_usize (fixed, 150,150); button1 = gtk_button_new_with_label ( "one button"); gtk_fixed_put (GTK_FIXED (fixed), button1,5,5); button2 = gtk_button_new_with_label ( "button two"); gtk_fixed_put (GTK_FIXED (Fixed), Button2, 55, 55; Button3 = gtk_button_new_with_label ("button three"); gtk_fixed_put (gtk_fixed (fixed), button3, 105, 105); can also use function GTK_FIXED_MOVE functions to move the child control in the free layout container, It can dynamically change the position of the child control.
Gtklayout and gtkfixed
Gtkfixed in the previous section is fully feasible after gtklayout, and the operation is the same, this does not mean that gtklayout and gtkfixed are the same control, better description is GtkLayout has GTKFixed all functions. They are:
Gtklayout has scrolling properties, theoretically, gtkfixed does not have scrolling properties, and uses the sub-control in GtkLayout when used, can customize the drawing, and the subcreen in gtkfix is not, from this At this point, GTKLayout is more like a gtkdrawingArea control, and there is still a lot of defects in gtkfixed. GTK developers remind users to pay attention to the reference.
All source code for this tutorial can be downloaded here. To learn more GTK knowledge, you can go to the GTK website. For the function, you can see the GTK API Reference Manual GTK Development Guide is a must read for beginners. You can also find it in the fast development tool version on the China Linux Forum. More articles about GTK in Chinese translation. About author
Song Guowei, rural primary school English teacher, he is the author of the book "GTK 2.0 Programming Example" (Tsinghua University Press) Book author, our spare time is committed to developing Linux GUI applications with GTK , can via email address GWSONG_52@sohu.com Contact him.
