This example shows how to register a custom layout to be used by the Edje box part.

It will use \hyperlink{group__Edje__Part__Box_gac29c0dd222aaab5743b2a57f05d3c08d}{edje\+\_\+box\+\_\+layout\+\_\+register()} for that.

To play with this example, use the keyboard modifier keys and number keys together. The Ctrl key is used for adding elements, and Shift is used for removing them. For instance, Ctrl + 3 will insert a new rectangle object in the 3rd position of the box, while Shift + 6 will try to remove the 6th element of the box.

This example is very similar to the other box example, has a structure with global data, a callback for key down events where we create or delete rectangle objects and add or remove them to/from the box part.

But the important part is the next one\+:

 
\begin{DoxyCodeInclude}
\textcolor{keyword}{static} \textcolor{keywordtype}{void}
custom\_layout(\hyperlink{group__Evas__Object__Group_ga9e19e6dd1f517a0ba437c0114d3e7c97}{Evas\_Object} *o, \hyperlink{struct__Evas__Object__Box__Data}{Evas\_Object\_Box\_Data} *p, \textcolor{keywordtype}{void} *data 
      EINA\_UNUSED)
\{
   \hyperlink{struct__Evas__Object__Box__Option}{Evas\_Object\_Box\_Option} *opt;
   \hyperlink{struct__Eina__List}{Eina\_List} *l;
   \textcolor{keywordtype}{int} x, y, w, h;
   \textcolor{keywordtype}{int} xx, yy, ww, hh;
   \textcolor{keywordtype}{int} count;

   \hyperlink{group__Evas__Object__Group__Basic_ga6f52fab1a96dc58c85ee481d84bac871}{evas\_object\_geometry\_get}(o, &x, &y, &w, &h);
   count = \hyperlink{group__Eina__List__Group_ga301729054a498a2df09a5f1dd760697e}{eina\_list\_count}(p->children);
   ww = w / (count ? count : 1);
   hh = h / (count ? count : 1);
   \textcolor{keywordflow}{if} (ww < 1) ww = 1;
   \textcolor{keywordflow}{if} (hh < 1) hh = 1;

   xx = x;
   yy = y;
   \hyperlink{group__Eina__List__Group_gad02f746a08ee0b12b7ed66d4bc0d71d8}{EINA\_LIST\_FOREACH}(p->children, l, opt)
     \{
        \hyperlink{group__Evas__Font__Group_ga02da8091bbac768b8e86c7b74b2a94f9}{evas\_object\_move}(opt->\hyperlink{struct__Evas__Object__Box__Option_af01dd3e815a84ac6c7cbfbd3a6dbc148}{obj}, xx, yy);
        xx += ww;
        yy += hh;
     \}

\end{DoxyCodeInclude}


This code implements our custom layout, which will position every object added to the box in a diagonal through the size of the box part. Notice that it just calculates the position and offset based on the size of the box and number of children, and then moves each child to the respective position.

Later on the {\ttfamily main} function, everything we need to do is to register this custom layout function with edje\+:

 
\begin{DoxyCodeInclude}
   \hyperlink{group__Edje__Part__Box_gac29c0dd222aaab5743b2a57f05d3c08d}{edje\_box\_layout\_register}(\textcolor{stringliteral}{"custom\_layout"}, custom\_layout, NULL, NULL, NULL, NULL)
      ;

\end{DoxyCodeInclude}


And use it inside the box.\+edc file\+:

 
\begin{DoxyCodeInclude}
         part \{
            name: \textcolor{stringliteral}{"example/box"};
            type: BOX;

            description \{
               state: \textcolor{stringliteral}{"default"} 0.0;

               box \{
                  layout: \textcolor{stringliteral}{"custom\_layout"};
                  padding: 2 2;
                  align: 0.5 0.5;
                  min: 1 1;
               \}
               rel1 \{
                  relative: 0.0 0.2;
                  offset: 0 0;
                  to: \textcolor{stringliteral}{"bg"};
               \}
               rel2 \{
                  relative: 1.0 1.0;
                  offset: -1 -61;
                  to: \textcolor{stringliteral}{"bg"};
               \}
            \}
         \} \textcolor{comment}{// example/box}

\end{DoxyCodeInclude}


The example\textquotesingle{}s window should look like this picture\+:

  
\begin{DoxyImageNoCaption}
  \mbox{\includegraphics[width=\textwidth]{edje-box2-example}}
\end{DoxyImageNoCaption}


The full source code follows\+: 
\begin{DoxyCodeInclude}

\textcolor{preprocessor}{#ifdef HAVE\_CONFIG\_H}
\textcolor{preprocessor}{# include "config.h"}
\textcolor{preprocessor}{#else}
\textcolor{preprocessor}{# define EINA\_UNUSED}
\textcolor{preprocessor}{#endif}

\textcolor{preprocessor}{#ifndef PACKAGE\_DATA\_DIR}
\textcolor{preprocessor}{#define PACKAGE\_DATA\_DIR "."}
\textcolor{preprocessor}{#endif}

\textcolor{preprocessor}{#include <stdlib.h>}
\textcolor{preprocessor}{#include <stdio.h>}
\textcolor{preprocessor}{#include <string.h>}

\textcolor{preprocessor}{#include <Ecore.h>}
\textcolor{preprocessor}{#include <Evas.h>}
\textcolor{preprocessor}{#include <\hyperlink{Ecore__Evas_8h}{Ecore\_Evas.h}>}
\textcolor{preprocessor}{#include <\hyperlink{Edje_8h}{Edje.h}>}

\textcolor{keyword}{static} \textcolor{keyword}{const} \textcolor{keywordtype}{char} commands[] = \(\backslash\)
  \textcolor{stringliteral}{"commands are:\(\backslash\)n"}
  \textcolor{stringliteral}{"\(\backslash\)tShift - remove box\(\backslash\)n"}
  \textcolor{stringliteral}{"\(\backslash\)tCtrl - insert box\(\backslash\)n"}
  \textcolor{stringliteral}{"\(\backslash\)tEsc - exit\(\backslash\)n"}
  \textcolor{stringliteral}{"\(\backslash\)th - print help\(\backslash\)n"};

\textcolor{keyword}{static} \textcolor{keywordtype}{void}
custom\_layout(\hyperlink{group__Evas__Object__Group_ga9e19e6dd1f517a0ba437c0114d3e7c97}{Evas\_Object} *o, \hyperlink{struct__Evas__Object__Box__Data}{Evas\_Object\_Box\_Data} *p, \textcolor{keywordtype}{void} *data 
      EINA\_UNUSED)
\{
   \hyperlink{struct__Evas__Object__Box__Option}{Evas\_Object\_Box\_Option} *opt;
   \hyperlink{struct__Eina__List}{Eina\_List} *l;
   \textcolor{keywordtype}{int} x, y, w, h;
   \textcolor{keywordtype}{int} xx, yy, ww, hh;
   \textcolor{keywordtype}{int} count;

   \hyperlink{group__Evas__Object__Group__Basic_ga6f52fab1a96dc58c85ee481d84bac871}{evas\_object\_geometry\_get}(o, &x, &y, &w, &h);
   count = \hyperlink{group__Eina__List__Group_ga301729054a498a2df09a5f1dd760697e}{eina\_list\_count}(p->children);
   ww = w / (count ? count : 1);
   hh = h / (count ? count : 1);
   \textcolor{keywordflow}{if} (ww < 1) ww = 1;
   \textcolor{keywordflow}{if} (hh < 1) hh = 1;

   xx = x;
   yy = y;
   \hyperlink{group__Eina__List__Group_gad02f746a08ee0b12b7ed66d4bc0d71d8}{EINA\_LIST\_FOREACH}(p->children, l, opt)
     \{
        \hyperlink{group__Evas__Font__Group_ga02da8091bbac768b8e86c7b74b2a94f9}{evas\_object\_move}(opt->\hyperlink{struct__Evas__Object__Box__Option_af01dd3e815a84ac6c7cbfbd3a6dbc148}{obj}, xx, yy);
        xx += ww;
        yy += hh;
     \}
\}

\textcolor{keyword}{static} \hyperlink{group__Evas__Object__Group_ga9e19e6dd1f517a0ba437c0114d3e7c97}{Evas\_Object} *
new\_greenie\_block(\hyperlink{group__Evas__Canvas_ga5ff87cc4ce6bc43e3b640a6d37f73043}{Evas} *e)
\{
   \hyperlink{group__Evas__Object__Group_ga9e19e6dd1f517a0ba437c0114d3e7c97}{Evas\_Object} *o;

   o = \hyperlink{group__Evas__Object__Rectangle_ga4d80fc32ad1cac28428cebd65d746751}{evas\_object\_rectangle\_add}(e);
   \hyperlink{group__Evas__Font__Group_ga21e8604c0e4a93e469bff4bd069e82b5}{evas\_object\_resize}(o, 10, 10);
   \hyperlink{group__Evas__Object__Group__Basic_gae34bdcfd7f5100151f6ea8ef4a392949}{evas\_object\_color\_set}(o, 0, 255, 0, 255);
   \hyperlink{group__Evas__Object__Group__Basic_ga9cbc13661584e49fb9d9cdab514a1eeb}{evas\_object\_show}(o);

   \textcolor{keywordflow}{return} o;
\}

\textcolor{keyword}{static} \textcolor{keywordtype}{void}
on\_keydown(\textcolor{keywordtype}{void} *data, \hyperlink{group__Evas__Canvas_ga5ff87cc4ce6bc43e3b640a6d37f73043}{Evas} *evas, \hyperlink{group__Evas__Object__Group_ga9e19e6dd1f517a0ba437c0114d3e7c97}{Evas\_Object} *o EINA\_UNUSED, \textcolor{keywordtype}{void} *einfo)
\{
   \hyperlink{struct__Evas__Event__Key__Down}{Evas\_Event\_Key\_Down} *ev;
   \hyperlink{group__Evas__Object__Group_ga9e19e6dd1f517a0ba437c0114d3e7c97}{Evas\_Object}         *edje\_obj;
   \textcolor{keyword}{const} \hyperlink{Evas__Common_8h_a198d0b10861c1da456004688d3443e96}{Evas\_Modifier} *mods;

   ev = (\hyperlink{struct__Evas__Event__Key__Down}{Evas\_Event\_Key\_Down} *)einfo;
   edje\_obj = (\hyperlink{group__Evas__Object__Group_ga9e19e6dd1f517a0ba437c0114d3e7c97}{Evas\_Object} *)data;

   mods = evas\_key\_modifier\_get(evas);
   \textcolor{keywordflow}{if} (!strcmp(ev->\hyperlink{struct__Evas__Event__Key__Down_a70473bba88a1afaee180a54150513824}{key}, \textcolor{stringliteral}{"h"}))
     \{
        fprintf(stdout, commands);
        \textcolor{keywordflow}{return};
     \}
   \textcolor{keywordflow}{if} (\hyperlink{group__Evas__Keys_ga6cc24a5ea4b39b84c7a3e617de3db261}{evas\_key\_modifier\_is\_set}(mods, \textcolor{stringliteral}{"Shift"}))
     \{
        \textcolor{keywordtype}{int} pos;
        \hyperlink{group__Evas__Object__Group_ga9e19e6dd1f517a0ba437c0114d3e7c97}{Evas\_Object} *obj = NULL;
        pos = atoi(ev->\hyperlink{struct__Evas__Event__Key__Down_a70473bba88a1afaee180a54150513824}{key});
        obj = edje\_object\_part\_box\_remove\_at(edje\_obj, \textcolor{stringliteral}{"example/box"}, pos);
        \textcolor{keywordflow}{if} (obj)
          \hyperlink{group__Evas__Object__Group__Basic_ga7e7a625dab7a3890532aa13b43117076}{evas\_object\_del}(obj);
        \textcolor{keywordflow}{return};
     \}
   \textcolor{keywordflow}{if} (\hyperlink{group__Evas__Keys_ga6cc24a5ea4b39b84c7a3e617de3db261}{evas\_key\_modifier\_is\_set}(mods, \textcolor{stringliteral}{"Control"}))
     \{
        \hyperlink{group__Evas__Object__Group_ga9e19e6dd1f517a0ba437c0114d3e7c97}{Evas\_Object} *obj;
        \textcolor{keywordtype}{int} pos;
        pos = atoi(ev->\hyperlink{struct__Evas__Event__Key__Down_a70473bba88a1afaee180a54150513824}{key});
        obj = new\_greenie\_block(evas);
        \textcolor{keywordflow}{if} (!edje\_object\_part\_box\_insert\_at(edje\_obj, \textcolor{stringliteral}{"example/box"}, obj, pos))
          edje\_object\_part\_box\_append(edje\_obj, \textcolor{stringliteral}{"example/box"}, obj);
        \textcolor{keywordflow}{return};
     \}
   \textcolor{keywordflow}{if} (!strcmp(ev->\hyperlink{struct__Evas__Event__Key__Down_a70473bba88a1afaee180a54150513824}{key}, \textcolor{stringliteral}{"Escape"}))
     \hyperlink{group__Ecore__Main__Loop__Group_ga95cf8e97dff0716433c2c5474d606a98}{ecore\_main\_loop\_quit}();
\}

\textcolor{keyword}{static} \hyperlink{group__Evas__Object__Group_ga9e19e6dd1f517a0ba437c0114d3e7c97}{Evas\_Object} *
box\_new(Ecore\_Evas *ee, \textcolor{keyword}{const} \textcolor{keywordtype}{char} *edje\_file\_path, \textcolor{keyword}{const} \textcolor{keywordtype}{char} *name, \textcolor{keywordtype}{int} x, \textcolor{keywordtype}{int} y, \textcolor{keywordtype}{int} w, \textcolor{keywordtype}{int} h)
\{
   \hyperlink{group__Evas__Object__Group_ga9e19e6dd1f517a0ba437c0114d3e7c97}{Evas\_Object} *edje\_obj;

   edje\_obj = edje\_object\_add(\hyperlink{group__Ecore__Evas__Group_ga75a7cc694b6069e78df47dab0b0f2d20}{ecore\_evas\_get}(ee));
   \hyperlink{group__Evas__Font__Group_ga02da8091bbac768b8e86c7b74b2a94f9}{evas\_object\_move}(edje\_obj, x, y);
   \hyperlink{group__Evas__Font__Group_ga21e8604c0e4a93e469bff4bd069e82b5}{evas\_object\_resize}(edje\_obj, w, h);
   \textcolor{keywordflow}{if} (!edje\_object\_file\_set(edje\_obj, edje\_file\_path, \textcolor{stringliteral}{"example/group2"}))
     \{
        printf(\textcolor{stringliteral}{"error: could not load file object.\(\backslash\)n"});
     \}
   \hyperlink{group__Evas__Object__Group__Basic_ga9cbc13661584e49fb9d9cdab514a1eeb}{evas\_object\_show}(edje\_obj);
   evas\_object\_name\_set(edje\_obj, name);
   \hyperlink{group__Ecore__Evas__Group_gaa86c5abd200a02711aced53d27b9ddb2}{ecore\_evas\_data\_set}(ee, \textcolor{stringliteral}{"edje\_obj"}, edje\_obj);

   \textcolor{keywordflow}{return} edje\_obj;
\}

\textcolor{keyword}{static} \textcolor{keywordtype}{void}
on\_resize(Ecore\_Evas *ee)
\{
   \hyperlink{group__Evas__Object__Group_ga9e19e6dd1f517a0ba437c0114d3e7c97}{Evas\_Object} *bg;
   \hyperlink{group__Evas__Object__Group_ga9e19e6dd1f517a0ba437c0114d3e7c97}{Evas\_Object} *edje\_obj;
   \textcolor{keywordtype}{int}          w;
   \textcolor{keywordtype}{int}          h;

   bg = \hyperlink{group__Ecore__Evas__Group_gae00d4a4feb8aec5de03e464fe21a1d30}{ecore\_evas\_data\_get}(ee, \textcolor{stringliteral}{"background"});
   edje\_obj = \hyperlink{group__Ecore__Evas__Group_gae00d4a4feb8aec5de03e464fe21a1d30}{ecore\_evas\_data\_get}(ee, \textcolor{stringliteral}{"edje\_obj"});
   \hyperlink{group__Ecore__Evas__Group_ga931aadf4603731e73e8a84e4b14f1493}{ecore\_evas\_geometry\_get}(ee, NULL, NULL, &w, &h);
   \hyperlink{group__Evas__Font__Group_ga21e8604c0e4a93e469bff4bd069e82b5}{evas\_object\_resize}(bg, w, h);
   \hyperlink{group__Evas__Font__Group_ga21e8604c0e4a93e469bff4bd069e82b5}{evas\_object\_resize}(edje\_obj, w, h);
\}

\textcolor{keyword}{static} \textcolor{keywordtype}{void}
on\_destroy(Ecore\_Evas *ee EINA\_UNUSED)
\{
   \hyperlink{group__Ecore__Main__Loop__Group_ga95cf8e97dff0716433c2c5474d606a98}{ecore\_main\_loop\_quit}();
\}

\textcolor{keywordtype}{int}
main(\textcolor{keywordtype}{int} argc EINA\_UNUSED, \textcolor{keywordtype}{char} *argv[] EINA\_UNUSED)
\{
   \textcolor{keyword}{const} \textcolor{keywordtype}{char}  *edje\_file = PACKAGE\_DATA\_DIR\textcolor{stringliteral}{"/box.edj"};
   Ecore\_Evas  *ee;
   \hyperlink{group__Evas__Canvas_ga5ff87cc4ce6bc43e3b640a6d37f73043}{Evas}        *evas;
   \hyperlink{group__Evas__Object__Group_ga9e19e6dd1f517a0ba437c0114d3e7c97}{Evas\_Object} *bg;
   \hyperlink{group__Evas__Object__Group_ga9e19e6dd1f517a0ba437c0114d3e7c97}{Evas\_Object} *edje\_obj;
   \hyperlink{group__Evas__Object__Group_ga9e19e6dd1f517a0ba437c0114d3e7c97}{Evas\_Object} *last;
   \hyperlink{group__Evas__Object__Group_ga9e19e6dd1f517a0ba437c0114d3e7c97}{Evas\_Object} *o;
   \textcolor{keywordtype}{int}          w;
   \textcolor{keywordtype}{int}          h;
   \textcolor{keywordtype}{int}          i;

   \textcolor{keywordflow}{if} (!\hyperlink{group__Ecore__Evas__Group_ga32ddbb6457033ad435a177eb0c4fe235}{ecore\_evas\_init}())
     \textcolor{keywordflow}{return} EXIT\_FAILURE;

   \textcolor{keywordflow}{if} (!\hyperlink{group__Edje__General__Group_ga1c9c6594f38023c29fbfb2d0c8c675db}{edje\_init}())
     \textcolor{keywordflow}{goto} shutdown\_ecore\_evas;

   \textcolor{comment}{/* this will give you a window with an Evas canvas under the first}
\textcolor{comment}{    * engine available */}
   ee = \hyperlink{group__Ecore__Evas__Group_gac7f2cdbcb79635c34317c1183dd04cb0}{ecore\_evas\_new}(NULL, 0, 0, 640, 480, NULL);
   \textcolor{keywordflow}{if} (!ee) \textcolor{keywordflow}{goto} shutdown\_edje;

   \hyperlink{group__Ecore__Evas__Group_gaac67f679c9027059a34519fbdea360df}{ecore\_evas\_callback\_resize\_set}(ee, on\_resize);
   \hyperlink{group__Ecore__Evas__Group_ga3680b5c89157167318192157a5d24ec4}{ecore\_evas\_callback\_destroy\_set}(ee, on\_destroy);
   \hyperlink{group__Ecore__Evas__Group_ga931aadf4603731e73e8a84e4b14f1493}{ecore\_evas\_geometry\_get}(ee, NULL, NULL, &w, &h);

   evas = \hyperlink{group__Ecore__Evas__Group_ga75a7cc694b6069e78df47dab0b0f2d20}{ecore\_evas\_get}(ee);

   bg = \hyperlink{group__Evas__Object__Rectangle_ga4d80fc32ad1cac28428cebd65d746751}{evas\_object\_rectangle\_add}(evas);
   \hyperlink{group__Evas__Font__Group_ga21e8604c0e4a93e469bff4bd069e82b5}{evas\_object\_resize}(bg, w, h);
   \hyperlink{group__Evas__Object__Group__Basic_ga9cbc13661584e49fb9d9cdab514a1eeb}{evas\_object\_show}(bg);
   evas\_object\_focus\_set(bg, 1);
   \hyperlink{group__Ecore__Evas__Group_gaa86c5abd200a02711aced53d27b9ddb2}{ecore\_evas\_data\_set}(ee, \textcolor{stringliteral}{"background"}, bg);

   \hyperlink{group__Edje__Part__Box_gac29c0dd222aaab5743b2a57f05d3c08d}{edje\_box\_layout\_register}(\textcolor{stringliteral}{"custom\_layout"}, custom\_layout, NULL, NULL, NULL, NULL)
      ;

   edje\_obj = box\_new(ee, edje\_file, \textcolor{stringliteral}{"box"}, 0, 0, w, h);
   \hyperlink{group__Evas__Object__Group__Events_ga23be30ac5cdfb780f1ff82e9108ec26b}{evas\_object\_event\_callback\_add}(bg, 
      \hyperlink{Evas__Common_8h_a99e208e463a20499aabe6faac8a8cb8aa336b86bad4f145f84c155e4922335584}{EVAS\_CALLBACK\_KEY\_DOWN}, on\_keydown, edje\_obj);

   \textcolor{keywordflow}{for} (i = 1; i <= 5; i++)
     \{
        o = last = \hyperlink{group__Evas__Object__Rectangle_ga4d80fc32ad1cac28428cebd65d746751}{evas\_object\_rectangle\_add}(evas);
        evas\_object\_size\_hint\_min\_set(o, 50, 50);
        \hyperlink{group__Evas__Font__Group_ga21e8604c0e4a93e469bff4bd069e82b5}{evas\_object\_resize}(o, 50, 50);
        \hyperlink{group__Evas__Object__Group__Basic_gae34bdcfd7f5100151f6ea8ef4a392949}{evas\_object\_color\_set}(o, 255, 0, 0, 128);
        \hyperlink{group__Evas__Object__Group__Basic_ga9cbc13661584e49fb9d9cdab514a1eeb}{evas\_object\_show}(o);

        \textcolor{keywordflow}{if} (!edje\_object\_part\_box\_append(edje\_obj, \textcolor{stringliteral}{"example/box"}, o))
          \{
             fprintf(stderr, \textcolor{stringliteral}{"error appending child object!\(\backslash\)n"});
             \textcolor{keywordflow}{return} 1;
          \}
     \}

   fprintf(stdout, commands);

   \hyperlink{group__Ecore__Evas__Group_ga4953047ff97d4f1b0d75a7d513d4f317}{ecore\_evas\_show}(ee);

   \hyperlink{group__Ecore__Main__Loop__Group_gaf103b9f668bb3e4fed12e52c6180132d}{ecore\_main\_loop\_begin}();

   \hyperlink{group__Ecore__Evas__Group_gad3ec61f2aa03df4d3dbfd0d311e0c8dc}{ecore\_evas\_free}(ee);
   \hyperlink{group__Ecore__Evas__Group_gab8fa311077f749190c9b622f672b2214}{ecore\_evas\_shutdown}();
   \hyperlink{group__Edje__General__Group_ga01041f6702f2d81bf10c3e41899805cb}{edje\_shutdown}();

   \textcolor{keywordflow}{return} EXIT\_SUCCESS;

 shutdown\_edje:
   \hyperlink{group__Edje__General__Group_ga01041f6702f2d81bf10c3e41899805cb}{edje\_shutdown}();
 shutdown\_ecore\_evas:
   \hyperlink{group__Ecore__Evas__Group_gab8fa311077f749190c9b622f672b2214}{ecore\_evas\_shutdown}();

   \textcolor{keywordflow}{return} EXIT\_FAILURE;
\}
\end{DoxyCodeInclude}


To compile use this command\+: \begin{DoxyVerb}* gcc -o edje-box2 edje-box2.c -DPACKAGE_BIN_DIR=\"/Where/enlightenment/is/installed/bin\" -DPACKAGE_LIB_DIR=\"/Where/enlightenment/is/installed/lib\"
* -DPACKAGE_DATA_DIR=\"/Where/enlightenment/is/installed/share\"
* `pkg-config --cflags --libs evas ecore ecore-evas edje`
*
* edje_cc box.edc
* \end{DoxyVerb}
 