User avatar
flatmax
Posts: 318
Joined: Thu May 26, 2016 10:36 pm

STICKY: Tutorial 0 - Programming GTK GUIs using gtkIOStream

Tue Jan 31, 2017 12:52 am

gtkIOStream is a set of C++ headers which enable you to make GTK GUI programs in a very trivial manner. The nice thing about gtkIOStream is that they are only header files, this makes distribution easier, as you don't need to link against foreign libraries.

Tutorial Contents

The basic concept is to make building guis similar to using the iostream operators ... for example in C++ to print a string to the console you type the following nice and simple piece of code :

Code: Select all

cout << "this is a message"<<endl;
What is nice about iostream is that it handles conversion of types as appropriate. For example the following prints "number 10" followed by a new line :

Code: Select all

int n=10; // create the number as an integer
cout <<"number "<<n<<endl;
In a similar manner, gtkiostream allows you to build GUIs as if they were iostreams !

For example, to show labels in a GUI dialog you would do the following :

Code: Select all

Labels labs; // create a labels list
labs<<" this is a label"; // Load a string in as a label

Window topWindow; // Create the top box
topWindow << labs;
There you have it, compile that and start the binary, you will see a dialog with the string label in it.

I would like to get you started in creating GTK GUIs using gtkiostream - like a pro :) Please continue reading to setup and test your gtk and gtkiostream installation.

Matt
p.s. If you have any questions or problems, please add them to this thread.
Last edited by flatmax on Wed Feb 08, 2017 9:29 am, edited 9 times in total.
Zero sound card for the Pi - live now on kickstarter : http://kck.st/2rwkQMH
Sound card for the Raspberry Pi with inbuilt microphone : http://www.audioinjector.net
Audio Inector Octo multitrack GPIO sound card : http://www.audioinjector.net

User avatar
flatmax
Posts: 318
Joined: Thu May 26, 2016 10:36 pm

Re: Tutorial : Programming GTK GUIs using gtkIOStream

Tue Jan 31, 2017 12:55 am

For this first step, we are going to install the necessary gtk development packages, then we are going to download gtkiostream and do a test compile to check our build system is working.

Prerequisites and setup

Firstly install the necessary headers and development libraries for gtk :

Code: Select all

sudo apt-get install libgtk2.0-dev
Now download the gtkiostream source code ... get the tar.xz file :

Code: Select all

wget https://sourceforge.net/projects/gtkiostream/files/Version%201.5.0/gtkiostream-1.5.0.tar.xz/download -O gtkiostream-1.5.0.tar.xz
Untar gtkiostream :

Code: Select all

tar Jxpvf gtkiostream-1.5.0.tar.xz
Do a test that you can compile like so :
First change to the directory of the source code you downloaded :

Code: Select all

cd gtkiostream-1.5.0
Next compile the source code - we will compile the pre-exisiting labels test code :

Code: Select all

g++ test/LabelsTest.C -o test/LabelsTest `pkg-config gtk+-2.0 --cflags --libs` -Iinclude
Assuming everything went well, try to run the compiled test program :

Code: Select all

./test/LabelsTest
Press the quit button to exit.

If you get to this point and it works, you are ready to make your own program ...
Matt
Zero sound card for the Pi - live now on kickstarter : http://kck.st/2rwkQMH
Sound card for the Raspberry Pi with inbuilt microphone : http://www.audioinjector.net
Audio Inector Octo multitrack GPIO sound card : http://www.audioinjector.net

User avatar
flatmax
Posts: 318
Joined: Thu May 26, 2016 10:36 pm

Re: Tutorial 0 : Programming GTK GUIs using gtkIOStream

Tue Jan 31, 2017 1:07 am

Before we continue, lets dissect the compile line :

Code: Select all

g++ test/LabelsTest.C -o test/LabelsTest `pkg-config gtk+-2.0 --cflags --libs` -Iinclude
g++ calls the GNU c++ preprocessor and linker.

test/LabelsTest.C
is the file we want to compile.

-o LabelsTest tells g++ to output the binary to the file name LabelsTest

-Iinclude Tells g++ to include the path ./include which contains all the necessary gtkiostream header files.

`pkg-config gtk+-2.0 --cflags --libs` evaluates the command within the ` back quote. Be careful, this is a backquote, not a regular single quote. Anything encased in backquotes tells the shell to evaluate the encased command before continuing.

pkg-config gtk+-2.0 --cflags --libs Extracts for GTK (using package config - the developer package manager) the necessary include paths for header files and libraries, as well as the necessary libraries themselves. If you run this command on the command line you will see it prints the following :

Code: Select all

pi@raspberrypi:~/gtkiostream-1.5.0 $ pkg-config gtk+-2.0 --cflags
-pthread -I/usr/include/gtk-2.0 -I/usr/lib/i386-linux-gnu/gtk-2.0/include -I/usr/include/gio-unix-2.0/ -I/usr/include/cairo -I/usr/include/pango-1.0 -I/usr/include/atk-1.0 -I/usr/include/cairo -I/usr/include/pixman-1 -I/usr/include/libpng12 -I/usr/include/gdk-pixbuf-2.0 -I/usr/include/libpng12 -I/usr/include/pango-1.0 -I/usr/include/harfbuzz -I/usr/include/pango-1.0 -I/usr/include/glib-2.0 -I/usr/lib/i386-linux-gnu/glib-2.0/include -I/usr/include/freetype2 
pi@raspberrypi:~/gtkiostream-1.5.0 $ pkg-config gtk+-2.0 --libs
-lgtk-x11-2.0 -lgdk-x11-2.0 -lpangocairo-1.0 -latk-1.0 -lcairo -lgdk_pixbuf-2.0 -lgio-2.0 -lpangoft2-1.0 -lpango-1.0 -lgobject-2.0 -lglib-2.0 -lfontconfig -lfreetype 
Which is why our tiny command line to compile the C++ code bloats out immensly from this :

Code: Select all

g++ test/LabelsTest.C -o test/LabelsTest `pkg-config gtk+-2.0 --cflags --libs` -Iinclude
To this :

Code: Select all

g++ test/LabelsTest.C -o test/LabelsTest -pthread -I/usr/include/gtk-2.0 -I/usr/lib/i386-linux-gnu/gtk-2.0/include -I/usr/include/gio-unix-2.0/ -I/usr/include/cairo -I/usr/include/pango-1.0 -I/usr/include/atk-1.0 -I/usr/include/cairo -I/usr/include/pixman-1 -I/usr/include/libpng12 -I/usr/include/gdk-pixbuf-2.0 -I/usr/include/libpng12 -I/usr/include/pango-1.0 -I/usr/include/harfbuzz -I/usr/include/pango-1.0 -I/usr/include/glib-2.0 -I/usr/lib/i386-linux-gnu/glib-2.0/include -I/usr/include/freetype2 -lgtk-x11-2.0 -lgdk-x11-2.0 -lpangocairo-1.0 -latk-1.0 -lcairo -lgdk_pixbuf-2.0 -lgio-2.0 -lpangoft2-1.0 -lpango-1.0 -lgobject-2.0 -lglib-2.0 -lfontconfig -lfreetype -Iinclude
Zero sound card for the Pi - live now on kickstarter : http://kck.st/2rwkQMH
Sound card for the Raspberry Pi with inbuilt microphone : http://www.audioinjector.net
Audio Inector Octo multitrack GPIO sound card : http://www.audioinjector.net

MikeG58
Posts: 10
Joined: Thu Jan 05, 2017 7:09 am

Re: Tutorial 0 - Programming GTK GUIs using gtkIOStream

Fri Feb 03, 2017 5:53 am

Matt,

This is the main problem I've been having. Trying to get C++ to 'find' the gtk header definitions. Or, at least I think that is the issue. After running the compile test my results are:

pi@raspberrypi:~/gtkiostream-1.5.0 $ g++ test/LabelsTest.C -o test/LabelsTest `pkg-config gtk+-2.0 --cflags --libs` -Iinclude
Package gtk+-2.0 was not found in the pkg-config search path.
Perhaps you should add the directory containing `gtk+-2.0.pc'
to the PKG_CONFIG_PATH environment variable
No package 'gtk+-2.0' found
In file included from test/LabelsTest.C:17:0:
include/gtkInterface.H:250:21: fatal error: gtk/gtk.h: No such file or directory
#include <gtk/gtk.h>
^
compilation terminated.


Then, perhaps, it's because I installed gtk+ 3.0. I'm gonna try to change that right now.

-Mike

MikeG58
Posts: 10
Joined: Thu Jan 05, 2017 7:09 am

Re: Tutorial 0 - Programming GTK GUIs using gtkIOStream

Fri Feb 03, 2017 5:57 am

Matt,

No. I just don't get it.

pi@raspberrypi:~/gtkiostream-1.5.0 $ g++ test/LabelsTest.C -o test/LabelsTest `pkg-config gtk+-3.0 --cflags --libs` -Iinclude3test/LabelsTest.C:17:26: fatal error: gtkInterface.H: No such file or directory
#include "gtkInterface.H"
^
compilation terminated.
-Mike

MikeG58
Posts: 10
Joined: Thu Jan 05, 2017 7:09 am

Re: Tutorial 0 - Programming GTK GUIs using gtkIOStream

Fri Feb 03, 2017 6:05 am

OK, Matt,

I did get this:

pi@raspberrypi:~/gtkiostream-1.5.0 $ pkg-config gtk+-3.0 --cflags
-pthread -I/usr/include/gtk-3.0 -I/usr/include/at-spi2-atk/2.0 -I/usr/include/at-spi-2.0 -I/usr/include/dbus-1.0 -I/usr/lib/arm-linux-gnueabihf/dbus-1.0/include -I/usr/include/gtk-3.0 -I/usr/include/gio-unix-2.0/ -I/usr/include/cairo -I/usr/include/pango-1.0 -I/usr/include/harfbuzz -I/usr/include/pango-1.0 -I/usr/include/atk-1.0 -I/usr/include/cairo -I/usr/include/pixman-1 -I/usr/include/freetype2 -I/usr/include/libpng12 -I/usr/include/gdk-pixbuf-2.0 -I/usr/include/libpng12 -I/usr/include/glib-2.0 -I/usr/lib/arm-linux-gnueabihf/glib-2.0/include

So, I must be doing something right.

-Mike


-Mike

MikeG58
Posts: 10
Joined: Thu Jan 05, 2017 7:09 am

Re: Tutorial 0 - Programming GTK GUIs using gtkIOStream

Fri Feb 03, 2017 6:39 am

Matt,

Using Geany, or some other IDE, where do you include the `pkg-config gtk+-3.0 --cflag` string, to make sure it points to gtk's header definitions?

-Mike

User avatar
flatmax
Posts: 318
Joined: Thu May 26, 2016 10:36 pm

Re: Tutorial 0 - Programming GTK GUIs using gtkIOStream

Fri Feb 03, 2017 6:56 am

MikeG58 wrote:Matt,

No. I just don't get it.

pi@raspberrypi:~/gtkiostream-1.5.0 $ g++ test/LabelsTest.C -o test/LabelsTest `pkg-config gtk+-3.0 --cflags --libs` -Iinclude3test/LabelsTest.C:17:26: fatal error: gtkInterface.H: No such file or directory
#include "gtkInterface.H"
^
compilation terminated.
-Mike
Almost there Mike, keep going !
It can't find the gtkInterface.H file because it is missing the "-Ipath" and the end of the line.
Try this :
g++ test/LabelsTest.C -o test/LabelsTest `pkg-config gtk+-3.0 --cflags --libs` -Iinclude

This will work if you are inside the gtkiostream-1.5.0 directory - as per the tutorial. You should be able to do :

Code: Select all

ls include/gtkInterface.H
and is should show you the file name without error.

I notice you are using gtk3, this should be fine, the majority of gtkiostream works with GTK3. Just remember that where you see 2.0 in the rest of the tutorials to replace that with 3.0.

Matt
Zero sound card for the Pi - live now on kickstarter : http://kck.st/2rwkQMH
Sound card for the Raspberry Pi with inbuilt microphone : http://www.audioinjector.net
Audio Inector Octo multitrack GPIO sound card : http://www.audioinjector.net

MikeG58
Posts: 10
Joined: Thu Jan 05, 2017 7:09 am

Re: Tutorial 0 - Programming GTK GUIs using gtkIOStream

Fri Feb 03, 2017 7:43 am

Matt,

I did include the 'Iinclude' at the end of the line. It just got wrapped around in my copy and paste. If you look on the second line, you'll see it.

I was using RealVTC to access my RPi. It was kind of handy to be able to copy and paste my screenshots after trying each of the commands in your tutorial, so that you could see what was going on. But, the screen for the VTC viewer caused the text, that should have been at the end of my command line, to wrap around to the next line.

I'll give it another shot tomorrow.

-Mike

User avatar
flatmax
Posts: 318
Joined: Thu May 26, 2016 10:36 pm

Re: Tutorial 0 - Programming GTK GUIs using gtkIOStream

Sat Feb 04, 2017 4:21 am

To be able to cut and paste text, you can use ssh (on windows putty). If you also want to be able to open the xwindows from the Pi on your microsoft box, you will need to follow something like this blog :
http://raspberrypiprogramming.blogspot. ... -from.html
Zero sound card for the Pi - live now on kickstarter : http://kck.st/2rwkQMH
Sound card for the Raspberry Pi with inbuilt microphone : http://www.audioinjector.net
Audio Inector Octo multitrack GPIO sound card : http://www.audioinjector.net

MikeG58
Posts: 10
Joined: Thu Jan 05, 2017 7:09 am

Re: Tutorial 0 - Programming GTK GUIs using gtkIOStream

Sat Feb 04, 2017 5:37 am

Matt,

Code: Select all

pi@raspberrypi:~/gtkiostream-1.5.0 $ g++ test/LabelsTest.C -o test/LabelsTest `pkg-config gtk+-3.0 --cflags --libs` Iinclude
g++: error: Iinclude: No such file or directory
pi@raspberrypi:~/gtkiostream-1.5.0 $ ls include
Alignment.H    CairoCircle.H       DragNDrop.H    gtkDialog.H     MessageDialog.H  Plot.H             Sox.H       WSOLAJack.H
AudioMask      ColourLineSpec.H    DrawingArea.H  gtkInterface.H  mffm             posixForMicrosoft  Surface.H   xpm
BlockBuffer.H  colourWheel.H       DSP            GtkUtils.H      NeuralNetwork.H  ProgressBar.H      Table.H
Box.H          ComboBoxText.H      EventBox.H     IIO             Octave.H         Scales.H           TextView.H
Buttons.H      commonTimeCodeX.H   Examples.H     JackClient.H    OptionParser.H   Scrolling.H        Thread.H
CairoArc.H     Container.H         fft            Labels.H        ORB.H            SelectionArea.H    Time.H
CairoArrow.H   Debug.H             FileGtk.H      Makefile.am     Pango.H          Selection.H        Widget.H
CairoBox.H     DirectoryScanner.H  Frame.H        Makefile.in     Pixmap.H         Separator.H        WSOLA.H
Sigh! There seems to be something very subtle, that I'm missing.

Also, Matt. Where is the LabelsTest.C program I'm trying to compile?

-Mike

User avatar
PeterO
Posts: 3614
Joined: Sun Jul 22, 2012 4:14 pm

Re: Tutorial 0 - Programming GTK GUIs using gtkIOStream

Sat Feb 04, 2017 7:37 am

MikeG58 wrote:Sigh! There seems to be something very subtle, that I'm missing.
The "-" infront of "Iinclude" is missing ! :D It should be

Code: Select all

g++ test/LabelsTest.C -o test/LabelsTest $(pkg-config gtk+-3.0 --cflags --libs)  -Iinclude
PeterO
Discoverer of the PI2 XENON DEATH FLASH!
Interests: C,Python,PIC,Electronics,Ham Radio (G0DZB),Aeromodelling,1960s British Computers.
"The primary requirement (as we've always seen in your examples) is that the code is readable. " Dougie Lawson

User avatar
flatmax
Posts: 318
Joined: Thu May 26, 2016 10:36 pm

Re: Tutorial 0 - Programming GTK GUIs using gtkIOStream

Sat Feb 04, 2017 10:55 am

Yep - PeterO got it !

The file paths go something like this. For tutorial 0 you are in the gtkiostream-1.5.0 directory.
The header files are in the include directory.
The LabelsTest.C file is in the test directory.

Lets dissect this line :

Code: Select all

g++ test/LabelsTest.C -o test/LabelsTest `pkg-config gtk+-3.0 --cflags --libs` -Iinclude

Code: Select all

 test/LabelsTest.C
is the file we are compiling.

Code: Select all

-o test/LabelsTest
means, output the binary to the test directory using the file name LabelsTest

Code: Select all

-Iinclude
means, "-I" add the include path "include" which is the directory with the headers in it.

Matt
Zero sound card for the Pi - live now on kickstarter : http://kck.st/2rwkQMH
Sound card for the Raspberry Pi with inbuilt microphone : http://www.audioinjector.net
Audio Inector Octo multitrack GPIO sound card : http://www.audioinjector.net

MikeG58
Posts: 10
Joined: Thu Jan 05, 2017 7:09 am

Re: Tutorial 0 - Programming GTK GUIs using gtkIOStream

Mon Feb 06, 2017 8:35 pm

Matt,

OK. I got that straightened out and tried it just now. At this point, I'm not for sure what the system is supposed to do after entering that command. I have about two screens of information. There are arrows pointing to various places, usually, the closing parenthesis.

I think I need some more time with Linux to get this all sorted.

-Mike

User avatar
flatmax
Posts: 318
Joined: Thu May 26, 2016 10:36 pm

Re: Tutorial 0 - Programming GTK GUIs using gtkIOStream

Mon Feb 06, 2017 11:50 pm

OK - no worries!

Matt
Zero sound card for the Pi - live now on kickstarter : http://kck.st/2rwkQMH
Sound card for the Raspberry Pi with inbuilt microphone : http://www.audioinjector.net
Audio Inector Octo multitrack GPIO sound card : http://www.audioinjector.net

1dot0
Posts: 379
Joined: Mon Nov 28, 2016 12:31 pm

Re: Tutorial 0 - Programming GTK GUIs using gtkIOStream

Fri May 12, 2017 2:13 pm

hello,
The first test program (see below) runs fine from console with

Code: Select all

    cd gtkiostream-1.5.0
    g++ test/LabelsTest.C -o test/LabelsTest `pkg-config gtk+-2.0 --cflags --libs` -Iinclude

But I have a problem to run this gtkiostream with Geany.


I added

Code: Select all

`pkg-config gtk+-2.0 --cflags --libs` -I/gtkiostream-1.5.0/include
to my current compile/build parameters.

My entire compile / build parameter string is now then:

Code: Select all

g++ -Wall -pthread -I/opt/vc/include -I/opt/vc/include/interface/vmcs_host/linux -I/opt/vc/include/interface/vcos/pthreads -o "%e" "%f" -lshapes -L/opt/vc/lib -lOpenVG -lEGL -lwiringPi -lArduiPi_OLED `pkg-config gtk+-2.0 --cflags --libs` -I/gtkiostream-1.5.0/include
Nevertheless, with the test program labelstest.c loaded in Geany I get the compile error
gtkInterface.H: file or directory not found.
also if I exchange

Code: Select all

`pkg-config gtk+-2.0 --cflags --libs`
by

Code: Select all

$(pkg-config gtk+-2.0 --cflags --libs)
it's about the same error, or actually a fatal error.


Code: Select all


#include "gtkInterface.H"
#include "Buttons.H"
#include "Labels.H"

static void quit(void *wid, gpointer data){
  gtk_main_quit();
}

int main(int argc, char *argv[]){

  gtk_init( &argc, &argv ); // init GTK

  GtkInterface topWindow; // Create the top box

  Buttons buttons; // create a quit button
  buttons<<BUTTONLABELSTRUCT("Quit", quit, NULL);

  Labels labs; // create a labels list
  labs<<" this is 1"<<" this is 2"; // Load some labels

  HBox hBox; // create an HBox
  hBox << buttons << labs; // load the button and label into the HBox
  hBox.show(); // show the HBox
  topWindow << hBox; // Load the HBox into the top window

  gtk_main(); // run GTK+
}


what is wrong, what am I missing?

1dot0
Posts: 379
Joined: Mon Nov 28, 2016 12:31 pm

Re: Tutorial 0 - Programming GTK GUIs using gtkIOStream

Fri May 12, 2017 8:07 pm

no idea or proposal anyone? :roll:

User avatar
PeterO
Posts: 3614
Joined: Sun Jul 22, 2012 4:14 pm

Re: Tutorial 0 - Programming GTK GUIs using gtkIOStream

Fri May 12, 2017 8:09 pm

1dot0 wrote:no idea or proposal anyone? :roll:
Use a properly maintained library like http://www.gtkmm.org/en/

PeterO
Discoverer of the PI2 XENON DEATH FLASH!
Interests: C,Python,PIC,Electronics,Ham Radio (G0DZB),Aeromodelling,1960s British Computers.
"The primary requirement (as we've always seen in your examples) is that the code is readable. " Dougie Lawson

1dot0
Posts: 379
Joined: Mon Nov 28, 2016 12:31 pm

Re: Tutorial 0 - Programming GTK GUIs using gtkIOStream

Fri May 12, 2017 8:14 pm

do you want to express that I will not be able to make this gtkIOStream lib work with Geany? :(

1dot0
Posts: 379
Joined: Mon Nov 28, 2016 12:31 pm

Re: Tutorial 0 - Programming GTK GUIs using gtkIOStream

Fri May 12, 2017 8:16 pm

OTOH, I would really like to give that a try, if I only knew how the g++ parametrs will have to look like, once and for all for all other examples

User avatar
PeterO
Posts: 3614
Joined: Sun Jul 22, 2012 4:14 pm

Re: Tutorial 0 - Programming GTK GUIs using gtkIOStream

Fri May 12, 2017 8:33 pm

1dot0 wrote:do you want to express that I will not be able to make this gtkIOStream lib work with Geany? :(
I'm saying that there are more widely used alternatives where there is more than one person that can help you.

PeterO
Discoverer of the PI2 XENON DEATH FLASH!
Interests: C,Python,PIC,Electronics,Ham Radio (G0DZB),Aeromodelling,1960s British Computers.
"The primary requirement (as we've always seen in your examples) is that the code is readable. " Dougie Lawson

1dot0
Posts: 379
Joined: Mon Nov 28, 2016 12:31 pm

Re: Tutorial 0 - Programming GTK GUIs using gtkIOStream

Fri May 12, 2017 8:41 pm

well, tbh, many other libs are not easy to understand, but gtkIOStream seems to promise a quick learning curve.
So before I fail right at the start I would first try to make it work with Geany, and who finally knows, if different libs are supposed to work with Geany out of the box.
So is that really so hard to tell how the build parameters of gtkIOStream have to look like for Geany, and what is faulty with my attempt?

1dot0
Posts: 379
Joined: Mon Nov 28, 2016 12:31 pm

Re: Tutorial 0 - Programming GTK GUIs using gtkIOStream

Fri May 12, 2017 9:59 pm

so has anyone an idea how the g++ gtkIOStream build parameters will have to look like for Geany and what's wrong with mine?

1dot0
Posts: 379
Joined: Mon Nov 28, 2016 12:31 pm

Re: Tutorial 0 - Programming GTK GUIs using gtkIOStream

Sat May 13, 2017 7:28 am

again, in other words:
what is wrong or missing for Geany to be added for compile and build preferences, e.g. by

Code: Select all

`pkg-config gtk+-2.0 --cflags --libs` -I/gtkiostream-1.5.0/include
or

Code: Select all

$(pkg-config gtk+-2.0 --cflags --libs) -I/gtkiostream-1.5.0/include

1dot0
Posts: 379
Joined: Mon Nov 28, 2016 12:31 pm

Re: Tutorial 0 - Programming GTK GUIs using gtkIOStream

Sat May 13, 2017 2:00 pm

can that be true?
no one can give me the answer how to get the parameter flags correct for Geany?

Return to “Graphics programming”

Who is online

Users browsing this forum: No registered users and 5 guests