elementary/layout - Add examples explained.

SVN revision: 61537

legacy/elementary/doc/examples.dox

@@ -1940,6 +1940,254 @@
  * @example fileselector_entry_example.c
  */
 
+/**
+ * @page layout_example_01 Layout - Content, Table and Box
+ *
+ * This example shows how one can use the @ref Layout widget to create a
+ * customized distribution of widgets on the screen, controled by an Edje theme.
+ * The full source code for this example can be found at @ref
+ * layout_example_01_c.
+ *
+ * Our custom layout is defined by a file, @ref layout_example_edc, which is an
+ * Edje theme file. Look for the Edje documentation to understand it. For now,
+ * it's enough to know that we describe some specific parts on this layout
+ * theme:
+ * @li a title text field;
+ * @li a box container;
+ * @li a table container;
+ * @li and a content container.
+ *
+ * Going straight to the code, the following snippet instantiates the layout
+ * widget:
+ *
+ * @dontinclude layout_example_01.c
+ * @skip elm_layout_add
+ * @until evas_object_show(layout)
+ *
+ * As any other widget, we set some properties for the size calculation. But
+ * notice on this piece of code the call to the function elm_layout_file_set().
+ * Here is where the theme file is loaded, and particularly the specific group
+ * from this theme file. Also notice that the theme file here is referenced as
+ * an .edj, which is a .edc theme file compiled to its binary form. Again, look
+ * for the Edje documentation for more information about theme files.
+ *
+ * Next, we fetch from our theme a data string referenced by the key "title".
+ * This data was defined in the theme, and can be used as parameters which the
+ * program get from the specific theme that it is using. In this case, we store
+ * the title of this window and program in the theme, as a "data" entry, just
+ * for demonstration purposes:
+ *
+ * @until }
+ *
+ * This call elm_layout_data_get() is used to fetch the string based on the key,
+ * and elm_object_text_part_set() will set the part defined in the theme as
+ * "example/title" to contain this string. This key "example/title" has nothing
+ * special. It's just an arbitrary convention that we are using in this example.
+ * Every string in this example referencing a part of this theme will be of the
+ * form "example/<something>".
+ *
+ * Now let's start using our layout to distribute things on the window space.
+ * Since the layout was added as a resize object to the elementary window, it
+ * will always occupy the entire space available for this window.
+ *
+ * The theme already has a title, and it also defines a table element which is
+ * positioned approximately between 50% and 70% of the height of this window,
+ * and has 100% of the width. We create some widgets (two icons, a clock and a
+ * button) and pack them inside the table, in a distribution similar to a HTML
+ * table:
+ *
+ * @until evas_object_show(bt)
+ *
+ * Notice that we just set size hints for every object, and call the function
+ * elm_layout_table_pack(), which does all the work. It will place the elements
+ * in the specified row/column, with row and column span if required, and then
+ * the object's size and position will be controled by the layout widget. It
+ * will also respect size hints, alignments and weight properties set to these
+ * widgets. The resulting distribution on the screen depends on the table
+ * properties (described in the theme), the size hints set on each widget, and
+ * on the cells of the table that are being used.
+ *
+ * For instance, we add the two icons and the clock on the first, second and
+ * third cells of the first row, and add the button the second row, making it
+ * span for 3 columns (thus having the size of the entire table width). This
+ * will result in a table that has 2 rows and 3 columns.
+ *
+ * Now let's add some widgets to the box area of our layout. This box is around
+ * 20% and 50% of the vertical size of the layout, and 100% of its width. The
+ * theme defines that it will use an "horizontal flow" distribution to its
+ * elements. Unlike the table, a box will distribute elements without knowing
+ * about rows and columns, and the distribution function selected will take care
+ * of putting them in row, column, both, or any other available layout. This is
+ * also described in the Edje documentation.
+ *
+ * This box area is similar to the @ref Box widget of elementary, with the
+ * difference that its position and properties are controled by the theme of the
+ * layout. It also contains more than one API to add items to it, since the
+ * items position now is defined in terms of a list of items, not a matrix.
+ * There's the first position (can have items added to it with
+ * elm_layout_box_prepend()), the last position (elm_layout_box_append()), the
+ * nth position (elm_layout_box_insert_at()) and the position right before an
+ * element (elm_layout_box_insert_before()). We use insert_at and prepend
+ * functions to add the first two buttons to this box, and insert_before on the
+ * callback of each button. The callback code will be shown later, but it
+ * basically adds a button just before the clicked button using the
+ * elm_layout_box_insert_before() function. Here's the code for adding the first
+ * 2 buttons:
+ *
+ * @until evas_object_show(item)
+ * @until evas_object_show(item)
+ *
+ * Finally, we have an area in this layout theme, in the bottom part of it,
+ * reserved for adding an specific widget. Differently from the 2 parts
+ * described until now, this one can only receive one widget with the call
+ * elm_layout_content_set(). If there was already an item on this specific part,
+ * it will be deleted (one can use elm_layout_content_unset() in order to remove
+ * it without deleting). An example of removing it without deleting, but
+ * manually deleting this widget just after that, can be seen on the callback
+ * for this button. Actually, the callback defined for this button will clean
+ * the two other parts (deleting all of their elements) and then remove and
+ * delete this button.
+ *
+ * @until _swallow_btn_cb
+ *
+ * Also notice that, for this last added button, we don't have to call
+ * evas_object_show() on it. This is a particularity of the theme for layouts,
+ * that will have total control over the properties like size, position,
+ * visibility and clipping of a widget added with elm_layout_content_set().
+ * Again, read the Edje documentation to understand this better.
+ *
+ * Now we just put the code for the different callbacks specified for each kind
+ * of button and make simple comments about them:
+ *
+ * @dontinclude layout_example_01.c
+ * @skip static void
+ * @until evas_object_del(item)
+ * @until }
+ *
+ * The first callback is used for the button in the table, and will just remove
+ * itself from the table with elm_layout_table_unpack(), which remove items
+ * without deleting them, and then calling evas_object_del() on itself.
+ *
+ * The second callback is for buttons added to the box. When clicked, these
+ * buttons will create a new button, and add them to the same box, in the
+ * position just before the clicked button.
+ *
+ * And the last callback is for the button added to the "content" area. It will
+ * clear both the table and the box, passing @c EINA_TRUE to their respective @c
+ * clear parameters, which will imply on the items of these containers being
+ * deleted.
+ *
+ * A screenshot of this example can be seen on:
+ *
+ * @image html screenshots/layout_example_01.png
+ * @image latex screenshots/layout_example_01.eps width=\textwidth
+ *
+ */
+
+/**
+ * @page layout_example_02 Layout - Predefined Layout
+ *
+ * This example shows how one can use the @ref 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 @ref layout_example_02_c.
+ *
+ * After setting up the window and background, we add the layout widget to the
+ * window. But instead of using elm_layout_file_set() to load its theme from a
+ * custom theme file, we can use 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 "layout", group "application" and style
+ * "content-back-next" (since we want the back and next buttons).
+ *
+ * @dontinclude layout_example_02.c
+ * @skip elm_layout_add
+ * @until evas_object_show(layout)
+ *
+ * This default theme contains only a "content" area named
+ * "elm.swallow.content", 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:
+ *
+ * @until layout_content_set
+ *
+ * This default layout also provides some signals when the next and prev buttons
+ * are clicked. We can register callbacks to them with the
+ * elm_object_signal_callback_add() function:
+ *
+ * @until elm,action,next
+ *
+ * In the @ref layout_example_03 you can see how to send signals to the layout with
+ * elm_object_signal_emit().
+ *
+ * Now our callback just changes the picture being displayed when one of the
+ * buttons are clicked:
+ *
+ * @dontinclude layout_example_02.c
+ * @skip images
+ * @until standard_set
+ * @until }
+ *
+ * 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 "next" is clicked and
+ * backward when "back" is clicked.
+ *
+ * A screenshot of this example can be seen on:
+ *
+ * @image html screenshots/layout_example_02.png
+ * @image latex screenshots/layout_example_02.eps width=\textwidth
+ */
+
+/**
+ * @page layout_example_03 Layout - Signals and Size Changed
+ *
+ * This example shows how one can send and receive signals to/from the layout,
+ * and what to do when the layout theme has its size changed. The full source
+ * code for this example can be found at @ref layout_example_03_c.
+ *
+ * In this exmaple we will use another group from the same layout theme file
+ * used in @ref layout_example_01. Its instanciation and loading happens in the
+ * following lines:
+ *
+ * @dontinclude layout_example_03.c
+ * @skip elm_layout_add
+ * @until evas_object_show
+ *
+ * This time we register a callback to be called whenever we receive a signal
+ * after the end of the animation that happens in this layout:
+ *
+ * @until signal_callback_add
+ *
+ * We also add a button that will send signals to the layout:
+ *
+ * @until callback_add
+ *
+ * The callback for this button will check what type of signal it should send,
+ * and then emit it. The code for this callback follows:
+ *
+ * @dontinclude layout_exmaple_03.c
+ * @skip static Eina_Bool
+ * @until Enlarge
+ * @until }
+ * @until }
+ *
+ * As we said before, we are receiving a signal whenever the animation started
+ * by the button click ends. This is the callback for that signal:
+ *
+ * @until }
+ *
+ * Notice from this callback that the elm_layout_sizing_eval() function must be
+ * called if we want our widget to update its size after the layout theme having
+ * changed its minimum size. This happens because the animation specified in the
+ * theme increases the size of the content area to a value higher than the
+ * widget size, thus requiring more space. But the elementary layout widget
+ * has no way to know this, thus needing the elm_layout_sizing_eval() to
+ * be called on the layout, informing that this size has changed.
+ *
+ * A screenshot of this example can be seen on:
+ *
+ * @image html screenshots/layout_example_03.png
+ * @image latex screenshots/layout_example_03.eps width=\textwidth
+ */
+
 /**
  * @page tutorial_hover Hover example
  * @dontinclude hover_example_01.c
@@ -2607,3 +2855,31 @@
  * @include index_example_02.c
  * @example index_example_02.c
  */
+
+ * @page layout_example_01_c layout_example_01.c
+ * @include layout_example_01.c
+ * @example layout_example_01.c
+ */
+
+/**
+ * @page layout_example_02_c layout_example_02.c
+ * @include layout_example_02.c
+ * @example layout_example_02.c
+ */
+
+/**
+ * @page layout_example_03_c layout_example_03.c
+ * @include layout_example_03.c
+ * @example layout_example_03.c
+ */
+
+/**
+ * @page layout_example_edc An example of layout theme file
+ *
+ * This theme file contains two groups. Each of them is a different theme, and
+ * can be used by an Elementary Layout widget. A theme can be used more than
+ * once by many different Elementary Layout widgets too.
+ *
+ * @include layout_example.edc
+ * @example layout_example.edc
+ */

legacy/elementary/src/examples/Makefile.am

@@ -63,6 +63,9 @@ SRCS = \
 	conformant_example_02.c \
 	image_example_01.c \
 	icon_example_01.c \
+	layout_example_01.c \
+	layout_example_02.c \
+	layout_example_03.c \
 	flipselector_example.c \
 	fileselector_example.c \
 	fileselector_button_example.c \
@@ -71,7 +74,8 @@ SRCS = \
 	diskselector_example_02.c \
 	index_example_01.c \
 	index_example_02.c \
-	theme_example.edc
+	theme_example.edc \
+	layout_example.edc
 
 pkglib_PROGRAMS =
 
@@ -85,7 +89,8 @@ endif
 
 if EFL_BUILD_EXAMPLES
 files_DATA += \
-	theme_example.edj
+	theme_example.edj \
+	layout_example.edj
 
 clean-local:
 	rm -f *.edj
@@ -127,6 +132,9 @@ pkglib_PROGRAMS += \
 	diskselector_example_01 \
 	diskselector_example_02 \
 	icon_example_01 \
+	layout_example_01 \
+	layout_example_02 \
+	layout_example_03 \
 	flipselector_example \
 	fileselector_example \
 	fileselector_button_example \
@@ -165,6 +173,9 @@ SCREENSHOTS = \
 	diskselector_example_01:diskselector_example_01.png:0.2 \
 	diskselector_example_02:diskselector_example_02.png:0.2 \
 	icon_example_01:icon_example_01.png:0.0 \
+	layout_example_01:layout_example_01.png:0.0 \
+	layout_example_02:layout_example_02.png:0.0 \
+	layout_example_03:layout_example_03.png:0.0 \
 	flipselector_example:flipselector_example.png:0.0 \
 	fileselector_example:fileselector_example.png:0.0 \
 	index_example_02:index_example_03.png:0.3

legacy/elementary/src/examples/layout_example.edc

@@ -0,0 +1,178 @@
+collections {
+
+   group {
+      name: "example/mylayout";
+
+      data {
+         item: "title" "Layout Example 01";
+      }
+
+      parts {
+         part {
+            name: "example/title";
+            type: TEXT;
+
+            description {
+               state: "default" 0.0;
+               color: 0 0 0 255;
+               rel1 {
+                  relative: 0.0 0.0;
+                  offset: 0 0;
+               }
+               rel2 {
+                  relative: 1.0 0.2;
+                  offset: -1 -1;
+               }
+               text {
+                  text: "bla";
+                  size: 16;
+                  font: "sans";
+                  min: 1 1;
+               }
+            }
+         }
+
+         part {
+            name: "example/custom";
+            type: SWALLOW;
+
+            description {
+               state: "default" 0.0;
+               fixed: 1 1;
+
+               rel1 {
+                  relative: 0.25 0.8;
+                  offset: 0 0;
+               }
+               rel2 {
+                  relative: 0.75 0.9;
+                  offset: -1 -1;
+               }
+            }
+         } // example/custom
+
+         part {
+            name: "example/box";
+            type: BOX;
+
+            description {
+               state: "default" 0.0;
+
+               box {
+                  layout: "horizontal_flow";
+                  padding: 2 2;
+                  align: 0.5 0.5;
+                  min: 1 1;
+               }
+               rel1 {
+                  relative: 0.0 0.2;
+                  offset: 0 0;
+               }
+               rel2 {
+                  relative: 1.0 0.5;
+                  offset: -1 -1;
+               }
+            }
+         } // example/box
+
+         part {
+            name: "example/table";
+            type: TABLE;
+
+            description {
+               state: "default" 0.0;
+
+               table {
+                  homogeneous: NONE;
+                  padding: 2 2;
+                  align: 0.5 0.5;
+                  min: 1 1;
+               }
+               rel1 {
+                  relative: 0.0 0.5;
+                  offset: 0 0;
+               }
+               rel2 {
+                  relative: 1.0 0.7;
+                  offset: -1 -1;
+               }
+            }
+         } // example/table
+      }
+   }
+
+   group {
+      name: "example/mylayout3";
+
+      data {
+         item: "title" "Layout Example 03";
+      }
+
+      parts {
+         part {
+            name: "example/title";
+            type: TEXT;
+
+               description {
+               state: "default" 0.0;
+               color: 0 0 0 255;
+               rel1 {
+                  relative: 0.0 0.0;
+                  offset: 0 0;
+               }
+               rel2 {
+                  relative: 1.0 0.2;
+                  offset: -1 -1;
+               }
+               text {
+                  text: "bla";
+                  size: 16;
+                  font: "sans";
+                  min: 1 1;
+               }
+            }
+         }
+
+         part {
+            name: "example/custom";
+            type: SWALLOW;
+
+            description {
+               state: "default" 0.0;
+               min: 160 50;
+               max: 160 50;
+               align: 0.5 1.0;
+            }
+            description {
+               state: "big" 0.0;
+               inherit: "default" 0.0;
+               min: 320 100;
+               max: 320 100;
+            }
+         } // example/custom
+
+         programs {
+            program {
+               name: "swallow,grow";
+               signal: "button,enlarge";
+               action: STATE_SET "big" 0.0;
+               transition: LINEAR 0.5;
+               target: "example/custom";
+               after: "emit,changed";
+            }
+            program {
+               name: "swallow,shrink";
+               signal: "button,reduce";
+               action: STATE_SET "default" 0.0;
+               transition: LINEAR 0.5;
+               target: "example/custom";
+               after: "emit,changed";
+            }
+            program {
+               name: "emit,changed";
+               action: SIGNAL_EMIT "size,changed" "";
+            }
+         }
+      }
+   }
+}

legacy/elementary/src/examples/layout_example_01.c

@@ -0,0 +1,155 @@
+//Compile with:
+//gcc -g `pkg-config --cflags --libs elementary` layout_example_01.c -o layout_example_01
+
+#include <Elementary.h>
+#ifdef HAVE_CONFIG_H
+# include "elementary_config.h"
+#else
+# define __UNUSED__
+# define PACKAGE_DATA_DIR "."
+#endif
+
+#define TABLE "example/table"
+#define BOX "example/box"
+#define TITLE "example/title"
+#define SWALLOW "example/custom"
+
+static int _box_buttons = 0;
+
+static void
+_tbl_btn_cb(void *data, Evas_Object *btn, void *event_info __UNUSED__)
+{
+   Evas_Object *layout = data;
+
+   elm_layout_table_unpack(layout, TABLE, btn);
+   evas_object_del(btn);
+}
+
+static void
+_box_btn_cb(void *data, Evas_Object *btn, void *event_info __UNUSED__)
+{
+   Evas_Object *layout = data;
+   Evas_Object *item;
+   char buf[30];
+
+   snprintf(buf, sizeof(buf), "Button %02d", _box_buttons++);
+
+   item = elm_button_add(elm_object_parent_widget_get(layout));
+   elm_object_text_set(item, buf);
+   evas_object_size_hint_weight_set(item, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND);
+   evas_object_size_hint_align_set(item, EVAS_HINT_FILL, EVAS_HINT_FILL);
+   evas_object_size_hint_min_set(item, 100, 50);
+   elm_layout_box_insert_before(layout, BOX, item, btn);
+   evas_object_smart_callback_add(item, "clicked", _box_btn_cb, layout);
+   evas_object_show(item);
+}
+
+static void
+_swallow_btn_cb(void *data, Evas_Object *btn __UNUSED__, void *event_info __UNUSED__)
+{
+   Evas_Object *layout = data;
+   Evas_Object *item;
+
+   elm_layout_table_clear(layout, TABLE, EINA_TRUE);
+   elm_layout_box_remove_all(layout, BOX, EINA_TRUE);
+   item = elm_layout_content_unset(layout, SWALLOW);
+   evas_object_del(item);
+}
+
+int
+elm_main(int argc __UNUSED__, char **argv __UNUSED__)
+{
+   Evas_Object *win, *bg, *icon, *icon2, *bt, *bt2, *layout;
+   Evas_Object *clock;
+   Evas_Object *item;
+
+   win = elm_win_add(NULL, "layout", ELM_WIN_BASIC);
+   elm_policy_set(ELM_POLICY_QUIT, ELM_POLICY_QUIT_LAST_WINDOW_CLOSED);
+   elm_win_autodel_set(win, 1);
+
+   bg = elm_bg_add(win);
+   elm_bg_color_set(bg, 255,255 ,255);
+   evas_object_size_hint_weight_set(bg, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND);
+   elm_win_resize_object_add(win, bg);
+   evas_object_show(bg);
+
+   // Adding layout and filling it with widgets
+   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);
+   elm_layout_file_set(
+       layout, PACKAGE_DATA_DIR "/examples/layout_example.edj",
+       "example/mylayout");
+   evas_object_show(layout);
+
+   // Setting title
+   const char *title = elm_layout_data_get(layout, "title");
+   if (title)
+     {
+	elm_win_title_set(win, title);
+	elm_object_text_part_set(layout, TITLE, title);
+     }
+
+   // Add icon, clock and button to the table
+   icon = elm_icon_add(win);
+   elm_icon_standard_set(icon, "home");
+   evas_object_size_hint_weight_set(icon, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND);
+   evas_object_size_hint_align_set(icon, EVAS_HINT_FILL, EVAS_HINT_FILL);
+   elm_layout_table_pack(layout, TABLE, icon, 0, 0, 1, 1);
+   evas_object_show(icon);
+
+   icon2 = elm_icon_add(win);
+   elm_icon_standard_set(icon2, "close");
+   evas_object_size_hint_weight_set(icon2, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND);
+   evas_object_size_hint_align_set(icon2, EVAS_HINT_FILL, EVAS_HINT_FILL);
+   elm_layout_table_pack(layout, TABLE, icon2, 1, 0, 1, 1);
+   evas_object_show(icon2);
+
+   clock = elm_clock_add(win);
+   evas_object_size_hint_weight_set(clock, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND);
+   evas_object_size_hint_align_set(clock, EVAS_HINT_FILL, EVAS_HINT_FILL);
+   elm_layout_table_pack(layout, TABLE, clock, 2, 0, 1, 1);
+   evas_object_show(clock);
+
+   bt = elm_button_add(win);
+   elm_object_text_set(bt, "Click me!");
+   evas_object_size_hint_weight_set(bt, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND);
+   evas_object_size_hint_align_set(bt, EVAS_HINT_FILL, EVAS_HINT_FILL);
+   elm_layout_table_pack(layout, TABLE, bt, 0, 1, 3, 1);
+   evas_object_smart_callback_add(bt, "clicked", _tbl_btn_cb, layout);
+   evas_object_show(bt);
+
+   item = elm_button_add(win);
+   elm_object_text_set(item, "Position 0");
+   evas_object_size_hint_weight_set(item, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND);
+   evas_object_size_hint_align_set(item, EVAS_HINT_FILL, EVAS_HINT_FILL);
+   evas_object_size_hint_min_set(item, 100, 50);
+   elm_layout_box_insert_at(layout, BOX, item, 0);
+   evas_object_smart_callback_add(item, "clicked", _box_btn_cb, layout);
+   evas_object_show(item);
+
+   item = elm_button_add(win);
+   elm_object_text_set(item, "Prepended");
+   evas_object_size_hint_weight_set(item, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND);
+   evas_object_size_hint_align_set(item, EVAS_HINT_FILL, EVAS_HINT_FILL);
+   evas_object_size_hint_min_set(item, 100, 50);
+   elm_layout_box_prepend(layout, BOX, item);
+   evas_object_smart_callback_add(item, "clicked", _box_btn_cb, layout);
+   evas_object_show(item);
+
+   bt2 = elm_button_add(win);
+   elm_object_text_set(bt2, "Delete All");
+   elm_layout_content_set(layout, SWALLOW, bt2);
+   evas_object_smart_callback_add(bt2, "clicked", _swallow_btn_cb, layout);
+
+   evas_object_size_hint_min_set(bg, 160, 160);
+   evas_object_size_hint_max_set(bg, 640, 640);
+   evas_object_resize(win, 320, 320);
+   evas_object_show(win);
+
+   elm_run();
+
+   return 0;
+}
+
+ELM_MAIN()

legacy/elementary/src/examples/layout_example_02.c

@@ -0,0 +1,88 @@
+//Compile with:
+//gcc -g `pkg-config --cflags --libs elementary` layout_example_02.c -o layout_example_02
+
+#include <Elementary.h>
+#ifdef HAVE_CONFIG_H
+# include "elementary_config.h"
+#else
+# define __UNUSED__
+#endif
+
+#define TABLE "example/table"
+#define BOX "example/box"
+#define TITLE "example/title"
+#define SWALLOW "example/custom"
+
+static const char *images[] = { "home", "close", "arrow_up", "arrow_down", NULL };
+
+struct _App {
+     int current;
+};
+
+static void
+_signal_cb(void *data, Evas_Object *o, const char *emission, const char *source __UNUSED__)
+{
+   struct _App *app = data;
+   Evas_Object *icon = elm_layout_content_get(o, "elm.swallow.content");
+
+   printf("signal received\n");
+
+   if (!strcmp("elm,action,back", emission))
+     app->current--;
+   else if (!strcmp("elm,action,next", emission))
+     app->current++;
+
+   if (app->current < 0)
+     app->current = sizeof(images) - 1;
+   else if (images[app->current] == NULL)
+     app->current = 0;
+
+   elm_icon_standard_set(icon, images[app->current]);
+}
+
+int
+elm_main(int argc __UNUSED__, char **argv __UNUSED__)
+{
+   Evas_Object *win, *bg, *layout, *icon;
+   struct _App app;
+
+   app.current = 0;
+
+   win = elm_win_add(NULL, "layout", ELM_WIN_BASIC);
+   elm_win_title_set(win, "Layout");
+   elm_policy_set(ELM_POLICY_QUIT, ELM_POLICY_QUIT_LAST_WINDOW_CLOSED);
+   elm_win_autodel_set(win, 1);
+
+   bg = elm_bg_add(win);
+   elm_bg_color_set(bg, 255, 255, 255);
+   evas_object_size_hint_weight_set(bg, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND);
+   elm_win_resize_object_add(win, bg);
+   evas_object_show(bg);
+
+   // Adding layout and filling it with widgets
+   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);
+   elm_layout_theme_set(
+       layout, "layout", "application", "content-back-next");
+   evas_object_show(layout);
+
+   icon = elm_icon_add(win);
+   elm_icon_standard_set(icon, images[app.current]);
+   evas_object_size_hint_weight_set(layout, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND);
+   elm_layout_content_set(layout, "elm.swallow.content", icon);
+
+   elm_object_signal_callback_add(layout, "elm,action,back", "", _signal_cb, &app);
+   elm_object_signal_callback_add(layout, "elm,action,next", "", _signal_cb, &app);
+
+   evas_object_size_hint_min_set(bg, 160, 160);
+   evas_object_size_hint_max_set(bg, 640, 640);
+   evas_object_resize(win, 320, 320);
+   evas_object_show(win);
+
+   elm_run();
+
+   return 0;
+}
+
+ELM_MAIN()

legacy/elementary/src/examples/layout_example_03.c

@@ -0,0 +1,99 @@
+//Compile with:
+//gcc -g `pkg-config --cflags --libs elementary` layout_example_03.c -o layout_example_03
+
+#include <Elementary.h>
+#ifdef HAVE_CONFIG_H
+# include "elementary_config.h"
+#else
+# define __UNUSED__
+# define PACKAGE_DATA_DIR "."
+#endif
+
+#define TITLE "example/title"
+#define SWALLOW "example/custom"
+
+static Eina_Bool _btn_large = EINA_FALSE;
+
+static void
+_swallow_btn_cb(void *data, Evas_Object *btn, void *event_info __UNUSED__)
+{
+   Evas_Object *layout = data;
+
+   if (_btn_large == EINA_FALSE)
+     {
+	_btn_large = EINA_TRUE;
+	elm_object_signal_emit(layout, "button,enlarge", "");
+	elm_object_text_set(btn, "Reduce me!");
+     }
+   else
+     {
+	_btn_large = EINA_FALSE;
+	elm_object_signal_emit(layout, "button,reduce", "");
+	elm_object_text_set(btn, "Enlarge me!");
+     }
+}
+
+static void
+_size_changed_cb(void *data __UNUSED__, Evas_Object *layout, const char *emission __UNUSED__, const char *source __UNUSED__)
+{
+   Evas_Object *edje;
+   Evas_Coord w, h;
+
+   elm_layout_sizing_eval(layout);
+   edje = elm_layout_edje_get(layout);
+   edje_object_size_min_calc(edje, &w, &h);
+   printf("Minimum size for this theme: %dx%d\n", w, h);
+}
+
+int
+elm_main(int argc __UNUSED__, char **argv __UNUSED__)
+{
+   Evas_Object *win, *bg, *btn, *layout;
+
+   win = elm_win_add(NULL, "layout", ELM_WIN_BASIC);
+   elm_policy_set(ELM_POLICY_QUIT, ELM_POLICY_QUIT_LAST_WINDOW_CLOSED);
+   elm_win_autodel_set(win, 1);
+
+   bg = elm_bg_add(win);
+   elm_bg_color_set(bg, 255,255 ,255);
+   evas_object_size_hint_weight_set(bg, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND);
+   elm_win_resize_object_add(win, bg);
+   evas_object_show(bg);
+
+   // Adding layout
+   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);
+   elm_layout_file_set(
+       layout, PACKAGE_DATA_DIR "/examples/layout_example.edj",
+       "example/mylayout3");
+   evas_object_show(layout);
+
+   elm_object_signal_callback_add(layout, "size,changed", "", _size_changed_cb, layout);
+
+   // Setting title
+   const char *title = elm_layout_data_get(layout, "title");
+   if (title)
+     {
+	elm_win_title_set(win, title);
+	elm_object_text_part_set(layout, TITLE, title);
+     }
+
+   btn = elm_button_add(win);
+   elm_object_text_set(btn, "Enlarge me!");
+   evas_object_size_hint_weight_set(btn, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND);
+   evas_object_size_hint_align_set(btn, EVAS_HINT_FILL, EVAS_HINT_FILL);
+   elm_layout_content_set(layout, SWALLOW, btn);
+   evas_object_smart_callback_add(btn, "clicked", _swallow_btn_cb, layout);
+
+   evas_object_size_hint_min_set(bg, 160, 160);
+   evas_object_size_hint_max_set(bg, 640, 640);
+   evas_object_resize(win, 160, 160);
+   evas_object_show(win);
+
+   elm_run();
+
+   return 0;
+}
+
+ELM_MAIN()