This example shows how one can use the \hyperlink{group__Layout}{Layout} with a predefined theme layout to add a back and next button to a simple window.

The full source code for this example can be found at \hyperlink{layout_example_02_c}{layout\-\_\-example\-\_\-02.\-c}.

After setting up the window and background, we add the layout widget to the window. But instead of using \hyperlink{group__Layout_gae6ec96da2c6725a2ba4eba0ea782523a}{elm\-\_\-layout\-\_\-file\-\_\-set()} to load its theme from a custom theme file, we can use \hyperlink{group__Layout_gabce6e0211b610437487c432bd536f8ca}{elm\-\_\-layout\-\_\-theme\-\_\-set()} to load one of the predefined layouts that come with elementary. Particularly on this example, we load the them of class \char`\"{}layout\char`\"{}, group \char`\"{}application\char`\"{} and style \char`\"{}content-\/back-\/next\char`\"{} (since we want the back and next buttons).

 
\begin{DoxyCodeInclude}
   layout = elm_layout_add(win);
   evas\_object\_size\_hint\_weight\_set(layout, EVAS\_HINT\_EXPAND, EVAS\_HINT\_EXPAND);
   elm_win_resize_object_add(win, layout);
   \textcolor{keywordflow}{if} (!elm_layout_theme_set(
         layout, \textcolor{stringliteral}{"layout"}, \textcolor{stringliteral}{"application"}, \textcolor{stringliteral}{"content-back-next"}))
     fprintf(stderr, \textcolor{stringliteral}{"Failed to set layout"});
   evas\_object\_show(layout);

\end{DoxyCodeInclude}


This default theme contains only a \char`\"{}content\char`\"{} area named \char`\"{}elm.\-swallow.\-content\char`\"{}, where we can add any widget (it can be even a container widget, like a box, frame, list, or even another layout). Since we just want to show the resulting layout, we add a simple icon to it\-:


\begin{DoxyCodeInclude}

\end{DoxyCodeInclude}


This default layout also provides some signals when the next and prev buttons are clicked. We can register callbacks to them with the \hyperlink{group__General_ga6f9574b798efcd454afdac6f2904f633}{elm\-\_\-object\-\_\-signal\-\_\-callback\-\_\-add()} function\-:


\begin{DoxyCodeInclude}

\end{DoxyCodeInclude}


In the \hyperlink{layout_example_03}{Layout -\/ Signals and Size Changed} you can see how to send signals to the layout with \hyperlink{group__General_ga1beada7edf5d714c0dba5459bcc993fc}{elm\-\_\-object\-\_\-signal\-\_\-emit()}.

Now our callback just changes the picture being displayed when one of the buttons are clicked\-:

 
\begin{DoxyCodeInclude}
\textcolor{keyword}{static} \textcolor{keyword}{const} \textcolor{keywordtype}{char} *images[] = \{ \textcolor{stringliteral}{"home"}, \textcolor{stringliteral}{"close"}, \textcolor{stringliteral}{"arrow\_up"}, \textcolor{stringliteral}{"arrow\_down"}, NULL \};

\textcolor{keyword}{struct }\_App \{
     \textcolor{keywordtype}{int} current;
\};

\textcolor{keyword}{static} \textcolor{keywordtype}{void}
\_signal\_cb(\textcolor{keywordtype}{void} *data, Evas\_Object *o, \textcolor{keyword}{const} \textcolor{keywordtype}{char} *emission, \textcolor{keyword}{const} \textcolor{keywordtype}{char} *source)
\{
   \textcolor{keyword}{struct }\_App *app = data;
   Evas\_Object *icon = elm_object_part_content_get(o, \textcolor{stringliteral}{"elm.swallow.content"});

   printf(\textcolor{stringliteral}{"signal received\(\backslash\)n"});

   \textcolor{keywordflow}{if} (!strcmp(\textcolor{stringliteral}{"elm,action,back"}, emission))
     app->current--;
   \textcolor{keywordflow}{else} \textcolor{keywordflow}{if} (!strcmp(\textcolor{stringliteral}{"elm,action,next"}, emission))
     app->current++;

   \textcolor{keywordflow}{if} (app->current < 0)
     app->current = (\textcolor{keyword}{sizeof}(images) / \textcolor{keyword}{sizeof}(images[0])) - 2;
   \textcolor{keywordflow}{else} \textcolor{keywordflow}{if} (images[app->current] == NULL)
     app->current = 0;

   elm_icon_standard_set(icon, images[app->current]);
\}

\end{DoxyCodeInclude}


It's possible to see that it gets the name of the image being shown from the array of image names, going forward on this array when \char`\"{}next\char`\"{} is clicked and backward when \char`\"{}back\char`\"{} is clicked.

A screenshot of this example can be seen on\-:

 
\begin{DoxyImage}
\includegraphics{screenshots/layout_example_02}
\caption{width=}
\end{DoxyImage}
 