Simple QEdje Example

Code

#include <QtGui>
#include <QtCore>
#include <qedje.h>

int main(int argc, char **argv)
{
    QApplication app(argc, argv);
    QZionCanvas canvas;

    // load edje group "main" from file "qedje-example1.edj"
    QEdje main = QEdje(&canvas, "qedje-example1.edj", "main");

    // show window
    main.show();
    canvas.show();

    return app.exec();
}

Theme file

images {
   image: "images/bg.jpg" COMP;
   image: "images/ico1.png" COMP;
   image: "images/ico2.png" COMP;
}

collections {
   group {
      name: "main";
      min: 800 480;

      parts {
         part {
            name: "background";
            type: IMAGE;
            description {
               state: "default" 0.0;
               rel1 {
                  relative: 0.0 0.0;
                  offset: 0 0;
               }
               rel2 {
                  relative: 1.0 1.0;
                  offset: -1 -1;
               }
               image.normal: "images/bg.jpg";
            }
         }

         part {
            name: "icon/left";
            type: IMAGE;
            description {
               state: "default" 0.0;
               min: 120 120;
               rel1 {
                  relative: 0.0 0.5;
                  offset: 100 -60;
               }
               rel2 {
                  relative: 0.0 0.5;
                  offset: 100 60;
               }
               image.normal: "images/ico1.png";
            }
            description {
               state: "centered" 0.0;
               inherit: "default" 0.0;
               max: 200 200;
               rel1 {
                  relative: 0.5 0.5;
                  offset: -100 -100;
               }
               rel2 {
                  relative: 0.5 0.5;
                  offset: 100 100;
               }
            }
         }

         part {
            name: "icon/right";
            type: IMAGE;
            description {
               state: "default" 0.0;
               min: 120 120;
               rel1 {
                  relative: 1.0 0.5;
                  offset: -100 -60;
               }
               rel2 {
                  relative: 1.0 0.5;
                  offset: -100 60;
               }
               image.normal: "images/ico2.png";
            }
            description {
               state: "centered" 0.0;
               inherit: "default" 0.0;
               max: 200 200;
               rel1 {
                  relative: 0.5 0.5;
                  offset: -100 -100;
               }
               rel2 {
                  relative: 0.5 0.5;
                  offset: 100 100;
               }
            }
         }

         program {
            name:       "icon/left,click";
            signal:     "mouse,clicked,1";
            source:     "icon/left";
            action:      STATE_SET "default" 0.0;
            target:     "icon/right";
            transition:  LINEAR 0.5;
            after:      "icon/left,focus";
         }
         program {
            name:       "icon/left,focus";
            action:      STATE_SET "centered" 0.0;
            target:     "icon/left";
            transition:  LINEAR 0.5;
         }

         program {
            name:       "icon/right,click";
            signal:     "mouse,clicked,1";
            source:     "icon/right";
            action:      STATE_SET "default" 0.0;
            target:     "icon/left";
            transition:  LINEAR 0.5;
            after:      "icon/right,focus";
         }
         program {
            name:       "icon/right,focus";
            action:      STATE_SET "centered" 0.0;
            target:     "icon/right";
            transition:  LINEAR 0.5;
         }
      }
   }
}

Running the example

Get the code here: qedje-example1.tar.gz

Uncompressing:

$ tar -xvzf qedje-example1.tar.gz

Compiling the code:

$ cd qedje-example1
$ qmake
$ make

Compiling the theme:

$ edje_cc qedje-example1.edc

Running the example:

$ ./qedje-example1