/*
+--------------------------------------------------------------------------
| The Bible Enigma1 Tutorial
| ========================================
| By: Bacicciosat aka Meo aka Luponero
|
| Enigma 1 API GUI tutorial whith Sources Code and Comments
| (c) august 2006 by Meo
|
+---------------------------------------------------------------------------
*/
Warning: You cannot modify, redistribute or publish this tutorial in any way without header and Bacicciosat credits.
SUMMARY:
Enviroment setup to compile your code
Application Structure Overview
Lesson1: Hello World Window
Lesson2: Buttons
Lesson3: MessageBox
Lesson4: TextInput
Lesson5: Checkbox
Lesson6: Listbox
Lesson7: Combobox
Lesson8: Http Connection and Download
This tutorial doesn't pretend to be exhaustive about all Enigma Functions.
The API of Enigma are written very well. They are all in C++ and they are therefore, easy to use. The only problem is that the API are not documented.
This tutorial has the intent do describe the main Enigma GUI Api.
Every lesson will treat a GUI object with the main object calls, methods and flags.
All the lessons will be supplied with Code Examples, shoots, sources and a little compiled demonstration.
Let's go to start.
The Following 7 Users Say Thank You to bacicciosat For This Useful Post:
Before to start to learn Enigma you need an Environment to compile
sources and test the code.
You need:
1) A pc with Linux opsys
2) enigma CDK
Warning: If you install the Enigma CDK following these instructions and using the directory /dream as described here you can compile all the demo sources with the supplied makefile. Otherwise you have to change paths in the makefile to accord it with your installed CDK.
Instructions to setup your environment.
1) Be sure you have installed on your Pc a recent Linux distribution with the following packages:
- cvs
- autoconf >= 2.57a
- automake >= 1.8
- libtool >= 1.4.2
- gettext >= 0.12.1
- make >= 3.79
- makeinfo (texinfo)
- tar
- bunzip2 (bzip2)
- gunzip (gzip)
- patch
- infocmp (ncurses-bin / ncurses-devel)
- gcc 2.95 or >= 3.0
- g++ 2.95 or >= 3.0
- flex
- bison
- pkg-config
- wget
- libpng2 or libpng3 (DirectFB)
2) Login into Linux machine as root and digit this commands from the command line. (Warning to the dot after rdreambox).
This is a long procedure and will take some hours.
Code:
cd /
mkdir /dream
cd /dream
export CVS_RSH=ssh
cvs -d anoncvs@cvs.tuxbox.org:/cvs/tuxbox -z3 co -P -rdreambox .
cd cdk
chmod ugo+x prepare
./prepare dm7000
make checkout
make dreamboximage_root
make rebuild-flash
make flash-compress
This is a standard procedure and you can find many tutorials in the net to install Enigma1 cdk.
Once you have installed the CDK you are ready to continue with this tutorial and to compile the demo applications provided.
You have only to create a working directory as for example:
mkdir mydevel
and copy in it the sources you want to compile.
To compile a demo source you have only to go in this directory and digit the command:
make
To test a compiled code you have only to upload in your Dreambox in /var/tuxbox/plugins directory
the files:
Bibledemo.so
Bibledemo.cfg
To be continued ...
The Following 3 Users Say Thank You to bacicciosat For This Useful Post:
/*
+--------------------------------------------------------------------------
| The Bible Enigma1 Tutorial
| ========================================
| By: Bacicciosat aka Meo aka Luponero
|
| Enigma 1 API GUI tutorial whith Sources Code and Comments
| (c) august 2006 by Meo
|
+---------------------------------------------------------------------------
*/
Warning: You cannot modify, redistribute or publish this tutorial in any way without header and Bacicciosat credits.
2. Application Structure Overview
Enigma Applications use C++ language.
Enigma Applications can run into your Dreambox as extensions named plugins.
Every plugin is composed by.
1) a .cfg file (a simple text file)
2) a .so compiled and executable file (the real apllication)
Warning: These files need to have the same name. The difference is only in the extension.
As for Example: demo.so and demo.cfg
----------------
1) About .cfg file:
The .cfg file contains informations about our application.
This is a standard .cfg file that we will use for our examples.
The only part of .cfg file you need to modify is the line "name".
This line contains the name of your application that will be shown in the Dreambox Plugins List.
The .so file is the real application. It is the compiled source.
The source file is a C++ file and have the .cpp extension.
When we will compile the source file we will have the .so file that we can upload on your Dreambox.
So, to create a new Enigma application (plugn) we need a .cfg file a .ccp file and a makefile to compile the .cpp source file.
All these files are provided in this tutorial. You can study, modify and compile Enigma applications using these demo files.
3) An overview to source code application:
As described below our code application is contained in a source file (.cpp) that we will compile to obtain the .so file.
This source file is a normal C++ source file that contains the C and C++ libraries and the Enigma libraries and API.
To illustrate an Enigma source file we can divide it in 4 main sections:
a) Include files (Libraries needed by our code. We can use: C libraries, C++ libraries, Enigma libraries)
b) Class and Functions declarations (We have to declare the classes and the functions we will use in our code)
c) The application entry point (The function that Enigma will call to start the execution of our application)
d) The code (We will call Enigma Api and functions in normal C++ code to manage Enigma Graphical Objects).
Ok we are now ready to start our first Enigma application.
To be continued....
The Following 4 Users Say Thank You to bacicciosat For This Useful Post:
/*
+--------------------------------------------------------------------------
| The Bible Enigma1 Tutorial
| ========================================
| By: Bacicciosat aka Meo aka Luponero
|
| Enigma 1 API GUI tutorial with Sources Code and Comments
| (c) august 2006 by Meo
|
+---------------------------------------------------------------------------
*/
Lesson1: Hello World Window
You can find in attach:
- the cfg file (Bibledemo.cfg)
- the compiled and working plugin (Bibledemo.so)
- the source file (bibledemo.cpp)
- the makefile (nedeed to compile code if you want to modify source)
Ok this is the first lesson.
We will create an Enigma application (a plugin) that will show in your dremabox a simple window displayng the message "Hello World".
You can see the example in the screenshot.
You can test this application simply uploading in your dreambox (/var/tuxbox/plugins) the files that you can find in attach: Bibledemo.cfg and Bibledemo.so
You can modify this application editing the source file bibledemo.cpp and recompiling it to have a new Bibledemo.so file.
The Enigma API we will explain in this lesson is the Window creation.
This are the main Api about window creation:
Ok now that we have listed the main API we can write the code.
In this first lesson i will post here all the code commenting it line by line.
Let'go.
bibledemo.cpp:
First of all we have to include all the libraries we need for our application (in this case we need: the Enigma plugin library, the standard C library, the Enigma ewndow library to create the widnows and the Enigma elabel library to insert the text in a label) :
Ok Now we have to declare the class we will use in our application:
Code:
// The Class declaration of our Main Window
class eBibleMainWindow: public eWindow
{
// the label to show the text
eLabel *label;
public:
// the constructor.
eBibleMainWindow();
// the destructor.
~eBibleMainWindow();
};
Perfect !! Now we have to add the function that Enigma will call to execute our application. The "Entry point".
Code:
// The plugin entry point, Here start the code execution
extern "C" int plugin_exec( PluginParam *par )
{
// our demo dialog instance.
eBibleMainWindow dlg;
// show the dialog...
dlg.show();
// give control to dialog.. (the dialog is modal!)
int result=dlg.exec();
// and after it, hide it again.
dlg.hide();
return result;
}
The code execution is started. now we can add the code to create our window and to show our message "Hello World".
In this code we:
1) Create our Main Window
2) Give to our Window a position in the screen
3) Give to our window X and Y dimensions
4) Set the Window Title
5) Create a label to show the message
6) Give to the label position and dimensions
7) Insert the message in the label
Code:
eBibleMainWindow::eBibleMainWindow(): eWindow(1)
{
// move our dialog to 100.100...
cmove(ePoint(100, 100));
// ...and give x and y dimensions.
cresize(eSize(520, 376));
// set a title.
setText("Enigma Bible Lesson 1: Window");
// create a label to show a text.
label=new eLabel(this);
// give a position
label->move(ePoint(50, 50));
// set the label dimensions
label->resize(eSize(200, 100));
// set the label text
label->setText("Hello World !!");
}
Finally we have to add only an automatic function to windows destroing. We have to do nothing. Only add this standard and automatic function:
Code:
eBibleMainWindow::~eBibleMainWindow()
{
// we have to do almost nothing here. all widgets are automatically removed
// since they are child of us. the eWidget-destructor will to this for us.
}
As you can see is very simply.
You can now exercize to compile source you find in the attach package and to modify it.
Exercises:
- Change the window title
- Change the window position and dimensions
- Change label position inside the window
That's all, and this is the apllication shot and the complete package.
(to be continued in lesson 2 ... )
The Following 7 Users Say Thank You to bacicciosat For This Useful Post:
/*
+--------------------------------------------------------------------------
| The Bible Enigma1 Tutorial
| ========================================
| By: Bacicciosat aka Meo aka Luponero
|
| Enigma 1 API GUI tutorial with Sources Code and Comments
| (c) august 2006 by Meo
|
+---------------------------------------------------------------------------
*/
Lesson2: Buttons
You can find in attach:
- the cfg file (Bibledemo.cfg)
- the compiled and working plugin (Bibledemo.so)
- the source file (bibledemo.cpp)
- the makefile (nedeed to compile code if you want to modify source)
Ok this is the second lesson.
We will add to our window a button to exit from application.
You can see the example in the screenshot.
You can test this application simply uploading in your dreambox (/var/tuxbox/plugins) the files that you can find in attach: Bibledemo.cfg and Bibledemo.so
You can modify this application editing the source file bibledemo.cpp and recompiling it to have a new Bibledemo.so file.
The Enigma API we will explain in this lesson is the button creation.
These are the main Api about button creation and managing:
Code:
// create button
eButton(eWidget *parent);
// set button text
setText(eString string);
// positioning
move(ePoint(x, y));
// sizing
resize(eSize(x, y));
// set shortcut and pixmap
setShortcut(int color);
setShortcutPixmap(int pixmap);
// decore with a frame
loadDeco();
// function to call when button is pressed
CONNECT(eButton->selected, function);
Ok now that we have listed the main API we can write the code.
You can fnd the complete application code in the attach package
(bibledemo.cpp). Here i will comment only the code added in this
lesson.
Let'go.
bibledemo.cpp additions:
First of all we have to add to our include files the Enigma button library:
Code:
#include <lib/gui/ebutton.h>
Ok Now we have to add the button in our main class. This is the new class declaration:
Code:
// The Class declaration of our Main Window
class eBibleMainWindow: public eWindow
{
// the label to show the text
eLabel *label;
// the button
eButton *ok;
public:
// the constructor.
eBibleMainWindow();
// the destructor.
~eBibleMainWindow();
};
Perfect !! Now we have to add the button in our main function code
This is our new main Function:
Code:
eBibleMainWindow::eBibleMainWindow(): eWindow(1)
{
// move our dialog to 100.100...
cmove(ePoint(100, 100));
// ...and give x and y dimensions.
cresize(eSize(520, 376));
// set a title.
setText("Enigma Bible Lesson 2: Button");
// create a label to show a text.
label=new eLabel(this);
// give a position
label->move(ePoint(50, 50));
// set the label dimensions
label->resize(eSize(200, 100));
// set the label text
label->setText("Push button to exit !!");
// create the button
ok = new eButton(this);
// set the button text
ok->setText("Exit");
// set position
ok->move(ePoint((clientrect.width() - 90)/2, clientrect.height() - 60));
// set size
ok->resize(eSize(90, 40));
// set shortcut and pixmap
ok->setShortcut("green");
ok->setShortcutPixmap("green");
// decore with a frame
ok->loadDeco();
// function to call when buton is pressed
CONNECT(ok->selected, eWidget::accept);
// set focus to the button
setFocus(ok);
}
As you can see is very simply.
You can now exercise to compile source you find in the attach package and to modify it.
Exercises:
- Change the button text shortcut and position
- Add another button
That's all, and this is the application shot and the complete package.
(to be continued in lesson 3 ... )
The Following 3 Users Say Thank You to bacicciosat For This Useful Post:
/*
+--------------------------------------------------------------------------
| The Bible Enigma1 Tutorial
| ========================================
| By: Bacicciosat aka Meo aka Luponero
|
| Enigma 1 API GUI tutorial with Sources Code and Comments
| (c) august 2006 by Meo
|
+---------------------------------------------------------------------------
*/
Lesson3: MessageBox
You can find in attach:
- the cfg file (Bibledemo.cfg)
- the compiled and working plugin (Bibledemo.so)
- the source file (bibledemo.cpp)
- the makefile (nedeed to compile code if you want to modify source)
Ok this is the third lesson.
We will add to our window two buttons to call two different messageboxes.
You can see the example in the screenshot.
You can test this application simply uploading in your dreambox (/var/tuxbox/plugins) the files that you can find in attach: Bibledemo.cfg and Bibledemo.so
You can modify this application editing the source file bibledemo.cpp and recompiling it to have a new Bibledemo.so file.
The Enigma API we will explain in this lesson is the messaagebox creation.
These are the main Api about messagebox creation and managing:
Ok now that we have listed the main API we can write the code.
You can fnd the complete application code in the attach package
(bibledemo.cpp). Here i will comment only the code added in this
lesson.
Let'go.
bibledemo.cpp additions:
First of all we have to add to our include files the Enigma button library:
Code:
#include <lib/gui/emessage.h>
Ok Now we have to add two functions to our main class:
void message1();
void message2();
we will connect the execution of these functions to the buttons.
In this way when a butto will be pressed one of these functions will be called and it will show one messagebox.
This is our new main class declaration:
Code:
// The Class declaration of our Main Window
class eBibleMainWindow: public eWindow
{
// the label to show the text
eLabel *label;
// the function to call when button 1 is pushed
void message1();
// the function to call when button 2 is pushed
void message2();
public:
// the constructor.
eBibleMainWindow();
// the destructor.
~eBibleMainWindow();
};
Perfect !! Now we have to add the two buttons in our main function code to call the functions that will show the messageboxes.
This is our new main Function:
Code:
eBibleMainWindow::eBibleMainWindow(): eWindow(1)
{
// move our dialog to 100.100...
cmove(ePoint(100, 100));
// ...and give x and y dimensions.
cresize(eSize(520, 376));
// set a title.
setText("Enigma Bible Lesson 3: MessageBox");
// create a label to show a text.
label=new eLabel(this);
// give a position
label->move(ePoint(20, 50));
// set the label dimensions
label->resize(eSize(400, 100));
// set the label text
label->setText("Push a button to show a MessageBox");
// create buttons and set properties
eButton * ok = new eButton(this);
ok->setText("Simply");
ok->move(ePoint((clientrect.width() - 200)/2, clientrect.height() - 60));
ok->resize(eSize(90, 40));
ok->loadDeco();
// function to call when button1 is pushed
CONNECT(ok->selected, eBibleMainWindow::message1);
eButton * ok2 = new eButton(this);
ok2->setText("Inter");
ok2->move(ePoint((clientrect.width())/2, clientrect.height() - 60));
ok2->resize(eSize(90, 40));
ok2->loadDeco();
// function to call when button2 is pushed
CONNECT(ok2->selected, eBibleMainWindow::message2);
// set focus on 1 button
setFocus(ok);
}
Ok Now we have to add the function that will show the first MessageBox (Simply messagebox with only one button):
Code:
void eBibleMainWindow::message1()
{
// create messagebox
eMessageBox msg("Hi by Bacicciosat :-)", "Info", eMessageBox::iconInfo|eMessageBox::btOK);
// show it
msg.show();
// execute
msg.exec();
// hide after execution (button pressed)
msg.hide();
}
Finally we have to add the function that will show the second MessageBox (modal messagebox with two buttons):
Code:
void eBibleMainWindow::message2()
{
// create messagebox (two buttons yes/no)
eMessageBox box("Do you want to exit?", "Question", eMessageBox::btYes|eMessageBox::btNo|eMessageBox::iconQuestion, eMessageBox::btYes);
// show it
box.show();
// execute code and store in the variable button the result (button pressed)
int button = box.exec();
// hide it after execution
box.hide();
// exit if button yes was pushed.
if (button == eMessageBox::btYes)
{
eWidget::accept();
}
}
As you can see is very simply.
You can now exercise to compile source you find in the attach package and to modify it.
Exercises:
- Change the icons text and buttons of MessageBoxes
- Add another Messagebox
That's all, and this is the application shot and the complete package.
(to be continued in lesson 4 ... )
The Following User Says Thank You to bacicciosat For This Useful Post:
/*
+--------------------------------------------------------------------------
| The Bible Enigma1 Tutorial
| ========================================
| By: Bacicciosat aka Meo aka Luponero
|
| Enigma 1 API GUI tutorial with Sources Code and Comments
| (c) august 2006 by Meo
|
+---------------------------------------------------------------------------
*/
Lesson4: TextInput
You can find in attach:
- the cfg file (Bibledemo.cfg)
- the compiled and working plugin (Bibledemo.so)
- the source file (bibledemo.cpp)
- the makefile (nedeed to compile code if you want to modify source)
Ok this is the 4 lesson.
We will add to our Window a TextInput and a messagebox to show the text we digit in the textinput.
You can see the example in the screenshot.
You can test this application simply uploading in your dreambox (/var/tuxbox/plugins) the files that you can find in attach: Bibledemo.cfg and Bibledemo.so
You can modify this application editing the source file bibledemo.cpp and recompiling it to have a new Bibledemo.so file.
The Enigma API we will explain in this lesson is the TextInput creation.
These are the main Api about TextInput creation and managing:
Ok now that we have listed the main API we can write the code.
You can find the complete application code in the attach package
(bibledemo.cpp). Here i will comment only the code added in this
lesson.
Let'go.
bibledemo.cpp additions:
First of all we have to add to our include files the Enigma TextInput library:
Code:
#include <lib/gui/textinput.h>
Ok Now we have to add the declaration of textinput in our main class.
We have to add a function too:
void message1();
we will connect the execution of this function to the button.
In this way when the butto will be pressed this function will be called and it will show one messagebox with the text we have inserted.
This is our new main class declaration:
Code:
// The Class declaration of our Main Window
class eBibleMainWindow: public eWindow
{
// the label to show the text
eLabel *label;
// the textinput
eTextInputField *mytext;
// function to execute when button is pushed
void message1();
public:
// the constructor.
eBibleMainWindow();
// the destructor.
~eBibleMainWindow();
};
Perfect !! Now we have to add the button in our main function code to call the function that will show the messagebox with the text.
This is our new main Function:
Code:
eBibleMainWindow::eBibleMainWindow(): eWindow(1)
{
// move our dialog to 100.100...
cmove(ePoint(100, 100));
// ...and give x and y dimensions.
cresize(eSize(520, 376));
// set a title.
setText("Enigma Bible Lesson 4: TextInput");
// create a label to show a text.
label=new eLabel(this);
// give a position
label->move(ePoint(20, 50));
// set the label dimensions
label->resize(eSize(400, 100));
// set the label text
label->setText("Push Ok Button and digit your text.");
// create textinput
mytext=new eTextInputField(this);
// give position
mytext->move(ePoint(20, 150));
// give size
mytext->resize(eSize(400, 40));
// set max number of characters
mytext->setMaxChars(100);
//mytext->setUseableChars("1234567890");
//mytext->setText(codeentry);
// show a frame decoration
mytext->loadDeco();
// create buttons and set properties
eButton * ok = new eButton(this);
ok->setText("Show");
ok->move(ePoint((clientrect.width() - 90)/2, clientrect.height() - 60));
ok->resize(eSize(100, 40));
ok->setShortcut("green");
ok->setShortcutPixmap("green");
ok->loadDeco();
// function to call when button is pushed
CONNECT(ok->selected, eBibleMainWindow::message1);
//set focus to textinput
setFocus(mytext);
}
Finally we have to add the function that will show the MessageBox with the text we have inserted in the textinput:
Code:
void eBibleMainWindow::message1()
{
// declare variable we will use in this function
eString message, message2;
// assign to message2 the textinput content
message2 = mytext->getText();
// compose message concatenating strings
message = "You wrote: " + message2;
// Create, show and execute the messagebox to display the message
eMessageBox msg((message), "Info", eMessageBox::iconInfo|eMessageBox::btOK);
msg.show();
msg.exec();
msg.hide();
}
As you can see is very simply.
You can now exercise to compile source you find in the attach package and to modify it.
Exercises:
- Set a default text in the textinput
- Set the characters that are allowed in the textinput
- Set the Max number of characters allowed in the textinput
That's all, and this is the application shot and the complete package.
(to be continued in lesson 5 ... )
The Following User Says Thank You to bacicciosat For This Useful Post:
/*
+--------------------------------------------------------------------------
| The Bible Enigma1 Tutorial
| ========================================
| By: Bacicciosat aka Meo aka Luponero
|
| Enigma 1 API GUI tutorial with Sources Code and Comments
| (c) august 2006 by Meo
|
+---------------------------------------------------------------------------
*/
Lesson5: Checkbox
You can find in attach:
- the cfg file (Bibledemo.cfg)
- the compiled and working plugin (Bibledemo.so)
- the source file (bibledemo.cpp)
- the makefile (nedeed to compile code if you want to modify source)
Ok this is the lesson number five.
We will add to our Window a Checkbox and a messagebox to show the in a message if the checkbox is checked or not.
You can see the example in the screenshot.
You can test this application simply uploading in your dreambox (/var/tuxbox/plugins) the files that you can find in attach: Bibledemo.cfg and Bibledemo.so
You can modify this application editing the source file bibledemo.cpp and recompiling it to have a new Bibledemo.so file.
The Enigma API we will explain in this lesson is the Checkbox creation.
These are the main Api about TextInput creation and managing:
Code:
// create Checkbox
eCheckbox(eWidget *parent, int checked=0, int takefocus=1, bool swapTxtPixmap=false, const char *deco="eCheckBox" );
// Functions:
setCheck(int c);
int isChecked() { return ischecked; }
Ok now that we have listed the main API we can write the code.
You can find the complete application code in the attach package
(bibledemo.cpp). Here i will comment only the code added in this
lesson.
Let'go.
bibledemo.cpp additions:
First of all we have to add to our include files the Enigma Checkbox library:
Code:
#include <lib/gui/echeckbox.h>
Ok Now we have to add the declaration of echeckbox in our main class.
We have to add a function too:
void message1();
we will connect the execution of this function to the button.
In this way when the butto will be pressed this function will be called and it will show one messagebox with the result.
This is our new main class declaration:
Code:
// The Class declaration of our Main Window
class eBibleMainWindow: public eWindow
{
// the label to show the text
eLabel *label;
// the Checkbox
eCheckbox *mycheck;
// function to execute when button is pushed
void message1();
public:
// the constructor.
eBibleMainWindow();
// the destructor.
~eBibleMainWindow();
};
Perfect !! Now we have to add the checkbox and the button in our main function code to call the function that will show the messagebox with the result.
This is our new main Function:
Code:
eBibleMainWindow::eBibleMainWindow(): eWindow(1)
{
// move our dialog to 100.100...
cmove(ePoint(100, 100));
// ...and give x and y dimensions.
cresize(eSize(520, 376));
// set a title.
setText("Enigma Bible Lesson 5: CheckBox");
// Create checkbox
mycheck=new eCheckbox(this, 1);
// give position
mycheck->move(ePoint(10, 200));
// give dimensions (x and y)
mycheck->resize(eSize(clientrect.width() - 20, 50));
// Text to display near the checkbox
mycheck->setText("Check / Uncheck Box");
// create button and set properties
eButton * ok = new eButton(this);
ok->setText("Show");
ok->move(ePoint((clientrect.width() - 90)/2, clientrect.height() - 60));
ok->resize(eSize(100, 40));
ok->setShortcut("green");
ok->setShortcutPixmap("green");
ok->loadDeco();
// function to call when button is pushed
CONNECT(ok->selected, eBibleMainWindow::message1);
//set focus to checkbox
setFocus(mycheck);
}
Finally we have to add the function that will show the MessageBox with the result:
Code:
void eBibleMainWindow::message1()
{
// declare variable we will use in this function
eString message;
// assign message to variable
message = "The Box is Unchecked";
// assign another message in case the box is checked
if (mycheck->isChecked()) {
message = "The Box is Checked";
}
// Create, show and execute the messagebox to display the message
eMessageBox msg((message), "Info", eMessageBox::iconInfo|eMessageBox::btOK);
msg.show();
msg.exec();
msg.hide();
}
As you can see is very simply.
You can now exercise to compile source you find in the attach package and to modify it.
Exercises:
- Set a default unchecked status to the checkbox
That's all, and this is the application shot and the complete package.
(to be continued in lesson 6 ... )
The Following User Says Thank You to bacicciosat For This Useful Post:
/*
+--------------------------------------------------------------------------
| The Bible Enigma1 Tutorial
| ========================================
| By: Bacicciosat aka Meo aka Luponero
|
| Enigma 1 API GUI tutorial with Sources Code and Comments
| (c) august 2006 by Meo
|
+---------------------------------------------------------------------------
*/
Lesson6: Listbox
You can find in attach:
- the cfg file (Bibledemo.cfg)
- the compiled and working plugin (Bibledemo.so)
- the source file (bibledemo.cpp)
- the makefile (nedeed to compile code if you want to modify source)
Ok this is the lesson number six.
We will add to our Window a Listbox and a messagebox to show the item of the list we have selected.
You can see the example in the screenshot.
You can test this application simply uploading in your dreambox (/var/tuxbox/plugins) the files that you can find in attach: Bibledemo.cfg and Bibledemo.so
You can modify this application editing the source file bibledemo.cpp and recompiling it to have a new Bibledemo.so file.
The Enigma API we will explain in this lesson is the Listbox creation.
These are only a part of the listbox API. The listbox is more complicated so we will examine here only the main calls:
Ok now that we have listed the main API we can write the code.
You can find the complete application code in the attach package
(bibledemo.cpp). Here i will comment only the code added in this
lesson.
Let's go.
bibledemo.cpp additions:
First of all we have to add to our include files the Enigma Listbox library.
Code:
#include <lib/gui/listbox.h>
Ok Now we have to add the declaration of listbox in our main class.
We have to add a function too:
void message1();
we will connect the execution of this function to listbox selection.
In this way when we will select an item this function will be called and it will show the listox item we have selected.
This is our new main class declaration:
Code:
// The Class declaration of our Main Window
class eBibleMainWindow: public eWindow
{
// the label to show the text
eLabel *label;
// the listbox
eListBox<eListBoxEntryText> *theList;
// function to execute when a item is selected
void message1(eListBoxEntryText *item);
public:
// the constructor.
eBibleMainWindow();
// the destructor.
~eBibleMainWindow();
};
Perfect !! Now we have to add the Listbox and populate it with items. We have also to connect the listbox
to the function that will be called when an item is selected:
Code:
eBibleMainWindow::eBibleMainWindow(): eWindow(1)
{
// move our dialog to 100.100...
cmove(ePoint(100, 100));
// ...and give x and y dimensions.
cresize(eSize(520, 376));
// set a title.
setText("Enigma Bible Lesson 6: Listbox");
// create a label to show a text.
label=new eLabel(this);
// give a position
label->move(ePoint(10, 10));
// set the label dimensions
label->resize(eSize(400, 60));
// set the label text
label->setText("What is your Favourite Dreambox Image ?");
// Create a Listbox
theList = new eListBox<eListBoxEntryText>(this);
// give a position
theList->move(ePoint(10, 100));
// set dimensions
theList->resize(eSize(clientrect.width() - 20, clientrect.height() - 160));
// decore witha frame
theList->loadDeco();
// set columns number
theList->setColumns(1);
// set flags
theList->beginAtomic();
theList->clearList();
// Populate Listbox with Items
new eListBoxEntryText(theList, "Gemini", (void *) (1));
new eListBoxEntryText(theList, "Colosseum", (void *) (2));
new eListBoxEntryText(theList, "Pli Flubber", (void *) (3));
new eListBoxEntryText(theList, "Juliet", (void *) (4));
theList->endAtomic();
// function to call when an Item is selected
CONNECT(theList->selected, eBibleMainWindow::message1);
// set focus to the list
setFocus(theList);
}
Finally we have to add the function that will show the MessageBox with the selected item:
Code:
void eBibleMainWindow::message1(eListBoxEntryText *item)
{
// declare variable we will use in this function
eString message, message2;
// assign to message2 the selected item text
message2 = item->getText();
// compose message concatenating strings
message = "Your Dreambox preferred Image is:\n " + message2;
// Create, show and execute the messagebox to display the message
eMessageBox msg((message), "Info", eMessageBox::iconInfo|eMessageBox::btOK);
msg.show();
msg.exec();
msg.hide();
}
As you can see is very simply.
You can now exercise to compile source you find in the attach package and to modify it.
Exercises:
- Retrieve the item key instead of the item text
- Create a label to show the selction change with the function: selectionChanged(eListBoxEntryText *item);
That's all, and this is the application shot and the complete package.
(to be continued in lesson 7 ... )
The Following User Says Thank You to bacicciosat For This Useful Post:
/*
+--------------------------------------------------------------------------
| The Bible Enigma1 Tutorial
| ========================================
| By: Bacicciosat aka Meo aka Luponero
|
| Enigma 1 API GUI tutorial with Sources Code and Comments
| (c) august 2006 by Meo
|
+---------------------------------------------------------------------------
*/
Lesson7: Combobox
You can find in attach:
- the cfg file (Bibledemo.cfg)
- the compiled and working plugin (Bibledemo.so)
- the source file (bibledemo.cpp)
- the makefile (nedeed to compile code if you want to modify source)
Ok this is the lesson number seven.
We will add to our Window a Combobox and a messagebox to show the item of the list we have selected.
You can see the example in the screenshot.
You can test this application simply uploading in your dreambox (/var/tuxbox/plugins) the files that you can find in attach: Bibledemo.cfg and Bibledemo.so
You can modify this application editing the source file bibledemo.cpp and recompiling it to have a new Bibledemo.so file.
The Enigma API we will explain in this lesson is the Combobox creation.
These are only a part of the listbox API. The Combobox is more complicated and it is a box containing a Listbox so we will examine here only the main calls:
Code:
// create Combobox
eComboBox(eWidget* parent, int OpenEntries=5, eLabel* desc=0, int takefocus=1, const char *deco="eComboBox" );
// Functions:
int setCurrent( int, bool=false );
// Listbox items:
//create new item:
eListBoxEntryText(eListBox<eListBoxEntryText>* lb, const char* txt=0, void *key=0, int align=0, const eString &hlptxt="", int keytype = value );
// retrieve selected item
getCurrent()->getText();
// retrieve selected key
getCurrent()->getKey()
Ok now that we have listed the main API we can write the code.
You can find the complete application code in the attach package
(bibledemo.cpp). Here i will comment only the code added in this
lesson.
Let's go.
bibledemo.cpp additions:
First of all we have to add to our include files the Enigma Combobox library.
Code:
#include <lib/gui/combobox.h>
Ok Now we have to add the declaration of Combobox in our main class.
We have to add a function too:
void message1();
we will connect the execution of this function to a button.
In this way when the button is pushed this function will be called and it will show the Combobox item we have selected.
This is our new main class declaration:
Code:
// The Class declaration of our Main Window
class eBibleMainWindow: public eWindow
{
// the label to show the text
eLabel *label;
// the listbox
eListBox<eListBoxEntryText> *theList;
// the combobox
eComboBox *Lang;
// function to execute whwn button is pushed
void message1();
public:
// the constructor.
eBibleMainWindow();
// the destructor.
~eBibleMainWindow();
};
Perfect !! Now we have to add the Combobox and populate it with items. We have also to add a button and to connect it
to the function that will show a messagebox:
Code:
eBibleMainWindow::eBibleMainWindow(): eWindow(1)
{
// move our dialog to 100.100...
cmove(ePoint(100, 100));
// ...and give x and y dimensions.
cresize(eSize(520, 376));
// set a title.
setText("Enigma Bible Lesson 7: Combobox");
// create a label to show a text.
label=new eLabel(this);
// give a position
label->move(ePoint(50, 50));
// set the label dimensions
label->resize(eSize(400, 60));
// set the label text
label->setText("Select your language");
// Create the Combobox
Lang=new eComboBox(this, 4);
// Populate the Combobox with a List of Items
new eListBoxEntryText(*Lang, "English", (void *) (0));
new eListBoxEntryText(*Lang, "French", (void *) (1));
new eListBoxEntryText(*Lang, "Italian", (void *) (2));
new eListBoxEntryText(*Lang, "Dutch", (void *) (3));
// set Combobox position
Lang->move(ePoint(50, 160));
// Combo dimensions
Lang->resize(eSize(clientrect.width()-120, 35));
// set the default entry of Combobox to the first element of the list
Lang->setCurrent(0);
// decore Combo with a frame
Lang->loadDeco();
// create button and set properties
eButton * ok = new eButton(this);
ok->setText("Show");
ok->move(ePoint((clientrect.width() - 90)/2, clientrect.height() - 60));
ok->resize(eSize(100, 40));
ok->setShortcut("green");
ok->setShortcutPixmap("green");
ok->loadDeco();
// function to call when button is pushed
CONNECT(ok->selected, eBibleMainWindow::message1);
// set focus to the Combobox
setFocus(Lang);
}
Finally we have to add the function that will show the MessageBox with the selected item:
Code:
void eBibleMainWindow::message1()
{
// declare variable we will use in this function
eString message, message2;
// assign to message2 the selected item text
message2 = Lang->getCurrent()->getText();
// compose message concatenating strings
message = "Your Language is:\n " + message2;
// Create, show and execute the messagebox to display the message
eMessageBox msg((message), "Info", eMessageBox::iconInfo|eMessageBox::btOK);
msg.show();
msg.exec();
msg.hide();
}
As you can see is very simply.
You can now exercise to compile source you find in the attach package and to modify it.
Exercises:
- Retrieve the item key instead of the item text
That's all, and this is the application shot and the complete package.
(to be continued in lesson 8 ... )
The Following User Says Thank You to bacicciosat For This Useful Post:
