blogs.czapski.id.au

In this article I explore the gtkdialog Notebook object, its attributes and actions, through increasingly more sophisticated examples. In passing, other gtkdialog objects are used without much elaboration.

This is the next article in a series of articles on gtkdialog, “gtkdialog Exploration – articles and examples”, which can be found at https://blogs.czapski.id.au/2017/04/gtkdialog-exploration.

gtkdialog, based as it is on the GTK object model, leverages the GTK object hierarchy. Consider the reference for the Notebook object at http://01micko.com/reference/notebook.html.

The very first link points to a GtkNotebook – https://developer.gnome.org/gtk2/2.24/GtkNotebook.html.

In the GTK object hierarchy, https://developer.gnome.org/gtk2/2.24/GtkNotebook.html#GtkNotebook.object-hierarchy, the Notebook object is some levels below the GObject, the topmost object.

As briefly discussed in the previous article the GtkNotebook, and consequently the gtkdialog Notebook object inherit, as I understand it, from the objects higher up in the hierarchy. This will come into play when we explore attributes that can be set for a Notebook, and actions that can be configured for a Notebook.

Pre-Requisites

This article assumes that the Virtual Box Machine Image created in accordance with the instructions in the blog article to be found at https://blogs.czapski.id.au/2016/10/configure-virtual-box-virtual-machine-and-install-centos-6-8-base-image is available but it is expected that pretty much any Linux environment will do just as well so long as it supports yad and gtkdialog. For convenience I posted the export of the VirtualBox image which would have been built if the reader followed all the articles in the series “Build a Linux-based Infrastructure Solution Demonstration Series” to date, that is to the 8th of March 2017. The link to the main article is https://blogs.czapski.id.au/2017/04/virtualbox-image-with-content-as-built-so-far.

It also assumes that yad and gtkdialog are installed, as discussed in the article “Install yad and gtkdialog” (https://blogs.czapski.id.au/2017/04/gtkdialog-for-rapid-prototyping-of-linux-applications-install-gtkialog-and-yad)

Notebook Attributes

The gtkdialog Notebook object is a visible container of a sort. Its purpose it to provide a tabbed container for collections of other  objects.

An example of a tabbed interface, which uses the Notebook object and which will be developed in this article, is shown here as a bit of a teaser.

Reference documentation for the gtkdialog Notebook object, http://01micko.com/reference/notebook.html, provides a table of attributes specific to this gtkdialog object and makes a reference to ancestor class properties.

Attributes that can be configured for the notebook widget are defined in the widget’s reference page see https://developer.gnome.org/gtk2/2.24/GtkNotebook.html, section Properties – https://developer.gnome.org/gtk2/2.24/GtkNotebook.html#GtkNotebook.properties

Some of them are useful and some of them are not, as far as I am concerned or can empirically determine. Changing values of some of them does not have visible consequences.

Not all attributes/properties are recognised and acted upon by  gtkdialog. Some of the properties are inherited from the parent objects, like GtkContainer and GtkWidget. For example, border-width, which defines the amount of space between the notebook frame and the notebook content, is inherited from the GtkContainer.

Similarly, sensitive property is inherited from the GtkWidget and when set to false effectively disables everything inside the notebook container.

See the reference page: file:///home/demo/gtkdialog-0.8.3/doc/reference/notebook.html

To work out what attributes are actually supported, in this case by the notebook widget, we need to do some exploration. Discussion below goes into this to an extent and I provided most of the useful attributes that can be set, both from GtkWindow itself and inherited from GtkContainer and GtkWidget. The “Works?” column indicates whether the attribute has a visible effect (Y), does not have a visible effect (N) or I have not figured out a way to test whether it works or not.

The table below summarised Notebook attributes/properties and indicates which work with the gtkdialog and which do not as far as I can tell. “Do not” may well be a function of me not seeing any visible difference with the property set to different values. Some ancestor attributes/properties which are not really useable from gtkdialog are omitted.

The following example includes just about every attribute that can be defined for a Notebook object. Experiment with the various settings to see what you can see.

First, let’s create an enumerations script which will supply human-readable versions of enumerations and other numeric constants that may be used in the scripts I show. See https://github.com/GNOME/gtk/blob/master/gdk/gdktypes.h, and elsewhere, for sources of these enumerations.

mkdir -pv /tmp/scripts
cd /tmp/scripts
cat <<-'EOSOURCE' > gtkdialog.constants
# gtkdialog.constants
#
cstVersion=1.0.0
echo "Loading ${BASH_SOURCE[0]} version ${cstVersion} ..." 1>&2

# I prefer symbolic constants to numeric literals so I defined a bunch
# see https://github.com/GNOME/gtk/blob/master/gdk/gdktypes.h for specifics
#
BTN_IMG_POS_LEFT=0
BTN_IMG_POS_RIGHT=1
BTN_IMG_POS_ABOVE=2
BTN_IMG_POS_BELOW=3
WIN_ICON=access
WIN_DECORATED=true
WIN_RESIZABLE=true
GTK_WIN_POS_CENTER=1
GTK_WIN_POS_MOUSE=2
WIN_POS=${GTK_WIN_POS_CENTER}
WIN_SKIP_TASKBAR_HINT=false
WIN_ALLOW_GROW=true
XALIGN_LEFT=0
XALIGN_RIGHT=1
XALIGN_CENTRE=0.5
YALIGN_TOP=0
YALIGN_BOTTOM=1
YALIGN_CENTRE=0.5
VSCROLLBAR_ALWAYS=0
VSCROLLBAR_AUTOMATIC=1
VSCROLLBAR_NEVER=2
HSCROLLBAR_ALWAYS=0
HSCROLLBAR_AUTOMATIC=1
HSCROLLBAR_NEVER=2
GTK_JUSTIFY_LEFT=0
GTK_JUSTIFY_RIGHT=1
GTK_JUSTIFY_CENTRE=2
TREE_SELECTION_MODE_NONE=0
TREE_SELECTION_MODE_SINGLE=1
TREE_SELECTION_MODE_BROWSE=2
TREE_SELECTION_MODE_MULTIPLE=3
TAB_POS_LEFT=0
TAB_POS_RIGHT=1
TAB_POS_ABOVE=2
TAB_POS_BELOW=3

EOSOURCE

To create and exercise the first example execute the following commands, noting that you will need to copy and paste the code into an editor window because it is too large for a copy/paste as a “here document”. Explore the effects of changing the various attributes of the Notebook object.

mkdir -pv /tmp/scripts
cd /tmp/scripts
> ex30.sh
chmod ug+x ex30.sh

geany ex30.sh & # copy and paste the code blow until ## EOSOURCE
#!/bin/bash

# make directory for temporary files and have it and the content blown away at exit
#
export LOCAL_DATA_DIR="/dev/shm/$(basename ${0})"
mkdir -p ${LOCAL_DATA_DIR}

fnHlrRemoveTmporaryFilesOnExit() {
    mkdir -p ${LOCAL_DATA_DIR}
    rm -R -f ${LOCAL_DATA_DIR}
}
trap fnHlrRemoveTmporaryFilesOnExit 0 # clean up after any program end.

# name temporary files and place them in the directory which will get deleted on termination of the script (most of the time)
export MAIN_DIALOG_FILE="${LOCAL_DATA_DIR}/MAIN_DIALOG_FILE_${USER}_${BASHPID}.gtkdialog"

##====================================================
[ -z ${GTKDIALOG:-} ] && GTKDIALOG=gtkdialog

# load symbolic constants I use instead of numeric values
source $(dirname ${0})/gtkdialog.constants

# set initial notebook page
echo 1 > ${LOCAL_DATA_DIR}/NOTEBOOK_PAGE

# window title
WIN_TITLE="XDS.b Registry Browser"

# Size of the notebook and all content panels
#
_HEIGHT_REQUEST=375
_WIDTH_REQUEST=570

# construct UI
cat <<-EODECK > ${MAIN_DIALOG_FILE}
<window title="${WIN_TITLE}" icon-name="${WIN_ICON}" decorated="${WIN_DECORATED}" resizable="${WIN_RESIZABLE}"
        window_position="${WIN_POS}" skip_taskbar_hint="${WIN_SKIP_TASKBAR_HINT}" allow-grow="${WIN_ALLOW_GROW}"
        auto-refresh="true" name="win0">
    <vbox>

        <hbox homogeneous="true" sensitive="true" visible="true">

                $(: begin Notebook definition )
                <notebook 
                    height-request="${_HEIGHT_REQUEST}"
                    width-request="${_WIDTH_REQUEST}"
                    tab-labels="Requests|Patients|Settings" xx-tab-labels="which will be shown on tabs"
                    page="1" xx-page="0 based tab number which will be initially shown"
                    enable-popup="true" xx-enable-popup="right-click will bring a list of tabs to select from"
                    show-border="true" xx-show-border="does not seem to do anything visible"
                    tab-border="2" xx-tab-border="how much space around text of tab label"
                    tab-hborder="2" xx-tab-hborder="how much space to the left and right of the tab label text"
                    tab-vborder="2" xx-tab-vborder="how much space to above and below the tab label text"
                    show-tabs="true" xx-show-tabs="as the name says - if false only the content of the 'page=x' tab will show"
                    homogeneous="true" xx-homogeneous="make the width of tabs the same"
                    space-fill="true"
                    space-expand="true"
                    scrollable="false" xx-scrollable="if notebook container width less than the width of all tabs adds left/right arrows to navigate between tabs"
                    tab-pos="${TAB_POS_ABOVE}"
                    border-width="0"
                    sensitive="true"
                    tooltip-markup="<span size='small'>This is an example of a <b>Notebook</b></span>"
                    has-tooltip="true"
                    visible="true"
                    >

$(: TAB 1 ------------------------------------)
                    <vbox xx-notbook-tab="Tab 1">
                        <vbox spacing="2">
                            <text><label>Requests Panels Go Here</label></text>
                        </vbox>
                    </vbox> $(: end-notbook-tab="Tab 1" )

$(: TAB 2 -----------------------------------)
                    <vbox xx-notbook-tab="Tab 2">
                        <vbox spacing="2">
                            <text><label>Patient Panels Go Here</label></text>
                        </vbox>
                    </vbox> $(: end-notbook-tab="Tab 2" )

$(: TAB 3 ------------------------------------)
                    <vbox xx-notbook-tab="Tab 3">
                        <vbox>
                            <text><label>Settings Panels Go Here</label></text>
                        </vbox>
                    </vbox> $(: end-notbook-tab="Tab 3" )

$(: End of tab content definitions -----------)

                </notebook>

        </hbox> $(: end Notebook definition )

$(: Common object - shown below the notebook --)

        <hbox>
            <button width-request="100" homogenous="true" image-position="${BTN_IMG_POS_LEFT}" use-underline="true" 
              can-default="true" xx-info="has-default must have can-default"
              has-default="true" xx-info="has-default and can-default must both be true for default to work"
              >
                <label> _Quit </label>
                <input file icon="gtk-quit"></input>
                <width>16</width>
                <action function="exit">QUIT</action>
            </button>
        </hbox>
    </vbox>

    <action this-is-window="escape" signal="key-press-event" condition="command_is_true( [[ \$KEY_RAW = 0x9 ]] && echo true )">EXIT:exit</action>
</window>
EODECK

# -- run the UI -----------------------------------------------------------------------------------------------

case ${1:-} in
    -d | --dump) more "${MAIN_DIALOG_FILE}" ;;
    -f | --file) $GTKDIALOG --center --file=${MAIN_DIALOG_FILE} ;;
    -v | --variable) export MAIN_DIALOG=$(cat ${MAIN_DIALOG_FILE}); $GTKDIALOG --center --program=MAIN_DIALOG ;;
    *) $GTKDIALOG --file=${MAIN_DIALOG_FILE} ;;
esac
## EOSOURCE

/tmp/scripts/ex30.sh

Exercising this example unmodified presents the following initial screen:

Changing the following attributes to the following values will produce a somewhat different UI:

page="0" xx-page="0 based tab number which will be initially shown"
tab-hborder="12" xx-tab-hborder="how much space to the left and right of the tab label text"
tab-pos="${TAB_POS_LEFT}"
border-width="10"

Note that the right-click list of tab names, which can be used for navigation between the tabs just as clicking on the tabs can, is enabled by setting the enable-popup attribute to true.

page=”0″ causes the first tab to be the tab shown by default.

tab-border=”12″ adds space on either side of the label text.

tab-pos determines where the tabs will be shown. The enumeration is:

TAB_POS_LEFT=0
TAB_POS_RIGHT=1
TAB_POS_ABOVE=2
TAB_POS_BELOW=3

border-width adds whitespace on all sides of the notebook.

Explore other values of the various attributes and see what you can see.

Click the tabs, hover the mouse over the area of the notebook to see the tooltip, etc..

Showing and Hiding Notebook Tabs

The example in the previous section showed a pretty ordinary use of the Notebook. More sophisticated applications can be created by for example hiding notebook tabs until they are needed, showing them on demand and hiding them again when not required.

This example explores exactly this use case but it also shows how the “last visible tab” can be “remembered” and activated when the visible-on-demand tab is hidden again.

The example uses variables associated with the various objects like hbox, vbox, notebook and button to manipulate their associated objects dynamically to accomplish the desired effects.

The following screenshots show the various states of this application to illustrate what is expected.

This is the initial state of the application.

Clicking the cogwheel button will show the Settings tab, which is initially invisible.

Clicking the cogwheel button again hides the Settings tab and makes the tab which was active before the button was clicked and the settings tab was shown and activated, active again.

Recreate the application and convince yourself that this is indeed how the application behaves.

The source code and commands to recreate the example are shown below. Specific techniques will be discussed following the example code.

mkdir -pv /tmp/scripts
cd /tmp/scripts
> ex31.sh
chmod ug+x ex31.sh

geany ex31.sh & # copy and paste the code blow until ## EOSOURCE
#!/bin/bash

# make directory for temporary files and have it and the content blown away at exit
#
export LOCAL_DATA_DIR="/dev/shm/$(basename ${0})"
mkdir -p ${LOCAL_DATA_DIR}

fnHlrRemoveTmporaryFilesOnExit() {
    mkdir -p ${LOCAL_DATA_DIR}
    rm -R -f ${LOCAL_DATA_DIR}
}
trap fnHlrRemoveTmporaryFilesOnExit 0 # clean up after any program end.

# name temporary files and place them in the directory which will get deleted on termination of the script (most of the time)
export MAIN_DIALOG_FILE="${LOCAL_DATA_DIR}/MAIN_DIALOG_FILE_${USER}_${BASHPID}.gtkdialog"

##====================================================
[ -z ${GTKDIALOG:-} ] && GTKDIALOG=gtkdialog

# load symbolic constants I use instead of numeric values
source $(dirname ${0})/gtkdialog.constants

WIN_TITLE="XDS.b Registry Browser"

# set initial notebook page - this determines which tab is initially shown
echo 0 > ${LOCAL_DATA_DIR}/NOTEBOOK_PAGE

# Common size of all notebook content panels
#
_HEIGHT_REQUEST=375
_WIDTH_REQUEST=570

# construct UI
cat <<-EODECK > ${MAIN_DIALOG_FILE}
<window title="${WIN_TITLE}" icon-name="${WIN_ICON}" decorated="${WIN_DECORATED}" resizable="${WIN_RESIZABLE}" 
        window_position="${WIN_POS}" skip_taskbar_hint="${WIN_SKIP_TASKBAR_HINT}" allow-grow="${WIN_ALLOW_GROW}" 
        auto-refresh="true" name="win0">
    <vbox>

        <hbox homogeneous="true" sensitive="true" visible="true"> $(: begin Notebook container definition )

                 <notebook $(: begin notebook definition )
                    height-request="${_HEIGHT_REQUEST}"
                    width-request="${_WIDTH_REQUEST}"
                    tab-labels="Requests|Patients|Settings" xx-tab-labels="which will be shown on tabs"
                    page="1" xx-page="0 based tab number which will be initially shown"
                    enable-popup="true" xx-enable-popup="right-click will bring a list of tabs to select from"
                    show-border="true" xx-show-border="does not seem to do anything visible"
                    tab-border="2" xx-tab-border="how much space around text of tab label"
                    tab-hborder="2" xx-tab-hborder="how much space to the left and right of the tab label text"
                    tab-vborder="2" xx-tab-vborder="how much space to above and below the tab label text"
                    show-tabs="true" xx-show-tabs="as the name says - if false only the content of the 'page=x' tab will show"
                    homogeneous="true" xx-homogeneous="make the width of tabs the same"
                    space-fill="true"
                    space-expand="true"
                    scrollable="false" xx-scrollable="if notebook container width less than the width of all tabs adds left/right arrows to navigate between tabs"
                    tab-pos="${TAB_POS_ABOVE}"
                    border-width="0"
                    sensitive="true"
                    tooltip-markup="<span size='small'>This is an example of a <b>Notebook</b></span>"
                    has-tooltip="true"
                    visible="true"
                    >

$(: TAB 1 ------------------------------------)
                    <vbox xx-notbook-tab="Tab 1">
                        <vbox spacing="2">
                            <text><label>Requests Panels Go Here</label></text>
                        </vbox>
                    </vbox> $(: end-notbook-tab="Tab 1" )

$(: TAB 2 -----------------------------------)
                    <vbox xx-notbook-tab="Tab 2">
                        <vbox spacing="2">
                            <text><label>Patient Panels Go Here</label></text>
                        </vbox>
                    </vbox> $(: end-notbook-tab="Tab 2" )

$(: TAB 3 ------------------------------------)
                    $(: make this tab initially invisible by setting visible="false")
                    <vbox xx-notbook-tab="Tab 3" visible="false">
                        <vbox>
                            <text><label>Settings Panels Go Here</label></text>
                        </vbox>
                        $(: Variable name of the vbox/tab. )
                        $(: It is used to explicitly show/hide the vbox and its content )
                        <variable>vTab3</variable>
                    </vbox> $(: end-notbook-tab="Tab 3" )

$(: End of tab content definitions -----------)

                    <sensitive>true</sensitive>
                    $(: variable name of the notebook and all it contains )
                    $(: used to explicitly manage the notebook - like refreshing it )
                    <variable>vNotebook</variable>
                    $(: which tab to show when the control is first created and page=x attribute is not set )
                    $(: which tab to show when the control is refreshed )
                    <input file>${LOCAL_DATA_DIR}/NOTEBOOK_PAGE</input>
                    $(: save the tab number when tabs are switched )
                    $(: used to resore the "last seen tab" when showing/hiding the settings tab )
                    <output file>${LOCAL_DATA_DIR}/NOTEBOOK_PAGE_OUT</output>
                    <action signal="focus-out-event" x-save-last-tab-number-in="output file">save:vNotebook</action>
                </notebook> $(: end Notebook definition )

$(: End Notebook definition -------------------)

        </hbox> $(: end Notebook container definition )
 
$(: Common object - shown below the notebook --)

        <hbox>

            $(: invisible entry for persisting the state of the toggle )
            $(: fnToggleSettingsTab toggles the value )
            <entry visible="false">
                <default>false</default>
                <variable>vSettingsToggle</variable>
                <input>fnToggleSettingsTab</input>
            </entry>
            $(: button which toggles between displying and hiding the settings tab )
            <button width-request="35" homogenous="true" image-position="0" use-underline="true"
              tooltip-text="Configure URLs and Credentials">
                <input file icon="ibus-setup"></input>
                <width>16</width>
                <variable>vSettingsButton</variable>
                $(: set toggle to opposite settings )
                <action>refresh:vSettingsToggle</action> 
                $(: hide the settings tab and restore the "last tab" value so that the tab shown before the button is clicked )
                $(: is shown when the settings tab is hidden )
                <action condition="command_is_false(echo \$vSettingsToggle)">hide:vTab3</action>
                <action condition="command_is_false(echo \$vSettingsToggle)">cp ${LOCAL_DATA_DIR}/NOTEBOOK_PAGE_OUT ${LOCAL_DATA_DIR}/NOTEBOOK_PAGE</action> 
                $(: show the settings tab and save the "last tab" value so that the tab shown when the button is clicked )
                $(: is shown whent he settings are hidden again )
                <action condition="command_is_true(echo \$vSettingsToggle)">show:vTab3</action>
                <action condition="command_is_true(echo \$vSettingsToggle)">echo 2 > ${LOCAL_DATA_DIR}/NOTEBOOK_PAGE</action> 
                $(: cause the changes to be reflected in the UI )
                <action>refresh:vNotebook</action>
            </button>

            <button width-request="100" 
              homogenous="true" 
              image-position="${BTN_IMG_POS_LEFT}"
              use-underline="true"
              can-default="true" xx-info="has-default must have can-default"
              has-default="true" xx-info="has-default and can-default must both be true for default to work"
              >
                <label> _Quit </label>
                <input file icon="gtk-quit"></input>
                <width>16</width>
                <action function="exit">QUIT</action>
            </button>
        </hbox>
    </vbox>

    <action this-is-window="escape" signal="key-press-event" condition="command_is_true( [[ \$KEY_RAW = 0x9 ]] && echo true )">EXIT:exit</action>
</window>
EODECK

# -- Post UI Assembly Functions - used from UI after it is assembled ------------------------------------
#
# --------------------
# fnToggleSettingsTab - flips settings toggle
# controls whether the settings tab is visible or hidden 
# switches value of the entry to which it is hooked between true and false each time it is invoked
#
fnToggleSettingsTab() {
    [[ "${vSettingsToggle}" == "true" ]] && echo "false" || echo "true"
}
export -f fnToggleSettingsTab

# -- run the UI -----------------------------------------------------------------------------------------------
case ${1:-} in
    -d | --dump) more "${MAIN_DIALOG_FILE}" ;;
    -f | --file) $GTKDIALOG --center --file=${MAIN_DIALOG_FILE} ;;
    -v | --variable) export MAIN_DIALOG=$(cat ${MAIN_DIALOG_FILE}); $GTKDIALOG --center --program=MAIN_DIALOG ;;
    *) $GTKDIALOG --file=${MAIN_DIALOG_FILE} ;;
esac
## EOSOURCE

/tmp/scripts/ex31.sh

Note the lines highlighted in bold. These are the lines by which the two examples differ.

Text in $(: … ) provides brief comments.

The following code fragment:

$(: make this tab initially invisible by setting visible="false")
<vbox xx-notbook-tab="Tab 3" visible="false">
    <vbox>
        <text><label>Settings Panels Go Here</label></text>
    </vbox>
    $(: Variable name of the vbox/tab. )
    $(: It is used to explicitly show/hide the vbox and its content )
    <variable>vTab3</variable>
</vbox> $(: end-notbook-tab="Tab 3" )

sets the visible attribute to false. This makes the Settings tab invisible when the application starts.

Adding the variable to the definition makes it possible to refer to this vbox object as an entity and is used to show and hide the vbox and its content.

The following code fragment:

                    <sensitive>true</sensitive>
                    $(: variable name of the notebook and all it contains )
                    $(: used to explicitly manage the notebook - like refreshing it )
                    <variable>vNotebook</variable>
                    $(: which tab to show when the control is first created and page=x attribute is not set )
                    $(: which tab to show when the control is refreshed )
                    <input file>${LOCAL_DATA_DIR}/NOTEBOOK_PAGE</input>
                    $(: save the tab number when tabs are switched )
                    $(: used to restore the "last seen tab" when showing/hiding the settings tab )
                    <output file>${LOCAL_DATA_DIR}/NOTEBOOK_PAGE_OUT</output>
                    <action signal="focus-out-event" x-save-last-tab-number-in="output file">save:vNotebook</action>
                </notebook> $(: end Notebook definition )

$(: End Notebook definition -------------------)

        </hbox> $(: end Notebook container definition )

defines the variable for the entire notebook object – vNotebook. This variable is used to trigger the “save” action, which gets executed whenever tabs are changed, and to refresh the notebook, which causes the focus-out-event to be delivered to the notebook object and thus cause the currently active tab number to be written to the output file.

Elsewhere the content of the output file is copied to the input file so that the correct tab is activated.

Consider the code below.

            $(: invisible entry for persisting the state of the toggle )
            $(: fnToggleSettingsTab toggles the value )
            <entry visible="false">
                <default>false</default>
                <variable>vSettingsToggle</variable>
                <input>fnToggleSettingsTab</input>
            </entry>

 First, we define an invisible “entry” object which we use to persist the “state” of the settings tab – hidden or shown.

Consider the related code below:

# -- Post UI Assembly Functions - used from UI after it is assembled ------------------------------------
#
# --------------------
# fnToggleSettingsTab - flips settings toggle
# controls whether the settings tab is visible or hidden 
# switches value of the entry to which it is hooked between true and false each time it is invoked
#
fnToggleSettingsTab() {
    [[ "${vSettingsToggle}" == "true" ]] && echo "false" || echo "true"
}
export -f fnToggleSettingsTab

Here we define a function which cases the value of the variable vSettingsToggle to be true or false, toggling between one and the other value each time the function is executed.

Consider the following code, which makes use of the foregoing:

            $(: button which toggles between displying and hiding the settings tab )
            <button width-request="35" homogenous="true" image-position="0" use-underline="true"
              tooltip-text="Configure URLs and Credentials">
                <input file icon="ibus-setup"></input>
                <width>16</width>
                <variable>vSettingsButton</variable>
                $(: set toggle to opposite settings )
                <action>refresh:vSettingsToggle</action> 
                $(: hide the settings tab and restore the "last tab" value so that the tab shown before the button is clicked )
                $(: is shown when the settings tab is hidden )
                <action condition="command_is_false(echo \$vSettingsToggle)">hide:vTab3</action>
                <action condition="command_is_false(echo \$vSettingsToggle)">cp ${LOCAL_DATA_DIR}/NOTEBOOK_PAGE_OUT ${LOCAL_DATA_DIR}/NOTEBOOK_PAGE</action> 
                $(: show the settings tab and save the "last tab" value so that the tab shown when the button is clicked )
                $(: is shown whent he settings are hidden again )
                <action condition="command_is_true(echo \$vSettingsToggle)">show:vTab3</action>
                <action condition="command_is_true(echo \$vSettingsToggle)">echo 2 > ${LOCAL_DATA_DIR}/NOTEBOOK_PAGE</action> 
                $(: cause the changes to be reflected in the UI )
                <action>refresh:vNotebook</action>
            </button>

 Here we define a button with no label and with the icon image somewhat indicative of its function. The button has a variable so that it can be manipulated.

Each time the button is clicked the “refresh:vSettingsToggle” action causes the vSettingsToggle invisible entry to execute the function associated with its “input” attribute. This function alternates between emitting the literals true and the literal false to stdout, which sets the variable to the corresponding value.

The action_is_false condition checks the value of the vSettingsToggle and causes its action to be executed if the value is false. In this case the result is that the settings tab gets hidden and the saved value of the last active tab before the settings button was clicked is copied to the file used as input to the notebook object.

The action_is_true condition checks the value of the vSettingsToggle and causes its action to be executed if the value is true. In this case the result is that the settings tab gets shown and the value of the active tab is explicitly set to 2 (the third tab – 0-based numbering) in the file used as input to the notebook object.

Finally the refresh:vNotebook action is executed and as a consequence the UI is updated to show the results of the manipulations discussed above.

This example shows how notebook tabs can be shown and hidden on demand, how a button can be instrumented to conditionally execute actions on other objects and how active tab can be explicitly set at runtime depending on the needs of the UI and the logic it implements.

Showing and Hiding the entire Notebook

In this example the entire notebook is alternately hidden and replaced with a completely different object, of the same size, and then shown again. The example shows how a “toggle” button can be simulated with two buttons of the same size which are alternately shown and hidden.

This is not so much an example of Notebook use as it is an example of dynamically replacing content of the window with different content of the same size, simulating dynamic screen refresh.

Consider the screenshots:

Click the “Show Info” button and see the entire Notebook disappear and get replaced with different content, and the text of the “Show Info” button label apparently changing to “Hide Info”. Notice, too, the “settings” button getting disabled and re-enabled depending on whether the Notbook content is visible.

Execute the following commands to recreate the application.

mkdir -pv /tmp/scripts
cd /tmp/scripts
> ex32.sh
chmod ug+x ex32.sh

geany ex32.sh & # copy and paste the code blow until ## EOSOURCE
#!/bin/bash

# make directory for temporary files and have it and the content blown away at exit
#
export LOCAL_DATA_DIR="/dev/shm/$(basename ${0})"
mkdir -p ${LOCAL_DATA_DIR}

fnHlrRemoveTmporaryFilesOnExit() {
    mkdir -p ${LOCAL_DATA_DIR}
    rm -R -f ${LOCAL_DATA_DIR}
}
trap fnHlrRemoveTmporaryFilesOnExit 0 # clean up after any program end.

# name temporary files and place them in the directory which will get deleted on termination of the script (most of the time)
export MAIN_DIALOG_FILE="${LOCAL_DATA_DIR}/MAIN_DIALOG_FILE_${USER}_${BASHPID}.gtkdialog"

##====================================================
[ -z ${GTKDIALOG:-} ] && GTKDIALOG=gtkdialog

# load symbolic constants I use instead of numeric values
source $(dirname ${0})/gtkdialog.constants

WIN_TITLE="XDS.b Registry Browser"

# set initial notebook page - this determines which tab is initially shown
echo 0 > ${LOCAL_DATA_DIR}/NOTEBOOK_PAGE

# Common size of all notebook content panels
#
_HEIGHT_REQUEST=375
_WIDTH_REQUEST=570

# construct UI
cat <<-EODECK > ${MAIN_DIALOG_FILE}
<window title="${WIN_TITLE}" icon-name="${WIN_ICON}" decorated="${WIN_DECORATED}" resizable="${WIN_RESIZABLE}"
        window_position="${WIN_POS}" skip_taskbar_hint="${WIN_SKIP_TASKBAR_HINT}" allow-grow="${WIN_ALLOW_GROW}"
        auto-refresh="true" name="win0">
    <vbox>

        <hbox homogeneous="true" sensitive="true" visible="true"> $(: begin Notebook container definition )

                 <notebook $(: begin notebook definition )
                    height-request="${_HEIGHT_REQUEST}"
                    width-request="${_WIDTH_REQUEST}"
                    tab-labels="Requests|Patients|Settings" xx-tab-labels="which will be shown on tabs"
                    page="1" xx-page="0 based tab number which will be initially shown"
                    enable-popup="true" xx-enable-popup="right-click will bring a list of tabs to select from"
                    show-border="true" xx-show-border="does not seem to do anything visible"
                    tab-border="2" xx-tab-border="how much space around text of tab label"
                    tab-hborder="2" xx-tab-hborder="how much space to the left and right of the tab label text"
                    tab-vborder="2" xx-tab-vborder="how much space to above and below the tab label text"
                    show-tabs="true" xx-show-tabs="as the name says - if false only the content of the 'page=x' tab will show"
                    homogeneous="true" xx-homogeneous="make the width of tabs the same"
                    space-fill="true"
                    space-expand="true"
                    scrollable="false" xx-scrollable="if notebook container width less than the width of all tabs adds left/right arrows to navigate between tabs"
                    tab-pos="${TAB_POS_ABOVE}"
                    border-width="0"
                    sensitive="true"
                    tooltip-markup="<span size='small'>This is an example of a <b>Notebook</b></span>"
                    has-tooltip="true"
                    visible="true"
                    >

$(: TAB 1 ------------------------------------)
                    <vbox xx-notbook-tab="Tab 1">
                        <vbox spacing="2">
                            <text><label>Requests Panels Go Here</label></text>
                        </vbox>
                    </vbox> $(: end-notbook-tab="Tab 1" )

$(: TAB 2 -----------------------------------)
                    <vbox xx-notbook-tab="Tab 2">
                        <vbox spacing="2">
                            <text><label>Patient Panels Go Here</label></text>
                        </vbox>
                    </vbox> $(: end-notbook-tab="Tab 2" )

$(: TAB 3 ------------------------------------)
                    $(: make this tab initially invisible by setting visible="false")
                    <vbox xx-notbook-tab="Tab 3" visible="false">
                        <vbox>
                            <text><label>Settings Panels Go Here</label></text>
                        </vbox>
                        $(: Variable name of the vbox/tab. )
                        $(: It is used to explicitly show/hide the vbox and its content )
                        <variable>vTab3</variable>
                    </vbox> $(: end-notbook-tab="Tab 3" )

$(: End of tab content definitions -----------)

                    <sensitive>true</sensitive>
                    $(: variable name of the notebook and all it contains )
                    $(: used to explicitly manage the notebook - like refreshing it )
                    <variable>vNotebook</variable>
                    $(: which tab to show when the control is first created and page=x attribute is not set )
                    $(: which tab to show when the control is refreshed )
                    <input file>${LOCAL_DATA_DIR}/NOTEBOOK_PAGE</input>
                    $(: save the tab number when tabs are switched )
                    $(: used to resore the "last seen tab" when showing/hiding the settings tab )
                    <output file>${LOCAL_DATA_DIR}/NOTEBOOK_PAGE_OUT</output>
                    <action signal="focus-out-event" x-save-last-tab-number-in="output file">save:vNotebook</action>
                </notebook> $(: end Notebook definition )

$(: End Notebook definition -------------------)

            <variable>vHBoxNotebook</variable>
        </hbox> $(: end Notebook container definition )

$(: alternative content - replaces the Notebook when shown - initially invisible )
        <hbox 
            height-request="${_HEIGHT_REQUEST}"
            width-request="${_WIDTH_REQUEST}"
            homogeneous="true" sensitive="true" visible="false" 
            >
            <vbox width-request="${_WIDTH_REQUEST}">
                <text><label>Patient Details Go Here</label></text>
            </vbox>
            <variable>vHBoxInfo</variable>
        </hbox> $(: vHBoxInfo)

$(: Common object - shown below the notebook and alternate content --)

        <hbox>

            $(: the two buttons below work as a toggle and switch between the notebook object and the text object )
            $(: onlt one button is visible at a time - Both occupy the same space giving is the "toggle" effect )
            $(: This button hides the notebook and the "show info " button, and shows the info panel in its place )
            <button visible="true" sensitive="true" width-request="100" homogenous="true" image-position="0"use-underline="true">
                <label> _Show Info </label>
                <input file icon="gtk-apply"></input>
                <width>16</width>
                <variable>vBtnShowInfo</variable>
                <action>hide:vHBoxNotebook</action> $(: hide notebook )
                <action>hide:vBtnShowInfo</action>  $(: hide self [button] )
                <action>show:vHBoxInfo</action>     $(: show info panel )
                <action>show:vBtnHideInfo</action>  $(: show button that will hide info panel again )
                <action>disable:vSettingsButton</action> $(: disable show settings button - notebook is hidden )
            </button>
            $(: This button hides the info panel and the "hide info " button, and shows the notebook back again )
            <button visible="false" sensitive="true" width-request="100" homogenous="true" image-position="0"use-underline="true">
                <label> _Hide Info </label>
                <input file icon="gtk-apply"></input>
                <width>16</width>
                <variable>vBtnHideInfo</variable>
                <action>hide:vHBoxInfo</action>
                <action>hide:vBtnHideInfo</action>
                <action>show:vHBoxNotebook</action>
                <action>show:vBtnShowInfo</action>
                <action>enable:vSettingsButton</action> $(: enable show settings button - notebook is visible )
            </button>

            $(: invisible entry for persisting the state of the toggle )
            $(: fnToggleSettingsTab toggles the value )
            <entry visible="false">
                <default>false</default>
                <variable>vSettingsToggle</variable>
                <input>fnToggleSettingsTab</input>
            </entry>
            $(: button which toggles between displying and hiding the settings tab )
            <button width-request="35" homogenous="true" image-position="0" use-underline="true"
              tooltip-text="Configure URLs and Credentials">
                <input file icon="ibus-setup"></input>
                <width>16</width>
                <variable>vSettingsButton</variable>
                $(: set toggle to opposite settings )
                <action>refresh:vSettingsToggle</action>
                $(: hide the settings tab and restore the "last tab" value so that the tab shown before the button is clicked )
                $(: is shown when the settings tab is hidden )
                <action condition="command_is_false(echo \$vSettingsToggle)">hide:vTab3</action>
                <action condition="command_is_false(echo \$vSettingsToggle)">cp ${LOCAL_DATA_DIR}/NOTEBOOK_PAGE_OUT ${LOCAL_DATA_DIR}/NOTEBOOK_PAGE</action>
                $(: show the settings tab and save the "last tab" value so that the tab shown when the button is clicked )
                $(: is shown whent he settings are hidden again )
                <action condition="command_is_true(echo \$vSettingsToggle)">show:vTab3</action>
                <action condition="command_is_true(echo \$vSettingsToggle)">echo 2 > ${LOCAL_DATA_DIR}/NOTEBOOK_PAGE</action>
                $(: cause the changes to be reflected in the UI )
                <action>refresh:vNotebook</action>
            </button>

            <button width-request="100"
              homogenous="true"
              image-position="${BTN_IMG_POS_LEFT}"
              use-underline="true"
              can-default="true" xx-info="has-default must have can-default"
              has-default="true" xx-info="has-default and can-default must both be true for default to work"
              >
                <label> _Quit </label>
                <input file icon="gtk-quit"></input>
                <width>16</width>
                <action function="exit">QUIT</action>
            </button>
        </hbox>
    </vbox>

    <action this-is-window="escape" signal="key-press-event" condition="command_is_true( [[ \$KEY_RAW = 0x9 ]] && echo true )">EXIT:exit</action>
</window>
EODECK

# -- Post UI Assembly Functions - used from UI after it is assembled ------------------------------------
#

# --------------------
# fnToggleSettingsTab - flips settings toggle
# controls whether the settings tab is visible or hidden
# switches value of the entry to which it is hooked between true and false each time it is invoked
#
fnToggleSettingsTab() {
    [[ "${vSettingsToggle}" == "true" ]] && echo "false" || echo "true"
}
export -f fnToggleSettingsTab

# -- run the UI -----------------------------------------------------------------------------------------------
case ${1:-} in
    -d | --dump) more "${MAIN_DIALOG_FILE}" ;;
    -f | --file) $GTKDIALOG --center --file=${MAIN_DIALOG_FILE} ;;
    -v | --variable) export MAIN_DIALOG=$(cat ${MAIN_DIALOG_FILE}); $GTKDIALOG --center --program=MAIN_DIALOG ;;
    *) $GTKDIALOG --file=${MAIN_DIALOG_FILE} ;;
esac
## EOSOURCE

/tmp/scripts/ex32.sh

In this example an extra hbox with alternate content and two buttons were added to the example ex31 to accomplish what was required. Inspect the code and figure out what gets done. The embedded comments provide guidance.

More sophisticated example

The code for example whose screenshot was presented at the beginning of this article as a tease is provided below. Explore the example to see how the notebook object and the techniques discussed in this article can be put to use in developing a useful application. The code related to interaction with the backends was removed and replaced with data stubs as not relevant to the gtkdialog discussion.

mkdir -pv /tmp/scripts
cd /tmp/scripts
> notebook.sh
chmod ug+x notebook.sh
geany notebook.sh & # until ## EOSOURCE
#!/bin/bash

:<<'COMMENT == ====================================================='
    XDS.b Registry Browser
COMMENT == =====================================================

appVersion=1.0.4
echo "Loading ${BASH_SOURCE[0]} version ${appVersion} ..." 1>&2
echo "Starting ${0} version ${appVersion} ..." 1>&2

# make bash strict
set -e
set -u
set -o pipefail

# this idiom adds a --debug flag and defines the expansion of dbg - if expanded to : rest of command is ignored
[ "--debug" = "${1:-}" ] && export dbg="" || export dbg=:

# make ERR trap global
set -o errtrace

# make directory for temporary files and have it and the content blown away at exit
#
export LOCAL_DATA_DIR="/dev/shm/$(basename ${0})"
$dbg echo 'LOCAL_DATA_DIR--->>>'"${LOCAL_DATA_DIR}"'<<<---' 1>&2
mkdir -p ${LOCAL_DATA_DIR}

fnHlrRemoveTmporaryFilesOnExit() {
    # remove all temporary files by blowing away the directory which contains them
    verify="" # -v
    mkdir -p ${verify} ${LOCAL_DATA_DIR}
    rm ${verify} -R -f ${LOCAL_DATA_DIR}
}
# Trap the signal "zero"
trap fnHlrRemoveTmporaryFilesOnExit 0 # clean up after any program end.

fnHlrProcessERR(){
    MYSELF="$0"   # equals to my script name
    LASTLINE="$1" # argument 1: last line of error occurence
    LASTERR="$2"  # argument 2: error code of last command
    echo "${MYSELF}: ${FUNCNAME} : line ${LASTLINE}: exit status of last command: ${LASTERR}" 1>&2
    local frame=0
    while caller $frame; do
      ((frame++));
    done
    echo "$*"
    fnHlrRemoveTmporaryFilesOnExit
}
export -f fnHlrProcessERR
# Trap the ERR signal - not as usefull as all that, but
trap 'fnHlrProcessERR 859 4175' ERR

export LC_ALL=C # disable unicode support
export oldPOSIXLY_CORRECT=${POSIXLY_CORRECT:-}
$dbg echo '${POSIXLY_CORRECT}-->>'"${POSIXLY_CORRECT:-}"'<<<---' 1>&2
unset POSIXLY_CORRECT   # disable posix compliance - it prevents process substitution working

# name temporary files
#
export MAIN_DIALOG_FILE="${LOCAL_DATA_DIR}/MAIN_DIALOG_FILE_${USER}_${BASHPID}.gtkdialog"
export baseSOAPExchangeFileName="rls_browser_${USER}_${BASHPID}"
export SOAPRequestFileName="${LOCAL_DATA_DIR}/${baseSOAPExchangeFileName}_request.xml"
export SOAPResponseFileName="${LOCAL_DATA_DIR}/${baseSOAPExchangeFileName}_response.xml"
export SOAPErrorFileName="${LOCAL_DATA_DIR}/${baseSOAPExchangeFileName}_response.error"
export SOAPResponseFormattedFileName="${LOCAL_DATA_DIR}/${baseSOAPExchangeFileName}_response.xml.xml"

$dbg echo '$MAIN_DIALOG_FILE--->>>'"$MAIN_DIALOG_FILE"'<<<---'
$dbg echo '$baseSOAPExchangeFileName--->>>'"$baseSOAPExchangeFileName"'<<<---'
$dbg echo '$SOAPRequestFileName--->>>'"$SOAPRequestFileName"'<<<---'
$dbg echo '$SOAPResponseFileName--->>>'"$SOAPResponseFileName"'<<<---'
$dbg echo '$SOAPErrorFileName--->>>'"$SOAPErrorFileName"'<<<---'
$dbg echo '$SOAPResponseFormattedFileName--->>>'"$SOAPResponseFormattedFileName"'<<<---'

# store config properties in the same directory as the script - not checking for permissions
#
export selfConfigPath="${0%%.sh}.properties"
export patientXSLPath="${0%%.sh}.xsl"

# -- Pre UI Assembly Functions - used to provide UI text ------------------------------------
#
fnUtlVarGet() {
    [[ ! -e $LOCAL_DATA_DIR/$1 ]] && touch $LOCAL_DATA_DIR/$1
    local input
    read -r input < $LOCAL_DATA_DIR/$1
    echo -n "$input"
}
export -f fnUtlVarGet

fnUtlVarSet() {
    [[ ! -e $LOCAL_DATA_DIR/$1 ]] && touch $LOCAL_DATA_DIR/$1
    echo "$2" > $LOCAL_DATA_DIR/$1
}
export -f fnUtlVarSet

evbb(){ echo '<eventbox>'; }
evbe(){ echo '</eventbox>'; }
#evbb(){ echo ''; }
#evbe(){ echo ''; }

# --
fnLoadConfiguration() {
    export gvDBHost="localhost"
    export gvDBPort="1521"
    export gvDBService="adtdb"
    export gvLOGDBUsername="LOG"
    export gvLOGDBPassword="password"
    export gvPIXServiceURL="http://pixservice:7654/PIXService"
    export gvOHMPIDomainOID="1.2.3.4.5.6.7.8.9"
}
fnLoadConfiguration

## first time init
fnUtlVarSet "PATIENT_DB_QUERY_FIRST_TIME" "TRUE"
fnUtlVarSet "REQUEST_DB_QUERY_FIRST_TIME" "TRUE"

# patient info file - start empty
echo '' > ${LOCAL_DATA_DIR}/PATIENT_INFO

##====================================================
[ -z ${GTKDIALOG:-} ] && GTKDIALOG=gtkdialog

# load symbolic constants I use intsead of numeric values
source $(dirname ${0})/gtkdialog.constants

WIN_TITLE="XDS.b Registry Browser"

# set initial notebook page
echo 1 > ${LOCAL_DATA_DIR}/NOTEBOOK_PAGE

_HEIGHT_REQUEST=375 # 425
_WIDTH_REQUEST=570 # 490

# construct UI
cat <<-EODECK > ${MAIN_DIALOG_FILE}
<window title="${WIN_TITLE}"
        icon-name="${WIN_ICON}"
        decorated="${WIN_DECORATED}"
        resizable="${WIN_RESIZABLE}"
        window_position="${WIN_POS}"
        skip_taskbar_hint="${WIN_SKIP_TASKBAR_HINT}"
        allow-grow="${WIN_ALLOW_GROW}"
        auto-refresh="true"
        name="win0"
        >
    <vbox>

        <hbox homogeneous="true" xx-homogeneous="make the width of tabs the same"
            sensitive="true"
            visible="true"
            >
                <notebook $(: start notebook )
                    height-request="${_HEIGHT_REQUEST}" 
                    width-request="${_WIDTH_REQUEST}" 
                    tab-labels="Requests|Patients|Settings" xx-tab-labels="works"
                    xxxpage="0" xx-page="works, 0 based tab number which will be initially shown"
                    enable-popup="true" xx-enable-popup="right-click will bring a list of tabs to select from"
                    show-border="true" xx-show-border="does not seem to do anything visible"
                    tab-border="2" xx-tab-border="how much space around text of tab label"
                    tab-hborder="2" xx-tab-hborder="how much space to the left and right of the tab label text"
                    tab-vborder="2" xx-tab-vborder="how much space to above and below the tab label text"
                    show-tabs="true" xx-show-tabs="as the name says - if false only the content of the 'page=x' tab will show"
                    homogeneous="true" xx-homogeneous="make the width of tabs the same"
                    space-fill="true"
                    space-expand="true"
                    scrollable="false" xx-scrollable="if notebook container width less than the width of all tabs adds left/right arrows to navigate between tabs"
                    tab-pos="${TAB_POS_ABOVE}"
                    border-width="0"
                    sensitive="true"
                    xx-tooltip-markup="<span size='small'>This is a <b>Tooltip</b></span>"
                    xx-has-tooltip="true"
                    visible="true"
                    >

$(: TAB 1 ------------------------------------)

                    <vbox begin-notbook-tab="Tab 1">
                        <vbox spacing="2">
                            <hbox>
                                <button width-request="100" xalign="${XALIGN_LEFT}" can-default="true" has-default="true"
                                space-expand="false" space-fill="false" use-underline="true"
                                tooltip-text="Find requests received by XDS Registry" can-default="true"
                                has-default="true">
                                    <width>16</width>
                                    <input file icon="gtk-find"></input>
                                    <label> _Find </label>
                                    <variable export="false">btnFind</variable>
                                    <action type="clear">treeResultsRequestsList</action>
                                    <action type="refresh">treeResultsRequestsList</action>
                                </button>
                                <text xpad="3">
                                    <label>""</label>
                                </text>
                            </hbox>

                            <frame  Registry Requests  >
                                <hbox homogenous="true" space-expand="true" space-fill="true" space-expand="true"
                                  selectable="true" can-focus="true"
                                  height-request="280">
                                    <tree homogeneous="true" space-expand="true" space-fill="true" rules-hint="true"
                                      xalign="${XALIGN_CENTRE}" headers-visible="true" headers-clickable="true"
                                      hover-expand="false" hover-selection="false"
                                      selection-mode="${TREE_SELECTION_MODE_SINGLE}" vscrollbar-policy="${VSCROLLBAR_AUTOMATIC}"
                                      selectable="true" can-focus="true"
                                      exported-column="2" stock-id="gtk-dialog-question" auto-refresh="true"
                                      column-type="string|string|string|string|string"
                                      column-visible="true|true|false|true|true"
                                      column-sizing="1|1|1|1|0"
                                      >
                                        <label>"Request|From IP|Message Id|Timestamp|Pass"</label>
                                        <variable>treeResultsRequestsList</variable>
                                        <input>fnDoGetRequests</input>
                                        <action function="clear">vPatientInfo</action>
                                        <action>fnShowRequestInfo "\$treeResultsRequestsList"</action>
                                    </tree>
                                </hbox>
                            </frame>
                        </vbox>
                        <variable>vTab1</variable>
                    </vbox> $(: end-notbook-tab="Tab 1" )

$(: TAB 2 -----------------------------------)

                    <vbox xx-notbook-tab="Tab 2">
                        <vbox spacing="2">
                            <hbox>
                                <button width-request="100" xalign="${XALIGN_LEFT}" can-default="true" has-default="true" space-expand="false" space-fill="false" use-underline="true"
                                tooltip-text="Find Patients registered in XDS Registry" can-default="true" has-default="true">
                                    <width>16</width>
                                    <input file icon="gtk-find"></input>
                                    <label> _Find </label>
                                    <variable export="false">btnFind</variable>
                                    <action type="clear">treeResultsIDsList</action>
                                    <action type="refresh">treeResultsIDsList</action>
                                </button>
                                <text xpad="3">
                                    <label>""</label>
                                </text>
                            </hbox>

                            <frame  Registered Patients  >
                                <hbox homogenous="true" space-expand="true" space-fill="true" selectable="true" can-focus="true"
                                  height-request="280">
                                    <tree homogeneous="true" space-expand="true" space-fill="true" rules-hint="true"
                                      xalign="${XALIGN_CENTRE}" headers-visible="true" headers-clickable="true"
                                      hover-expand="false" hover-selection="false"
                                      selection-mode="${TREE_SELECTION_MODE_SINGLE}" vscrollbar-policy="${VSCROLLBAR_AUTOMATIC}"
                                      selectable="true" can-focus="true"
                                      exported-column="1" stock-id="gtk-dialog-question" auto-refresh="true"
                                      column-type="string|string|string|string"
                                      column-visible="false|true|false|true"
                                      column-sizing="1|1|1|0"
                                      >
                                        <label>"UUID|Patient Id|LastUpdated|Status"</label>
                                        <variable>treeResultsIDsList</variable>
                                        <input>fnDoGetPatientIDs</input>
                                        <action>fnShowPatientInfo "\$treeResultsIDsList"</action>

                                        <action>disable:vSettingsButton</action>
                                        <action>hide:vHBoxNotebook</action>

                                        <action>show:vHBoxInfo</action>
                                        <action>show:vBtnHideInfo</action>

                                        <action>refresh:vPatientInfo</action>
                                    </tree>
                                </hbox>
                            </frame>
                        </vbox>
                        <variable>vTab2</variable>
                    </vbox>

$(: TAB 3 ------------------------------------)

                    <vbox xx-notbook-tab="Tab 3" visible="false" enabled="false" comment="This is where applicaiton properties go">
                        <hbox>
                            <vbox homogenous="true" space-fill="true" space-expand="true">
                                <frame   XDS Registry Database   >
                                    <vbox height-request="85" x-width-request="220">
                                        <hbox spacing="2">
                                            $(evbb)<text><label>Hostname</label></text>$(evbe)
                                            $(evbb)<entry can-focus="true" has-focus="true" has-frame="false">
                                                <input>echo \$gvDBHost</input>
                                                <variable>vDBHost</variable>
                                                <width>120</width>
                                                <height>22</height>
                                            </entry>$(evbe)
                                        </hbox>
                                        <hbox spacing="2">
                                            $(evbb)<text><label>Port Number</label></text>$(evbe)
                                            $(evbb)<entry has-frame="false">
                                                <input>echo \$gvDBPort</input>
                                                <variable>vDBPort</variable>
                                                <width>60</width>
                                                <height>22</height>
                                            </entry>$(evbe)
                                            $(evbb)<text width-request="58"><label>""</label></text>$(evbe)
                                        </hbox>
                                        <hbox spacing="2">
                                            $(evbb)<text><label>Service Name</label></text>$(evbe)
                                            $(evbb)<entry has-frame="false">
                                                <input>echo \$gvDBService</input>
                                                <variable>vDBService</variable>
                                                <width>70</width>
                                                <height>22</height>
                                            </entry>$(evbe)
                                            $(evbb)<text width-request="48"><label>""</label></text>$(evbe)
                                        </hbox>
                                    </vbox>
                                </frame>
                            </vbox>
                           
                            <vbox homogenous="true" space-fill="true" space-expand="true">
                                <frame   LOG Database Schema   >
                                    <vbox height-request="85" x-width-request="220">
                                        <hbox spacing="2">
                                            $(evbb)<text><label>Username</label></text>$(evbe)
                                            $(evbb)<entry has-frame="false">
                                                <input>echo \$gvLOGDBUsername</input>
                                                <variable>vLOGDBUsername</variable>
                                                <width>120</width>
                                                <height>22</height>
                                            </entry>$(evbe)
                                        </hbox>
                                        <hbox spacing="2">
                                            $(evbb)<text><label>Password</label></text>$(evbe)
                                            $(evbb)<entry caps-lock-warning="true" has-frame="false">
                                                <input>echo \$gvLOGDBPassword</input>
                                                <variable>vLOGDBPassword</variable>
                                                <width>120</width>
                                                <height>22</height>
                                                <sensitive>password</sensitive>
                                            </entry>$(evbe)
                                        </hbox>
                                        <hbox>
                                            <button image-position="0" x="valid 0-3 - left, right, above, below"
                                  use-underline="true"
                                  >
                                                <label> T_est Connectivity </label>
                                                <input file icon="gtk-network"></input>
                                                <width>16</width>
                                                <action>fnTestDBConnectivity "true" "\$vDBHost" "\$vDBPort" "\$vDBService" "\$vLOGDBUsername" "\$vLOGDBPassword"</action>
                                            </button>
                                        </hbox>
                                    </vbox>
                                </frame>
                            </vbox>
                        </hbox>

                        <frame   PIX Service  >
                            <vbox height-request="60">
                                <hbox spacing="2">
                                    $(evbb)<text><label>OHMPI Domain OID</label></text>$(evbe)
                                    $(evbb)<entry caps-lock-warning="true" has-frame="false">
                                        <input>echo \$gvOHMPIDomainOID</input>
                                        <variable>vOHMPIDomainOID</variable>
                                        <width>340</width>
                                        <height>22</height>
                                    </entry>$(evbe)
                                </hbox>
                                <hbox spacing="2">
                                    $(evbb)<text><label>URL</label></text>$(evbe)
                                    $(evbb)<entry caps-lock-warning="true" has-frame="false">
                                        <input>echo \$gvPIXServiceURL</input>
                                        <variable>vPIXServiceURL</variable>
                                        <width>440</width>
                                        <height>22</height>
                                    </entry>$(evbe)
                                </hbox>
                                <hbox>
                                    <button image-position="0" x="valid 0-3 - left, right, above, below"
                                  use-underline="true"
                                  >
                                        <label> Test C_onnectivity </label>
                                        <input file icon="gtk-network"></input>
                                        <width>16</width>
                                        <action>fnTestURLConnectivity "true" "\$vPIXServiceURL"</action>
                                    </button>
                                </hbox>
                            </vbox>
                        </frame>
                        <variable>vTab3</variable>
                    </vbox>

                    <sensitive>true</sensitive>
                    <variable>vNotebook</variable>
                    <input file>${LOCAL_DATA_DIR}/NOTEBOOK_PAGE</input>
                    <output file>${LOCAL_DATA_DIR}/NOTEBOOK_PAGE_OUT</output>
                    <action signal="focus-out-event" x-save-last-tab-number-in="output file">save:vNotebook</action>
                </notebook>

            <variable>vHBoxNotebook</variable>
        </hbox> $(: vHBoxNotebook )

        <hbox height-request="${_HEIGHT_REQUEST}"
            width-request="${_WIDTH_REQUEST}"
            show-border="true" xx-show-border="does not seem to do anything visible"
            homogeneous="true" xx-homogeneous="make the width of tabs the same"
            sensitive="true"
            visible="false"
            >
            <vbox width-request="${_WIDTH_REQUEST}">
                <text><label>Patient Details</label></text>
              <frame>
                <tree file-monitor="false" auto-refresh="false" vscrollbar-policy="${VSCROLLBAR_NEVER}"
                      homogeneous="true" space-expand="true" space-fill="true" rules-hint="true" headers-visible="false"
                      headers-clickable="false" hover-expand="false" hover-selection="false" selection-mode="0"
                      >
                    <label>a|b</label>
                    <variable>vPatientInfo</variable>
                    <input file>${LOCAL_DATA_DIR}/PATIENT_INFO</input>
                    <sensitive>true</sensitive>
                </tree>
              </frame>
            </vbox>
            <variable>vHBoxInfo</variable>
        </hbox> $(: vHBoxInfo)

        <hbox>
            <button visible="false" sensitive="true" width-request="100" homogenous="true" image-position="0"use-underline="true">
                <label> _Dismiss </label>
                <input file icon="gtk-apply"></input>
                <width>16</width>
                <variable>vBtnHideInfo</variable>
                <action>hide:vHBoxInfo</action>
                <action>show:vHBoxNotebook</action>
                <action>hide:vBtnHideInfo</action>
                <action>enable:vSettingsButton</action>
            </button>

            <button width-request="35" homogenous="true" image-position="0" use-underline="true"
              tooltip-text="Configure URLs and Credentials">
                <input file icon="ibus-setup"></input>
                <width>16</width>
                <variable>vSettingsButton</variable>
                <action>refresh:vSettingsToggle</action> $(: set toggle to opposite settings )
                <action condition="command_is_false(echo \$vSettingsToggle)">hide:vTab3</action>
                <action condition="command_is_false(echo \$vSettingsToggle)">cp ${LOCAL_DATA_DIR}/NOTEBOOK_PAGE_OUT ${LOCAL_DATA_DIR}/NOTEBOOK_PAGE</action>
                <action condition="command_is_true(echo \$vSettingsToggle)">show:vTab3</action>
                <action condition="command_is_true(echo \$vSettingsToggle)">echo 2 > ${LOCAL_DATA_DIR}/NOTEBOOK_PAGE</action>
                <action>refresh:vNotebook</action>
            </button>

            <button width-request="100"
              homogenous="true"
              image-position="0" x="valid 0-3 - left, right, above, below"
              use-underline="true"
              can-default="true" xx-info="has-default must have can-default"
              has-default="true" xx-info="has-default and can-default must bot be true for default to work"
              xxx-default="if entry has focus default setting for button does not work"
             >
                <label> _Quit </label>
                <input file icon="gtk-quit"></input>
                <width>16</width>
                <action function="exit">QUIT</action>
            </button>
            <text xpad="3">
                <label>""</label>
            </text>
            <entry visible="false">
                <default>false</default>
                <variable>vSettingsToggle</variable>
                <input>fnToggleSettingsTab</input>
            </entry>
        </hbox>
    </vbox>

    <action this-is-window="escape" signal="key-press-event" condition="command_is_true( [[ \$KEY_RAW = 0x9 ]] && echo true )">EXIT:exit</action>
</window>
EODECK

#== Styles ==========================================
export GTK2_RC_FILES=${LOCAL_DATA_DIR}/gtkrc
cat <<-'EOSTYLEDEF' > ${GTK2_RC_FILES}
style "tab3TextBoxes" {
    font_name="Sans Regular 10"
}
style "notebook" {
    GtkNotebook::tab-overlap = -2
    GtkNotebook::tab-curvature = 0
    xthickness = 1
    ythickness = 1
}
style "frameTitleStyle" {
    fg[NORMAL]      = "navy"
    font_name="CM Roman CE Regular 10"
}
style "entryStyle" {
    font_name="Monospace Regular 10"
    fg[NORMAL]="black"
}
style "headerStyle" = "frame" {
    fg[NORMAL]      = "navy"
    font_name="CM Roman CE Regular 12"
}

widget_class "*<GtkNotebook>" style "notebook"
widget_class "*.<GtkFrame>.<GtkLabel>" style "frameTitleStyle"
widget_class "*.<GtkEntry>*" style "entryStyle"
class "GtkEntry" style "entryStyle"

widget_class "<GtkWindow><GtkVBox><GtkNotebook><GtkVBox><GtkHBox><GtkEventBox>" style "tab3TextBoxes"
widget_class "<GtkWindow><GtkVBox><GtkNotebook><GtkVBox><GtkHBox><GtkEventBox><GtkLabel>" style "tab3TextBoxes"

widget_class "*<GtkNotebook>*<GtkEventBox>" style "tab3TextBoxes"
widget_class "*<GtkNotebook>*<GtkEventBox><GtkLabel>" style "tab3TextBoxes"

widget "win0.GtkVBox.GtkHBox.GtkVBox.GtkLabel" style "headerStyle"
EOSTYLEDEF

# -- Post UI Assembly Functions - used from UI after it is assembled ------------------------------------
#
# --------------------
# fnToggleSettingsTab
fnToggleSettingsTab() {
    [[ "${vSettingsToggle}" == "true" ]] && echo "false" || echo "true"
}
export -f fnToggleSettingsTab

# --------------------
# fnTestDBConnectivity "true/false" "\$vDBHost" "\$vDBPort" "\$vDBService" "\$vADTDBUsername" "\$vADTDBPassword"
fnTestDBConnectivity() {
    lvShowOKDialog="${1}"
    lvDBHost="${2}"
    lvDBPort="${3}"
    lvDBService="${4}"
    lvDBUsername="${5}"
    lvDBPassword="${6}"
    [[ "${lvShowOKDialog}" = "true" ]] && {
        yad \
            --center --width=400 --image="gtk-dialog-authentication" --window-icon="gtk-dialog-authentication" \
            --title="Failed connection" \
            --text="Failed to connect to database schema ${lvDBUsername}\nConnection: ${lvDBHost}:${lvDBPort}/${lvDBService}" \
            --button=" Dismiss!gtk-ok!Dismiss this dialogue:0"
    } || :
    return 0;
}
export -f fnTestDBConnectivity

# -----------------------------------------------
# fnTestURLConnectivity "true/false" "\$vPIXServiceURL"
fnTestURLConnectivity() {
    local lvShowOKDialog="${1}"
    local lvPIXServiceURL="${2}"
    fnUtlInvalidSomethingAlert "No Service" "PIX/PDQ Service is not available\nConnectivity test failed";
}
export -f fnTestURLConnectivity

# -----------------------------
# fnDoGetPatientIDs
fnDoGetPatientIDs() {
    [[ "$(fnUtlVarGet 'PATIENT_DB_QUERY_FIRST_TIME')" = "TRUE" ]] && {
        fnUtlVarSet "PATIENT_DB_QUERY_FIRST_TIME" "FALSE"
        return 0;
    } || :
    echo 'urn:uuid:7e762cc0-209b-406e-a752-5072a0ada6b5|0000000005^^^&1.2.3.4.5.6.7.8.9&ISO|05-MAY-17|A'
    echo 'urn:uuid:ab0c5276-8df6-487d-96a4-1a531afa28a4|0000000004^^^&1.2.3.4.5.6.7.8.9&ISO|05-MAY-17|A'
    echo 'urn:uuid:a2c7fe79-b830-40ff-8199-0db747873b31|0000000003^^^&1.2.3.4.5.6.7.8.9&ISO|05-MAY-17|A'
    echo 'urn:uuid:a61c5ae9-366e-4e1f-955d-ff05571a37ee|0000000001^^^&1.2.3.4.5.6.7.8.9&ISO|05-MAY-17|I'
    echo 'urn:uuid:ec3f4416-d3c8-4c48-90a1-068aaa06a6db|0000000002^^^&1.2.3.4.5.6.7.8.9&ISO|05-MAY-17|A'
    echo 'urn:uuid:ae82e878-e5f0-4c4e-950b-22576de0a002|0000000000^^^&1.2.3.4.5.6.7.8.9&ISO|05-MAY-17|A'
}
export -f fnDoGetPatientIDs

# ---------------------------------
# fnDoGetRequests
fnDoGetRequests() {
#dbg=

    [[ "$(fnUtlVarGet 'REQUEST_DB_QUERY_FIRST_TIME')" = "TRUE" ]] && {
        fnUtlVarSet "REQUEST_DB_QUERY_FIRST_TIME" "FALSE"
        return 0;
    } || :
    echo 'PIDFEED.Add|localhost|b2e6eabb-7b32-409e-b6b2-eebddfdb56b6|20170505104319294|T'
    echo 'PIDFEED.Merge|localhost|1bb4afcb-8934-447a-9bdb-6c9066add528|20170505104424232|T'
    echo 'PIDFEED.Add|localhost|15b837e2-4963-441a-94b9-d7dc5861961a|20170505105033304|T'
    echo 'SubmitObjectsRequest.b|localhost|3c1c0037-0e20-4dd4-8c1b-819c2f58c301|20170505105141384|T'
    echo 'SQ.b FindDocuments|localhost|87010111-7513-44cd-ae1e-55324d1f4d64|20170505105249668|T'
    echo 'SQ.b GetSubmissionSetAndContents|localhost|b8616a98-3ca6-4cfe-98f0-0c4cd2209237|20170505105346116|T'
    echo 'SQ.b GetDocuments|localhost|0666024e-a16e-4edc-9bf1-51a5320308f5|20170505105426666|T'
    echo 'SQ.b FindDocuments|localhost|b0e67663-2f10-457a-a69d-22a0fb83d88a|20170505105519734|T'
    echo 'PIDFEED.Add|localhost|5e199a85-a105-4d86-b513-64a41580fc02|20170505115447445|T'
    echo 'SubmitObjectsRequest.b|localhost|1774af74-5332-49ac-a4bc-4a490ba8e8d5|20170505115740370|T'
    echo 'SQ.b FindDocuments|localhost|2e22762c-aa82-41a5-82eb-7fbbcff532ee|20170505115933070|T'
    echo ""
#dbg=:
}
export -f fnDoGetRequests

# ---------------------------------
# fnShowRequestInfo \$treeResultsRequestsList
fnShowRequestInfo() {
    local lvMessageId="${1}"
    fnUtlInvalidSomethingAlert "No Service" "XDS.b Regsitry is not able to supply data\nCannot show details for message ${lvMessageId}";
}
export -f fnShowRequestInfo

# --------------------------------
# fnShowPatientInfo "\$treeResultsIDsList"
fnShowPatientInfo() {
    local lvPatientId="${1}"
#dbg=
    echo "Patient Identifier:|${lvPatientId}" > ${LOCAL_DATA_DIR}/PATIENT_INFO
    echo 'Status|active'  >> ${LOCAL_DATA_DIR}/PATIENT_INFO
    echo '|'  >> ${LOCAL_DATA_DIR}/PATIENT_INFO
    echo 'Demographics:'  >> ${LOCAL_DATA_DIR}/PATIENT_INFO
    echo 'Title|'  >> ${LOCAL_DATA_DIR}/PATIENT_INFO
    echo 'Give Name|John'  >> ${LOCAL_DATA_DIR}/PATIENT_INFO
    echo 'Family Name|Doe'  >> ${LOCAL_DATA_DIR}/PATIENT_INFO
    echo 'Gender|M'  >> ${LOCAL_DATA_DIR}/PATIENT_INFO
    echo 'Date of Birth|10/11/1999'  >> ${LOCAL_DATA_DIR}/PATIENT_INFO
    echo 'Social Security Number|200809101'  >> ${LOCAL_DATA_DIR}/PATIENT_INFO
    echo '|'  >> ${LOCAL_DATA_DIR}/PATIENT_INFO
    echo 'Address:'  >> ${LOCAL_DATA_DIR}/PATIENT_INFO
    echo 'Street Address|33 Berry Street'  >> ${LOCAL_DATA_DIR}/PATIENT_INFO
    echo 'City/Town|North Sydney'  >> ${LOCAL_DATA_DIR}/PATIENT_INFO
    echo 'State|NSW'  >> ${LOCAL_DATA_DIR}/PATIENT_INFO
    echo 'Postal Code|2060'  >> ${LOCAL_DATA_DIR}/PATIENT_INFO
    echo '|'  >> ${LOCAL_DATA_DIR}/PATIENT_INFO
#dbg=:
}
export -f fnShowPatientInfo

## --------------------------------------
function fnUtlInvalidSomethingAlert() {
invTitle=${1:-}
invMessage=${2:-}
    yad \
        --center --width=400 --image="gtk-dialog-error" --window-icon="gtk-dialog-error" --title="${invTitle}" --text="${invMessage}" \
        --button=" Dismiss!gtk-ok!Dismiss this dialogue:0"
}
export -f fnUtlInvalidSomethingAlert

# -- run the UI -----------------------------------------------------------------------------------------------
case ${1:-} in
    -d | --dump) more "${MAIN_DIALOG_FILE}" ;;
    -f | --file) $GTKDIALOG --center --file=${MAIN_DIALOG_FILE} ;;
    -v | --variable) export MAIN_DIALOG=$(cat ${MAIN_DIALOG_FILE}); $GTKDIALOG --center --program=MAIN_DIALOG ;;
    *) $GTKDIALOG --file=${MAIN_DIALOG_FILE} ;;
esac
## EOSOURCE

/tmp/scripts/notebook.sh

I hope that this article helps you work with the gtkdialog notebook object.