GNOMECcodingHelpDemo-3

Open 'side4linux' and click on 'Project>New Project' in the Main Menue.
Select 'GNOME 'C' GUI Program' as in figure-1 below and click on 'NEXT' in the Dialog Box.
Select the 'PRODUCTS' Product Area in the Product Selection Dialog and click on 'OK' as in figure-2,
Select 'MC-1' from the Product Area selection Combo Box as in figure-3 and click on the 'Next' button,
In the New Project dialog enter the name of 'About' as in figure-4 and click on 'Build'.
Once the Project is Built, close then re-open it to let things settle into place.
'Project>Close Project'
'Project>Open Project'
Double click on the 'PRODUCTS' Product Area,
Double click on the 'MC1' Product,
In the file dialog double click the 'GNOMEC' folder, this takes you to where 'GNOME' visual 'C' language projects are kept.
Double click on 'About', this opens the 'About' project folder.
Double click on 'about.prf', this opens the 'About' project file.
Now open the Glade-3 GUI builder program, 'Edit Project>Edit Project Visuals with Glade-3'
( un-dock the windows and shrink the Main window to about one third screen size )
Double click on the 'mainWindow' widget in the 'Inspector' window to make it appear in the 'Main' window ( figure-5 ).
Notice that the top of the Glade Main window says that we are editing 'about.glade'.
Notice the 'Palette' window from where we 'pick' our visual widgets from ( figure-6 ).
Notice in the 'Properties' window that the 'Name' of the main window widget is set to 'mainWindow' ( figure-7 ),
Now let us add our 'About Box', click on 'Toplevels' in the 'Palette' window and then click on 'About Dialog' ( third from top left )
This should enter the 'aboutdialog1' into our 'Project Box' below the 'Main Window' entry ( figure-8 ),
Click on 'Save' in the Glade Main window to save the 'glade' GUI XML file ( about.glade ).
Now close the Glade-3 GUI Builder program.
Close the newly created project 'Project>Close Project'.
Note that it will be stored in the 'GNOMEC' section of the 'MC-1' Product.

Open the newly created 'About' project 'Project>Open Project' in the IDE.
Note that it will be stored in the 'GNOMEC' section of the 'MC-1' Product.
Let us now add the callback to show the 'About Box',
We will 'run' the Program 'about' in a terminal.
Change workspaces and open a terminal program in the ' ~~ /SIDE/PRODUCTS/MC1/GNOMEC/About/src ' directory,
and run the program ( ./about ) notice the full stop and forward slash to run a program in the current directory to get the following messages ( or similar ),

db@wks1:~/Data/Projects/SIDE/PRODUCTS/MC1/GNOMEC/About/src$ ./about
Trying local 'glade' file
Local 'glade' file found!

(about:8804): libglade-WARNING **: could not find signal handler 'on_save1_activate'.
(about:8804): libglade-WARNING **: could not find signal handler 'on_preferences1_activate'.
(about:8804): libglade-WARNING **: could not find signal handler 'on_quit1_activate'.
(about:8804): libglade-WARNING **: could not find signal handler 'on_cut1_activate'.
(about:8804): libglade-WARNING **: could not find signal handler 'on_about1_activate'.
(about:8804): libglade-WARNING **: could not find signal handler 'on_open1_activate'.
(about:8804): libglade-WARNING **: could not find signal handler 'on_paste1_activate'.
(about:8804): libglade-WARNING **: could not find signal handler 'on_clear1_activate'.
(about:8804): libglade-WARNING **: could not find signal handler 'on_new1_activate'.
(about:8804): libglade-WARNING **: could not find signal handler 'on_save_as1_activate'.
(about:8804): libglade-WARNING **: could not find signal handler 'on_properties1_activate'.
(about:8804): libglade-WARNING **: could not find signal handler 'on_copy1_activate'.

Notice that these are all 'callback signals' that the IDE has set up for you when it built your new project 'About'.
We will note that there needs to be 'signal handler functions' created ( often referred to as 'callback functions' ) to match the callback signals.

You will create two callback handler functions, one to 'show' the About Box and one to 'close' the About Box.
Note you should follow the norm of placing the prototypes into your 'callbacks.h' file as follows,

void on_about1_activate();
void aboutdialog1_response_cb();

followed by the actual functions into 'callbacks.c' as follows,

GtkWidget *aboutPtr=NULL;

void on_about1_activate()
{
char versionString[256];

sprintf(versionString," %s",VERSION);
g_print("fetching About Box\n");
if(aboutPtr == NULL)
aboutPtr = GTK_WIDGET(glade_xml_get_widget(gladeXML,"aboutdialog1"));
gtk_about_dialog_set_version(GTK_ABOUT_DIALOG(aboutPtr),versionString);
gtk_widget_show(aboutPtr);
}
void aboutdialog1_response_cb()
{
gtk_widget_hide(aboutPtr);
g_print("About box close button pressed\n");
}

Open the files in the Notebook of the IDE ( click on 'Open-Txt' Toolbar button ) and cut/paste from above.
Make sure there is at least one blank line below your code so that your 'C' compiler does not complain!
Then click on 'Build'.

Now change to another workspace and in a terminal run the file as above,
you should see your visual Program ( figure-9 ) and the warning messages should no longer refer to 'on_about1_activate'.

Try also to 'show' your 'about box' by clicking on 'Help>About' in your new program ( figure-10 ).
Notice ( in main.c ) that all of the widgets are instantiated in the call to gladeXML = glade_xml_new(cmdString,NULL,NULL);
Notice ( in main.c ) that all of the callback signals are created in the call to glade_xml_signal_autoconnect(gladeXML);
Notice ( in main.c ) 'mainWindow = glade_xml_get_widget(gladeXML,"mainWindow");' to set the pointer to mainWindow.
Notice ( in callbacks.c ) 'aboutPtr = GTK_WIDGET(glade_xml_get_widget(gladeXML,"aboutdialog1"));' to set aboutPtr.
Notice ( in callbacks.c ) 'gtk_about_dialog_set_version(GTK_ABOUT_DIALOG(aboutPtr),versionString);', setting a widget 'Property'.
Notice ( in main.c ) 'g_signal_connect(GTK_OBJECT(mainWindow),"delete_event",G_CALLBACK(gtkQuit),NULL);', manual callback. connection.
Click on the 'Close' button in the 'About Box' (nothing should happen yet!).
Click on 'File>Quit' (nothing should happen yet!).
Click on the 'X' in the top right corner of the About Box to destroy the About Box widget.
Try to re-show the About Box ( it will not appear because it has been destroyed ).

Fig-9

Fig-10

Close the 'about' program window by clicking on the top right 'X'.
Close the newly created project 'Project>Close Project'.
Note that it will be stored in the 'GNOMEC' section of the 'MC-1' Product.

Open the newly created 'About' project 'Project>Open Project'.
Note that it will be stored in the 'GNOMEC' section of the 'MC-1' Product.
Open the Glade-3 GUI Builder program, 'Edit Project>Edit Project Visuals with Glade-3'
Let us now add the callback to 'Close' the 'About Box',
We have already put a callback handler function into callbacks.c so we must set up the 'glade' XML file to include a callback signal with the same name as the handler function.
In Glade-3, in the 'Inspector' window click on the 'aboutdialog1' widget and look at the 'Properties' window, click on the 'Signals' tab,
and add the signal by clicking on 'response <type here>' and selecting 'aboutdialog1_response_cb' ( figure-11 ).
Note: The 'response' signal in this widget is connected to the 'Close' button in the About Box.
Now double click on the 'mainWindow' widget so that we can connect the 'File>Quit' signal.
Double clicking should make the 'mainWindow' active in the Glade-3 Main Window so click on 'mainWindow' widget 'File' then 'File>Quit'.
Look at the 'Properties' window for 'Quit1' in the 'General' tab, click on the 'Signals' tab and notice the signal 'activate <on_quit1_activate>'.
As we already have a quit function in callbacks.c ( void gtkQuit(void); ) we need to add just an 'on_quit1_activate()' function that calls it as follows,

add to callbacks.c

void on_quit1_activate()
{
gtkQuit();
}

also add to callbacks.h

void on_quit1_activate();

Click on 'Save' in the Glade-3 Main window to save the modified about.glade XML file.
Click on the 'Build' toolbar button in the IDE to re-build the 'About' Project.
Now change to another workspace and in a terminal re-run the 'about' file as above,

Try to 'show' your 'about box' by clicking on 'Help>About' in your new program.
Click on the 'Close' button in the 'About Box' ( About Box should be hidden ).
Try to re-show the About Box ( it should re-appear because it has been hidden previously but not destroyed ).
Click on 'File>Quit' ( the program should close also closing the About Box ).

To end the Practical we cannot have Users clicking the 'X' in the top right corner of the About Box widget ( figure-10 ) as it will destroy it such that it will not show later. So in the Glade-3 program click on the 'aboutdialog1' widget entry in the 'Inspector' window and in the 'Properties' window, in the 'General' tag, change the 'Deletable' property of the widget to 'No' ( figure-12 ),
Also erase the 'Program name' property which currently says 'Glade' so that the line is empty of all characters and spaces.
Now try running the program again after you have clicked on 'Save' in Glade-3 and clicked on the 'Build' button, to see if the little cross has gone away! ( figure-13 )

Finally we can alter the Project Version String to show that we have updated the Project, 'Project>Edit Project>Edit Project Properties'.
Set the Project to Version '0.0.2' in the Dialog Box and click on 'Apply' ( figure-14 ).

Now try running the program again after you have clicked on the 'Build' button. ( figure-15 )

Fig-1	Fig-2
Fig-3	Fig-4
Fig-5	Fig-6
Fig-7	Fig-8

Fig-11	Fig-12
Fig-13	Fig-14
Fig-15