Wiki pages containers_pg created: 1 main and 11 PG + 22 images + index

Signed-off-by: Clément Bénier <clement.benier@openwide.fr>

pages/docs.txt

@@ -57,6 +57,7 @@ Go check the current available version of EFL on each distro/platform:
 === Programming Guide ===
 
   * [[program_guide/basic_application_structure_pg|Basic Application structure PG]]
+  * [[program_guide/containers_pg|Containers PG]]
 
 ----
 

pages/program_guide/basic_application_structure_pg.txt

@@ -65,7 +65,7 @@ the content and where the Evas canvas is placed.
 There are three main groups of objects provided by Elementary:
 
     * [[/coming_soon|Widgets]]: These are the widgets with which you build your application UI.
-    * [[/coming_soon|Containers]]: These are the containers that hold the widgets.
+    * [[[[program_guide/containers_pg|Containers]]: These are the containers that hold the widgets.
     * Infrastructure: These are the modules that deal with Elementary as a whole.
 
 [[/docs/efl/start|EFL Hello World Tutorial]] shows you how to develop your first application with

pages/program_guide/containers/box.txt

@@ -0,0 +1,257 @@
+~~Title: Box Container PG~~
+{{page>index}}
+----
+===== Box Container =====
+{{ :container_box_tree.png }}{{ :container_box.png }}
+
+Most of the time, you want to display widgets on the screen in a specific
+order. In Form Tutorial, for example, the user information is arranged
+vertically. This basic container is called a box. There is no theme for a box
+layout. It is just a linear method of arranging widgets horizontally or
+vertically.
+
+=== Table of Contents ===
+
+  * [[#Creating_a_Box|Creating a Box]]
+  * [[#Adding_Objects_to_the_Box|Adding Objects to the Box]]
+  * [[#Setting_the_Padding|Setting the Padding]]
+  * [[#Handling_Element_Size|Handling Element Size]]
+  * [[#Setting_the_Alignment|Setting the Alignment]]
+  * [[#Using_Size_Hints|Using Size Hints]]
+
+=== Related Info ===
+
+  * [[https://build.enlightenment.org/job/nightly_elm_gcc_x86_64/lastSuccessfulBuild/artifact/doc/html/group__Box.html|Box Container API]]
+  * [[https://build.enlightenment.org/job/nightly_elm_gcc_x86_64/lastSuccessfulBuild/artifact/doc/html/box_example_01.html|A Basic Box Example]]
+  * [[https://build.enlightenment.org/job/nightly_elm_gcc_x86_64/lastSuccessfulBuild/artifact/doc/html/box_example_02.html|A Layout Transition Example]]
+
+==== Creating a Box ====
+
+By default, the box will start in the vertical orientation, placing its elements ordered
+from top to bottom.
+
+To create a new vertical box:
+
+<code c>
+Evas_Object *vbox = elm_box_add(parent);
+</code>
+
+By default, the ''elm_box_add()'' function creates a vertical box. If you want
+to create a horizontal box, use the  function:
+
+To change the orientation, use ''elm_box_horizontal_set()'' function. When
+horizontal is set, the order will go from left to right.
+
+<code c>
+Evas_Object *hbox = elm_box_add(parent);
+elm_box_horizontal_set(hbox, EINA_TRUE);
+</code>
+
+<note>
+A box is a non-graphical object. It adds no graphics to or around the objects
+it holds.
+</note>
+
+==== Addind Objects to the Box ====
+
+You can add any Evas object to the box. There are multiples ways to add an
+object to a box, 4 functions can be used:
+
+|''elm_box_pack_end()''|Add an object at the end of the pack list.\\ \\ Pack the object into the box, placing it last in the list of children objects. The actual position the object will get on screen depends on the layout used. If no custom layout is set, it will be at the bottom or right, depending if the box is vertical or horizontal, respectively.|
+|''elm_box_pack_start()''|Add an object to the beginning of the pack list. \\ \\ Pack object into the box, placing it first in the list of children objects. The actual position the object will get on screen depends on the layout used. If no custom layout is set, it will be at the top or left, depending if the box is vertical or horizontal, respectively.|
+|''elm_box_pack_before()''|Adds an object to the box before the indicated object.\\ \\ This will add the object to the box indicated before the object indicated with before. If before is not already in the box, results are undefined. Before means either to the left of the indicated object or above it depending on orientation.|
+|''elm_box_pack_after()''|Adds an object to the box after the indicated object. \\ \\ This will add the object to the box indicated after the object indicated with after. If after is not already in the box, results are undefined. After means either to the right of the indicated object or below it depending on orientation.|
+
+Below, an example shows how works these 4 functions. First, 2 button widgets
+are added to the box with ''elm_box_pack_end()'' then ''elm_box_pack_before()''
+function adds a button before the last added button and
+''elm_box_pack_start()'' adds a button at the top of the box list. Finally a
+button is added just after the top button in the box list with
+''elm_box_pach_after()'':
+
+<code c>
+Evas_Object *bt_end, *bt_start, *bt_before, *bt_after;
+int i;
+char tmp[16];
+//add 2 buttons
+for (i = 0; i < 2; i++)
+  {
+     snprintf(tmp, sizeof(tmp), "Button %d", i);
+     bt_end = elm_button_add(vbox);
+     elm_object_text_set(bt_end, tmp);
+     elm_box_pack_end(vbox, bt_end);
+     evas_object_show(bt_end);
+  }
+
+//add bt_before before bt_end(button 1)
+bt_before = elm_button_add(vbox);
+elm_object_text_set(bt_before, "Button Before");
+elm_box_pack_before(vbox, bt_before, bt_end);
+evas_object_show(bt_before);
+
+//add bt_start
+bt_start = elm_button_add(vbox);
+elm_object_text_set(bt_start, "Button Start");
+elm_box_pack_start(vbox, bt_start);
+evas_object_show(bt_start);
+
+//add bt_start
+bt_after = elm_button_add(vbox);
+elm_object_text_set(bt_after, "Button After");
+elm_box_pack_after(vbox, bt_after,bt_start);
+evas_object_show(bt_after);
+</code>
+
+==== Setting the Padding ====
+
+You can set the padding between the objects in a box by using the
+''elm_box_padding_set()'' function. The padding values are the number of
+pixels horizontally and vertically.
+
+<code c>
+elm_box_padding_set(vbox, 16, 6);
+</code>
+
+==== Handling Element Size ====
+
+You can add different-size elements to a container. For example, to add an
+image with a size of 128x128 pixels as the first element in a box, use the
+''elm_box_pack_start()'' function:
+
+<code c>
+Evas_Object *ic = elm_icon_add(vbox);
+elm_image_file_set(ic, "./c1.png", NULL);
+evas_object_size_hint_min_set(ic, 128, 128);
+evas_object_show(ic);
+elm_box_pack_start(vbox, ic);
+</code>
+
+We ask Evas to set the size hint for the icon object by using the
+''elm_object_size_hint_min_set()'' function. Evas will try to set the minimum size
+of this object accordingly.
+
+If you want to create a homogeneous box, where all objects have the same
+height or width, depending on the orientation of the box, use the
+''elm_box_homogeneous_set()'' function:
+
+<code c>
+elm_box_homogeneous_set(vbox, EINA_TRUE);
+</code>
+
+Elementary will set the height of the tallest object as the height of all
+objects, or the width of the widest element as the width of all objects.
+
+==== Setting the Alignment ====
+
+You can set the alignment of widgets inside a box using the
+''elm_box_align_set()'' function. The function takes two doubles values, a
+horizontal value and a vertical value, representing the percentage between 0
+and 1.0 of the alignment in the horizontal and vertical axes. When you add a
+widget with the ''elm_box_pack_end()'' or ''elm_box_pack_start()'' function,
+Elementary computes the global size of the box. If the global size is bigger
+than the size of the box's parent, the box will take up all the space occupied
+by the parent, and the size of the parent may be extended to hold the box. If
+the global size is smaller than the parent's size, the alignment values will
+set the position of the box inside the parent.
+
+{{ :container_box_align.png }}
+
+Here, we set an alignment of 0.8 vertically:
+
+<code c>
+elm_box_align_set(vbox, 0.0, 0.8);
+</code>
+
+<note>
+The alignment only takes effect in the opposite direction than the one defined
+with the ''elm_box_horizontal_set()'' function.
+</note>
+
+The ''elm_box_layout_transition()'' function provides the ability to animate
+the motion of the objects in a box when switching from one layout to another.
+
+==== Using Size Hints ====
+
+Size hints are a set of functions that can be used on any Evas object. You
+request Evas to take care of various properties, and Evas will honor these
+requests if it can. This is why they are called "hints". The size hint
+functions are:
+
+  * ''evas_object_size_hint_min_set()''
+  * ''evas_object_size_hint_max_set()''
+  * ''evas_object_size_hint_aspect_set()''
+  * ''evas_object_size_hint_align_set()''
+  * ''evas_object_size_hint_weight_set()''
+
+You can also use the respective get functions to get the current hint values.
+
+In case of the ''evas_object_size_hint_min_set()'' function, you ask Evas to
+respect the minimum size you define for the object. For example, to set the
+minimum size of an icon to 64x46 pixels:
+
+<code c>
+evas_object_size_hint_min_set(ic, 64, 64);
+</code>
+
+You can also set a maximum size for the same icon:
+
+<code c>
+evas_object_size_hint_max_set(ic, 128, 128);
+</code>
+
+When you resize the parent of the icon, if there are no constraints to the
+parent, the minimum size of the parent will be the minimum hint size of the
+icon. If you increase the parent size, the icon will grow larger until its
+maximum hint size is reached. After this point, the icon will not grow any
+larger and there will be empty space around the icon within the parent.
+
+When the aspect size hint is set, Evas tries to fix the dimensional
+proportions of the object. Here, the proportion of the icon is respected, and
+the width will be the same as the height:
+
+<code c>
+evas_object_size_hint_aspect_set(ic, EVAS_ASPECT_CONTROL_VERTICAL, 1,1);
+</code>
+
+Here, the width will be twice the height:
+
+<code c>
+evas_object_size_hint_aspect_set(ic, EVAS_ASPECT_CONTROL_VERTICAL, 2,1);
+</code>
+
+If we want to change the alignment of the icon relative to the parent, we can
+use the ''evas_object_size_hint_align()'' function. By default, the icon is
+centered, so it is aligned with a value of 0.5. You can change the alignment
+as follows:
+
+<code c>
+evas_object_size_hint_align_set(ic, EVAS_HINT_FILL, EVAS_HINT_FILL);
+</code>
+
+In the above case, the icon is aligned to the bottom left corner of the
+parent.
+
+We can also play with the size of the icon inside its container by using the
+weight size hint. By default, the weight is not set, so the size of the icon
+will be the minimum size. But if you set this value to 1, the icon will be
+expand as much as it can inside the container:
+
+<code c>
+evas_object_size_hint_weight_set(ic, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND);
+</code>
+
+You can also use the alignment and weight hints together. Here, we want the
+icon to take up all the space in its parent:
+
+<code c>
+evas_object_size_hint_align_set(ic, EVAS_HINT_FILL, EVAS_HINT_FILL);
+evas_object_size_hint_weight_set(ic, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND);
+</code>
+
+\\
+//**__[[https://build.enlightenment.org/job/nightly_elm_gcc_x86_64/lastSuccessfulBuild/artifact/doc/html/box_example_01.html|A Basic Box Example]]__**//
+-
+//**__[[https://build.enlightenment.org/job/nightly_elm_gcc_x86_64/lastSuccessfulBuild/artifact/doc/html/box_example_02.html|A Layout Transition Example]]__**//
+\\
+----
+{{page>index}}

pages/program_guide/containers/conformant.txt

@@ -0,0 +1,54 @@
+~~Title: Conformant Container PG~~
+{{page>index}}
+----
+===== Conformant Container =====
+
+{{ :container_conformant_tree.png }}{{ :container_conformant.png }}
+
+A conformant is a container widget that accounts for the space taken by the
+indicator, virtual keyboard, and softkey windows. The content area of the
+conformant is resized and positioned based on the space available. When the
+virtual keyboard is displayed, the content area is not resized.
+
+=== Table of Contents ===
+
+  * [[/program_guide/containers/conformant#Creating_a_Conformant|Creating a Conformant]]
+  * [[/program_guide/containers/conformant#Adding_Content_to_the_Conformant|Adding Content to the Conformant]]
+  * [[/program_guide/containers/conformant#Signals|Signals]]
+
+=== Related Info ===
+
+  * [[https://build.enlightenment.org/job/nightly_elm_gcc_x86_64/lastSuccessfulBuild/artifact/doc/html/group__Conformant.html|Conformant Container API]]
+  * [[https://build.enlightenment.org/job/nightly_elm_gcc_x86_64/lastSuccessfulBuild/artifact/doc/html/conformant_example_02_8c-example.html|A Conformant container example]]
+
+==== Creating a Conformant ====
+
+To create a conformant, use the ''elm_conformant_add()'' function:
+
+<code c>
+Evas_Object *conformant = elm_conformant_add(parent);
+</code>
+
+==== Adding Content to the Conformant ====
+
+To add content to the conformant, use the ''elm_object_content_set()'' function:
+
+<code c>
+elm_object_content_set(conformant, main_view);
+</code>
+
+==== Signals ====
+
+To receive notifications about the state of the virtual keyboard and
+clipboard, listen to the following Evas signals:
+
+    * ''"virtualkeypad,state,on"'': The virtual keyboard has been switched on.
+    * ''"virtualkeypad,state,off"'': The virtual keyboard has been switched off.
+    * ''"virtualkeypad,size,changed"'': The virtual keyboard size has changed.
+    * ''"clipboard,state,on"'': The clipboard has been switched on.
+    * ''"clipboard,state,off"'': The clipboard has been switched off.
+
+//**__[[https://build.enlightenment.org/job/nightly_elm_gcc_x86_64/lastSuccessfulBuild/artifact/doc/html/conformant_example_02_8c-example.html|A Conformant container example]]__**//
+\\
+----
+{{page>index}}

pages/program_guide/containers/gengrid.txt

@@ -0,0 +1,124 @@
+~~Title: Gengrid Container PG~~
+{{page>index}}
+----
+===== Gengrid Container =====
+{{ :container_gengrid_tree.png }}{{ :container_gengrid.png }}
+
+Gengrid container is based on the same idea as the genlist. It aims at displaying
+objects on a grid layout and rendering only the visible ones. As for the
+genlist, callbacks are called at item creation or deletion.
+
+This container inherits from the layout widget and implements the scroller
+interface. Thus scroller and layout functions can be used with this widget.
+
+A gengrid may display its items using horizontal or vertical layout. In the
+first layout, items are displayed in columns from top to bottom, starting a
+new column when the space for the current column is filled. In the second one,
+items are set in rows from left to right.
+
+=== Table of Contents ===
+
+  * [[#Adding_a_Gengrid|Adding a Gengrid]]
+  * [[#Gengrid_Items|Gengrid Items]]
+  * [[#Creating_and_Deleting_Items|Creating and Deleting Items]]
+  * [[#Managing_Items|Managing Items]]
+  * [[#Using_Gengrid_Callbacks|Using Gengrid Callbacks]]
+
+=== Related Info ===
+
+  * [[https://build.enlightenment.org/job/nightly_elm_gcc_x86_64/lastSuccessfulBuild/artifact/doc/html/group__Gengrid.html|Gengrid Widget API]]
+  * [[https://build.enlightenment.org/job/nightly_elm_gcc_x86_64/lastSuccessfulBuild/artifact/doc/html/gengrid_example.html|A Gengrid Example]]
+
+==== Adding a Gengrid ====
+
+To add a gengrid widget:
+
+<code c>
+Evas_Object *gengrid = elm_gengrid_add(parent);
+</code>
+
+==== Gengrid Items ====
+
+A gengrid item is composed of 0 or more texts, 0 or more contents and 0 or
+more boolean states. The number of the text and content depends on the theme
+used for gengrid items. For the default gengrid item theme, we
+have one text part ("elm.text"), two content parts ("elm.swallow.icon" and
+"elm.swallow.end") and no state parts.
+
+
+==== Creating and Deleting Items ====
+
+As with genlists, items are allocated and deleted on the go, while the user is
+scrolling the gengrid. Here we declare a ''Elm_Gengrid_Item_Class'' structure to
+inform the gengrid how to manage items.
+<code c>
+static Elm_Gengrid_Item_Class *gic = elm_gengrid_item_class_new();
+gic->item_style = "default";
+gic->func.text_get = _grid_label_get;
+gic->func.content_get = _grid_content_get;
+gic->func.state_get = _grid_state_get;
+gic->func.del = _grid_del;
+</code>
+
+The parameters of this structure will not be detailed here, because they are
+very similar to that of the genlist. Please refer to the
+[[/program_guide/containers/genlist|genlist widget
+page]]
+for more detailed information.
+
+==== Managing Items ====
+
+As with genlists, items can be added with the ''elm_gengrid_item_append()'',
+''elm_gengrid_item_prepend()'', ''elm_gengrid_item_insert_before()'' and
+''elm_gengrid_item_insert_after()'' functions. With the gengrid, there is no need
+to pass the "type" parameters. They can be cleared with the
+''elm_gengrid_clear()'' function.
+
+We can set the multiselection mode on.
+
+<code c>
+elm_gengrid_multi_select_set(gengrid, EINA_TRUE);
+</code>
+
+When this mode is on, selected items are retrieved with
+''elm_gengrid_selected_items_get()''. It returns a list of all the selected items.
+
+When the content of an item changes, we can call ''elm_gengrid_item_update()'' to
+ask the gengrid to update this item's content.
+
+We can also manually select or disable some items with
+''elm_gengrid_item_selected_set()'' and ''elm_object_item_disabled_set()''.
+
+==== Using Gengrid Callbacks ====
+
+The gengrid widget emits the following signals:
+
+  * ''"activated"'' - The user has double-clicked or pressed (enter | return | spacebar) on an item. The event_info parameter is the gengrid item that is activated.
+  * ''"clicked,double"'' - The user has double-clicked an item. The event_info parameter is the gengrid item that is double-clicked.
+  * ''"longpressed"'' - The item is pressed for a certain amount of time. By default it is one second.
+  * ''"selected"'' - The user has selected an item. The event_info parameter is the gengrid item that is selected.
+  * ''"unselected"'' - The user has unselected an item. The event_info parameter is the gengrid item that is unselected.
+  * ''"realized"'' - The item in the gengrid has its implementing Evas object instantiated, de facto. event_info is the gengrid item that is created. The object may be deleted at any time, so it is strongly advisable not to use the object pointer returned from elm_gengrid_item_object_get(), because it may point to freed objects.
+  * ''"unrealized"'' - The implementing Evas object for this item is deleted. event_info is the gengrid item that is deleted.
+  * ''"changed"'' - An item is added, removed, resized or moved and the gengrid is resized or has "horizontal" property changes.
+  * ''"scroll,anim,start"'' - Scrolling animation starts.
+  * ''"scroll,anim,stop"'' - Scrolling animation stops.
+  * ''"drag,start,up"'' - The item in the gengrid is dragged (not scrolled) up.
+  * ''"drag,start,down"'' - The item in the gengrid has dragged (not scrolled) down.
+  * ''"drag,start,left"'' - The item in the gengrid is dragged (not scrolled) left.
+  * ''"drag,start,right"'' - The item in the gengrid is dragged (not scrolled) right.
+  * ''"drag,stop"'' - The item in the gengrid stops being dragged.
+  * ''"drag"'' - The item in the gengrid is dragged.
+  * ''"scroll"'' - The content is scrolled (moved).
+  * ''"scroll,drag,start"'' - Dragging the content starts.
+  * ''"scroll,drag,stop"'' - Dragging the content stops.
+  * ''"edge,top"'' - The gengrid is scrolled to the top edge.
+  * ''"edge,bottom"'' - The gengrid is scrolled to the bottom edge.
+  * ''"edge,left"'' - The gengrid is scrolled to the left edge.
+  * ''"edge,right"'' - The gengrid is scrolled to the right edge.
+
+\\
+//**__[[https://build.enlightenment.org/job/nightly_elm_gcc_x86_64/lastSuccessfulBuild/artifact/doc/html/gengrid_example.html|A Gengrid Example]]__**//
+\\
+----
+{{page>index}}

pages/program_guide/containers/genlist.txt

@@ -0,0 +1,218 @@
+~~Title: Genlist Container PG~~
+{{page>index}}
+----
+===== Genlist Container =====
+{{ :container_genlist_tree.png }}{{ :container_genlist.png }}
+
+Genlist is a container that displays a scrollable list of items. It allows a lot of entries while being fast and has a low memory footprint (only the visible items are allocated in the memory).
+
+=== Table of Contents ===
+
+  * [[#Genlist_Item_Style|Genlist Item Style]]
+  * [[#Adding_a_Genlist|Adding a Genlist]]
+  * [[#Creating_And_Deleting_Items|Creating And Deleting Items]]
+  * [[#Managing_Items|Managing Items]]
+  * [[#Selection|Selection]]
+  * [[#Using_Genlist_Callbacks|Using Genlist Callbacks]]
+
+=== Related Info ===
+
+  * [[/tutorial/genlist_tutorial|Genlist Tutorial]]
+  * [[https://build.enlightenment.org/job/nightly_elm_gcc_x86_64/lastSuccessfulBuild/artifact/doc/html/group__Genlist.html|Genlist Widget API]]
+  * [[https://build.enlightenment.org/job/nightly_elm_gcc_x86_64/lastSuccessfulBuild/artifact/doc/html/genlist_example.html|A Genlist Example]]
+
+==== Genlist Item Style ====
+
+An item can have 0 or more texts, 0 or more contents, and 0 or more boolean
+states. This is defined in the Edje item theme style. Genlist looks for data
+items named respectively "labels", "contents", and "states" in the Edje file.
+The "default" item style provides one text part ("elm.text"), two content
+parts ("elm.swalllow.icon" and "elm.swallow.end") and no state parts.
+
+The following item styles are available:
+
+  * default
+  * default_style - The text part is a textblock
+  * double_label
+  * icon_top_text_bottom
+  * group_index
+  * one_icon - Only 1 icon (left) (since 1.7)
+  * end_icon - Only 1 icon (at end/right) (since 1.7)
+  * no_icon - No icon (at end/right) (since 1.7)
+  * full - Only 1 icon, elm.swallow.content, which consumes whole area of genlist itemj (since 1.7)
+
+If one wants to use more icons and texts than are offered in theme, there are
+two solutions. One is to use 'full' style that has one big swallow part. You
+can swallow anything there. The other solution is to customize genlist item
+style in application side by using ''elm_theme_extension_add()'' and its own edc.
+
+==== Adding a Genlist ====
+
+Genlist widget is added with the ''elm_genlist_add()'' function.
+
+<code c>
+
+Evas_Object *genlist;
+genlist = elm_genlist_add(parent);
+</code>
+
+==== Creating And Deleting Items ====
+
+To save up memory, genlist allocates and deletes items on the go, while the
+user is scrolling the list. To enable that, the user creates and fills a
+''Elm_Genlist_Item_Class'' structure that informs the genlist widget which
+callbacks to call when an item is created or deleted.
+
+<code c>
+
+Elm_Genlist_Item_Class *itc = elm_genlist_item_class_new();
+
+itc->item_style = "default";
+itc->decorate_item_style = NULL;
+itc->decorate_all_item_style = NULL;
+itc->func.text_get = _item_label_get;
+itc->func.content_get = _item_content_get;
+itc->func.state_get = _item_state_get;
+itc->func.del = _item_del;
+</code>
+
+The ''item_style'', ''decorate_item_style'', and ''decorate_all_item_style''
+attributes define the names of the item style, the decorate mode item style
+and the decorate all item style.
+
+The ''func'' structure contains pointers to functions that are called when an
+item is going to be created or deleted. All of them receive a data parameter
+that points to the same data passed to the ''elm_genlist_item_append()'' and
+related item creation functions, and an obj parameter that points to the
+genlist object itself.
+
+|''text_get''|This function receives a PART parameter that is the name string of one of the existing text parts in the Edje group implementing the item's theme. It has to return a string (duplicated with the ''strdup()'' function) corresponding to the PART parameter. The caller is in charge of freeing the string when done.|
+|''content_get''|The PART parameter is the name string of one of the existing swallow parts in the Edje group. When no content is desired it must return NULL, or otherwise, a valid object handle. The object is deleted by the genlist on its deletion or when the item is "unrealized".|
+|''state_get''|The PART parameter is the name string of one of the state parts in the Edje group implementing the item's theme. It returns EINA_FALSE for false/off or EINA_TRUE for true/on. The default is false. Genlists emit a signal to the PART parameter's theming Edje object with "elm,state,xxx,active" as "emission" and "elm" as "source" argument, when the state is true. xxx is the name of the (state) part.|
+|''del''|This function is called when the genlist item is deleted. It deletes any data that is allocated at the item creation.|
+
+==== Managing Items ====
+
+To add an item, several functions can be used. ''elm_genlist_item_append()''
+adds an item to the end of the list, or if there is a parent list, to the end
+of all the child items of the parent list. ''elm_genlist_item_prepend()'' is
+otherwise the same but adds to the beginning of the list or children lists.
+''elm_genlist_item_insert_before()'' inserts an item before the indicated item
+and ''elm_genlist_item_insert_after()'' inserts an item after the indicated
+item.
+
+The previous functions take a "type" parameter that can be one of the following.
+
+   * ''ELM_GENLIST_ITEM_NONE''
+   * ''ELM_GENLIST_ITEM_TREE''
+   * ''ELM_GENLIST_ITEM_GROUP''
+
+
+If ''ELM_GENLIST_ITEM_TREE'' is set, this item is displayed as being able to
+expand and have child items. If ''ELM_GENLIST_ITEM_GROUP'' is set, this item is a
+group index item that is displayed at the top until the next group appears.
+
+{{ :container_genlist_treemode.png }}
+
+The application clears the list with ''elm_genlist_clear()'', which deletes
+all the items in the list. ''elm_object_item_del()'' deletes a specific item.
+''elm_genlist_item_subitems_clear()'' clears all items that are children of
+the indicated parent item.
+
+To help inspect list items, move to the item at the top of the list with
+''elm_genlist_first_item_get()'', which returns the item pointer.
+''elm_genlist_last_item_get()'' moves to the item at the end of the list.
+''elm_genlist_item_next_get()'' and ''elm_genlist_item_prev_get()'' move to
+the next and previous items relative to the indicated item. Using these calls
+you can go through the entire item list or tree.
+
+<note>
+As a tree, the items are flattened on the list, so
+''elm_genlist_item_parent_get()'' gives you the name of the parent item (even to
+skip them if needed).
+</note>
+
+''elm_genlist_item_show()'' scrolls the scroller to show the desired item as visible.
+
+''elm_object_item_data_get()'' returns the data pointer set by the item creation functions.
+
+If an item changes (state, boolean, text or content change), use
+''elm_genlist_item_update()'' for the genlist to update the item. Genlist will
+re-realize the item and call the functions in the ''Elm_Genlist_Item_Class'' for
+it.
+
+==== Selection ====
+
+Items are manually selected or unselected with
+''elm_genlist_item_selected_set()'' or disabled with
+''elm_object_item_disabled_set()''. In case there is a tree or a group item,
+the ''elm_genlist_item_expanded_set()'' function is used to expand or contract
+the item.
+
+<note>
+Calling this function does not show or hide any child of an item (if it is a
+parent). You must manually delete and create them on the callbacks of the
+"expanded" or "contracted" signals.
+</note>
+
+By default, the genlist is in single-selection mode: only one item can be
+selected at a time. You can use ''elm_genlist_multi_select_set()'' to select
+multiple items. In single-selection mode, the
+''elm_genlist_selected_item_get()'' function can be called to retrieve the
+selected item. If several items are selected, the
+''elm_genlist_selected_items_get()'' returns a list of the current selected
+items.
+
+In the picture below, there is a genlist in multi-selection mode with two
+items selected (#4 and #5) and one item disabled (#2).
+
+{{ :container_genlist_multi.png }}
+
+==== Using Genlist Callbacks ====
+
+The genlist widget emits the following signals:
+
+   * ''"activated"'': The user has double-clicked or pressed (enter | return | spacebar) on an item. event_info in the callback function points at an object of the type Elm_Object_Item that contains the activated item.
+   * ''"clicked,double"'': The user has double-clicked an item. event_info in the callback function points at an object of the type Elm_Object_Item that contains the activated item.
+   * ''"selected"'': The user selects an item. event_info in the callback function points at an object of the type Elm_Object_Item that contains the activated item.
+   * ''"unselected"'': The user unselects an item. event_info in the callback function points at an object of type Elm_Object_Item that contains the activated item.
+   * ''"expanded"'': The item is to be expanded with ''elm_genlist_item_expanded_set()''. This callback fills in the child items. event_info in the callback function points at an object of the type Elm_Object_Item that contains the activated item.
+   * ''"contracted"'': The item is to be contracted with ''elm_genlist_item_expanded_set()''. This callback deletes the child items. event_info in the callback function points at an object of the type Elm_Object_Item that contains the activated item.
+   * ''"expand,request"'': The user wants to expand a tree branch item. The callback decides if the item can expand (if it has any children) and calls ''elm_genlist_item_expanded_set()'' to set the state. event_info in the callback function points at an object of the type Elm_Object_Item that contains the activated item.
+   * ''"contract,request"'': The user wants to contract a tree branch item. The callback decides if the item can contract (if it has any children) and calls ''elm_genlist_item_expanded_set()'' to set the state. event_info in the callback function points at an object of the type Elm_Object_Item that contains the activated item.
+   * ''"realized"'': The item is created as a real evas object. event_info in the callback function points at an object of the type Elm_Object_Item, that contains the activated item.
+   * ''"unrealized"'': An item is going to be unrealized. Content objects provided are deleted and the item object is deleted or put into a floating cache. event_info in the callback function points at an object of the type Elm_Object_Item that contains the activated item.
+   * ''"drag,start,up"'': The item in the list is dragged (not scrolled) up. event_info in the callback function points at an object of the type Elm_Object_Item that contains the activated item.
+   * ''"drag,start,down"'': The item in the list is dragged (not scrolled) down. event_info in the callback function points at an object of the type Elm_Object_Item that contains the activated item.
+   * ''"drag,start,left"'': The item in the list is dragged (not scrolled) left. event_info in the callback function points at an object of the type Elm_Object_Item that contains the activated item.
+   * ''"drag,start,right"'': The item in the list is dragged (not scrolled) right. event_info in the callback function points at an object of the type Elm_Object_Item that contains the activated item.
+   * ''"drag,stop"'': The item in the list has stopped being dragged. event_info in the callback function points at an object of the type Elm_Object_Item that contains the activated item.
+   * ''"drag"'': The item in the list is being dragged. event_info in the callback function points at an object of the type Elm_Object_Item that contains the activated item.
+   * ''"longpressed"'': The item is pressed for a certain amount of time. The default specified time is one second. event_info in the callback function points at an object of the type Elm_Object_Item that contains the activated item.
+   * ''"scroll,anim,start"'': The scrolling animation is started. event_info is NULL.
+   * ''"scroll,anim,stop"'': The scrolling animation is stopped. event_info is NULL.
+   * ''"scroll,drag,start"'': Dragging the content is started. event_info is NULL.
+   * ''"scroll,drag,stop"'': Dragging the content is stopped. event_info is NULL.
+   * ''"edge,top"'': The genlist is scrolled to the top edge. event_info is NULL.
+   * ''"edge,bottom"'': The genlist is scrolled to the bottom edge. event_info is NULL.
+   * ''"edge,left"'': The genlist is scrolled to the left edge. event_info is NULL.
+   * ''"edge,right"'': The genlist is scrolled to the right edge. event_info is NULL.
+   * ''"multi,swipe,left"'': The genlist is multi-touch swiped left. event_info in the callback function points at an object of the type Elm_Object_Item that contains the activated item.
+   * ''"multi,swipe,right"'': The genlist is multi-touch swiped right. event_info in the callback function points at an object of the type Elm_Object_Item that contains the activated item.
+   * ''"multi,swipe,up"'': The genlist is multi-touch swiped up. event_info in the callback function points at an object of the type Elm_Object_Item that contains the activated item.
+   * ''"multi,swipe,down"'': The genlist is multi-touch swiped down. event_info in the callback function points at an object of the type Elm_Object_Item that contains the activated item.
+   * ''"multi,pinch,out"'': The genlist is multi-touch pinched out. event_info in the callback function points at an object of the type Elm_Object_Item that contains the activated item.
+   * ''"multi,pinch,in"'': The genlist is multi-touch pinched in. event_info in the callback function points at an object of the type Elm_Object_Item that contains the activated item.
+   * ''"swipe"'': The genlist is swiped. event_info in the callback function points at an object of the type Elm_Object_Item that contains the activated item.
+   * ''"moved"'': A genlist item is moved in the reorder mode. event_info in the callback function points at an object of the type Elm_Object_Item that contains the activated item.
+   * ''"moved,after"'': A genlist item is moved after another item in the reorder mode. To access the relative previous item, use ''elm_genlist_item_prev_get()''. This signal is called along with the "moved" signal. event_info in the callback function points at an object of the type Elm_Object_Item that contains the activated item.
+   * ''"moved,before"'': A genlist item is moved before another item in the reorder mode. To access the relative previous item, use ''elm_genlist_item_next_get()''. This signal is called along with the "moved" signal. event_info in the callback function points at an object of the type Elm_Object_Item that contains the activated item.
+   * ''"language,changed"'': The program's language is changed. event_info is NULL.
+   * ''"tree,effect,finished"'': A genlist tree effect is finished. event_info is NULL.
+
+\\
+//**__[[https://build.enlightenment.org/job/nightly_elm_gcc_x86_64/lastSuccessfulBuild/artifact/doc/html/genlist_example.html|A Genlist Example]]__**//
+\\
+----
+{{page>index}}
+

pages/program_guide/containers/grid.txt

@@ -0,0 +1,71 @@
+~~Title: Grid Container PG~~
+{{page>index}}
+----
+===== Grid Container =====
+
+In a grid, objects are placed at specific positions along a fixed grid, where
+the position of each object is given as a percentage of the full width and
+height of the grid. By default, the size of the grid is 100 x 100 pixels.
+
+=== Table of Contents ===
+
+  * [[#Creating_a_Grid|Creating a Grid]]
+  * [[#Adding_Items_to_the_Grid|Adding Items to the Grid]]
+  * [[#Changing_Position_and_Size|Changing Position and Size]]
+  * [[#Clearing_the_Grid|Clearing the Grid]]
+
+=== Relative Info ===
+
+  * [[https://build.enlightenment.org/job/nightly_elm_gcc_x86_64/lastSuccessfulBuild/artifact/doc/html/group__Grid.html|Grid Container API]]
+
+==== Creating a Grid ====
+
+{{ :container_grid_tree.png }}{{ :container_grid.png }}
+
+To create a grid, use the ''elm_grid_add()'' function:
+
+<code c>
+Evas_Object *grid = elm_grid_add(parent);
+</code>
+
+==== Adding Items to the Grid ====
+
+To add an item to the grid, use the ''elm_grid_pack_set()'' function. Provide
+the X and Y coordinates, and the width and height in the grid as parameters.
+The following code adds 12 icons in a circle formation:
+
+<code c>
+for (i = 0; i < 12; i++)
+  {
+     ic = elm_icon_add(grid);
+     elm_image_file_set(ic, "c1.png", NULL);
+     evas_object_size_hint_min_set(ic, 128, 128);
+     evas_object_show(ic);
+     x = 40 * cos(2.0 * M_PI / 12 * i);
+     y = 40 * sin(2.0 * M_PI / 12 * i);
+     elm_grid_pack(grid, ic,  40 + x,  40 + y,  20 , 20);
+  }
+evas_object_show(grid);
+</code>
+
+==== Changing Position and Size ====
+
+To change the position of an item in the grid, use the ''elm_grid_pack_set()''
+function. The first parameter is the item you want to move, and the following
+parameters are the same as for the ''elm_grid_pack()'' function.
+
+To change the size of the grid, use the ''elm_grid_size_set()'' function. You
+can set the new width and height for the grid. The position and size of the
+items in the grid are changed accordingly.
+
+==== Clearing the Grid ====
+
+To clear the grid, use the ''elm_grid_clear()'' function. All items are
+removed from the grid. If you set the clear parameter, all the items are also
+deleted, with the ''evas_object_del()'' function called on each item.
+
+\\
+//**__A Grid container example__: **//{{
+:code_c/programming_guide/container/grid.c }}
+----
+{{page>index}}

pages/program_guide/containers/index.txt

@@ -0,0 +1,14 @@
+++++Container Menu|
+[[/program_guide/containers_pg|Container Programming Guide]]:
+    * [[/program_guide/containers/box|Box]] (//[[https://build.enlightenment.org/job/nightly_elm_gcc_x86_64/lastSuccessfulBuild/artifact/doc/html/group__Box.html|API]]//)
+    * [[/program_guide/containers/conformant|Conformant]] (//[[https://build.enlightenment.org/job/nightly_elm_gcc_x86_64/lastSuccessfulBuild/artifact/doc/html/group__Conformant.html|API]]//)
+    * [[/program_guide/containers/gengrid|Gengrid]](//[[https://build.enlightenment.org/job/nightly_elm_gcc_x86_64/lastSuccessfulBuild/artifact/doc/html/group__Gengrid.html|API]]//)
+    * [[/program_guide/containers/genlist|Genlist]](//[[https://build.enlightenment.org/job/nightly_elm_gcc_x86_64/lastSuccessfulBuild/artifact/doc/html/group__Genlist.html|API]]//)
+    * [[/program_guide/containers/grid|Grid]] (//[[https://build.enlightenment.org/job/nightly_elm_gcc_x86_64/lastSuccessfulBuild/artifact/doc/html/group__Grid.html|API]]//)
+    * [[/program_guide/containers/layout|Layout]] (//[[https://build.enlightenment.org/job/nightly_elm_gcc_x86_64/lastSuccessfulBuild/artifact/doc/html/group__Layout.html|API]]//)
+    * [[/program_guide/containers/mapbuf|Mapbuf]] (//[[https://build.enlightenment.org/job/nightly_elm_gcc_x86_64/lastSuccessfulBuild/artifact/doc/html/group__Mapbuf.html|API]]//)
+    * [[/program_guide/containers/naviframe|Naviframe]] (//[[https://build.enlightenment.org/job/nightly_elm_gcc_x86_64/lastSuccessfulBuild/artifact/doc/html/group__Naviframe.html|API]]//)
+    * [[/program_guide/containers/panes|Panes]] (//[[https://build.enlightenment.org/job/nightly_elm_gcc_x86_64/lastSuccessfulBuild/artifact/doc/html/group__Panes.html|API]]//)
+    * [[/program_guide/containers/scroller|Scroller]] (//[[https://build.enlightenment.org/job/nightly_elm_gcc_x86_64/lastSuccessfulBuild/artifact/doc/html/group__Scroller.html|API]]//)
+    * [[/program_guide/containers/table|Table]] (//[[https://build.enlightenment.org/job/nightly_elm_gcc_x86_64/lastSuccessfulBuild/artifact/doc/html/group__Table.html|API]]//)
+++++

pages/program_guide/containers/layout.txt

@@ -0,0 +1,82 @@
+~~Title: Layout Container PG~~
+{{page>index}}
+----
+===== Layout Container =====
+{{ :container_layout_tree.png }}{{ :container_layout.png }}
+
+A layout is a container widget that takes a standard Edje design file and
+wraps it very thinly in a widget. Layouts are the basis of a lot of graphics
+widgets used in Elementary.
+
+An Edje design file describes how the elements of the UI are positioned and
+how they behave when interacted with. For more information about Edje, see the
+[[/coming_soon|Edje guide]].
+
+=== Table of Contents ===
+
+  * [[#Creating_a_Layout|Creating a Layout]]
+  * [[#Adding_Objects_to_the_Layout|Adding Objects to the Layout]]
+  * [[#Using_Layout_Themes|Using Layout Themes]]
+
+=== Related Info ===
+
+  * [[https://build.enlightenment.org/job/nightly_elm_gcc_x86_64/lastSuccessfulBuild/artifact/doc/html/group__Layout.html|Layout Container API]]
+
+^Layout Examples^^^^
+|[[https://build.enlightenment.org/job/nightly_elm_gcc_x86_64/lastSuccessfulBuild/artifact/doc/html/layout_example_01.html|Content, Table and Box]]|[[https://build.enlightenment.org/job/nightly_elm_gcc_x86_64/lastSuccessfulBuild/artifact/doc/html/layout_example_02.html|Predefined Layout]]|[[https://build.enlightenment.org/job/nightly_elm_gcc_x86_64/lastSuccessfulBuild/artifact/doc/html/layout_example_03.html|Signals and Size Changed ]]|[[https://build.enlightenment.org/job/nightly_elm_gcc_x86_64/lastSuccessfulBuild/artifact/doc/html/layout_example_edc.html|Layout Theme File]]|
+
+==== Creating a Layout ====
+
+To create a new layout, use the ''elm_layout_add()'' function:
+
+<code c>
+Evas_Object *layout = elm_layout_add(parent);
+</code>
+
+
+==== Adding Objects to the Layout ====
+
+To add an Evas object to the layout:
+
+<code c>
+elm_object_part_content_set(ly, "elm.swallow.content", view);
+</code>
+
+''elm.swallow.content'' is the swallow part of the application layout, and with
+this call you integrate the view inside the swallow object of the layout.
+
+==== Using Layout Themes ====
+
+Layout container offers predefined themes that come with the default
+Elementary theme. These themes can be set with ''elm_layout_theme_set()'', and
+provide some basic functionality depending on the theme used.
+
+Most of them already send some signals, some already provide a toolbar or back
+and next buttons.
+
+These are the available predefined theme layouts. All of them have class =
+layout, group = application, and style = one of the following options:
+
+  * ''"toolbar-content"'' - for applications with a toolbar and main content area
+  * ''"toolbar-content-back"'' - for applications with a toolbar and main content (with a back button) and title areas
+  * ''"toolbar-content-back-next"'' - for applications with a toolbar and main content (with back and next buttons) and title areas
+  * ''"content-back"'' - for application with main content (with a back button) and title areas
+  * ''"content-back-next"'' - for applications with main content (with back and next buttons) and title areas
+  * ''"toolbar-vbox"'' - for applications with a toolbar and main content area as a vertical box
+  * ''"toolbar-table"'' - for applications with a toolbar and main content area as a table
+
+To set a theme:
+
+<code c>
+Evas_Object *ly;
+
+ly = elm_layout_add(parent);
+elm_layout_theme_set(ly, "layout", "application", "toolbar-content");
+</code>
+
+\\
+^Layout Examples^^^^
+|[[https://build.enlightenment.org/job/nightly_elm_gcc_x86_64/lastSuccessfulBuild/artifact/doc/html/layout_example_01.html|Content, Table and Box]]|[[https://build.enlightenment.org/job/nightly_elm_gcc_x86_64/lastSuccessfulBuild/artifact/doc/html/layout_example_02.html|Predefined Layout]]|[[https://build.enlightenment.org/job/nightly_elm_gcc_x86_64/lastSuccessfulBuild/artifact/doc/html/layout_example_03.html|Signals and Size Changed ]]|[[https://build.enlightenment.org/job/nightly_elm_gcc_x86_64/lastSuccessfulBuild/artifact/doc/html/layout_example_edc.html|Layout Theme File]]|
+
+----
+{{page>index}}

pages/program_guide/containers/mapbuf.txt

@@ -0,0 +1,89 @@
+~~Title: Mapbuf Container PG~~
+{{page>index}}
+----
+===== Mapbuf Container =====
+
+{{ :container_mapbuf_tree.png }}{{ :container_mapbuf.png }}
+
+A mapbuf widget is a container widget that uses an Evas map to hold a content
+object. This widget is used to improve the moving and resizing performance of
+complex widgets.
+
+The content object is treated as a single image by the Evas map. If you have a
+content object containing several child objects, frequently moving the mapbuf
+widget will be faster than frequently moving the content object.
+
+The mapbuf widget inherits all the functions of the container class.
+
+=== Table of Contents ===
+
+  * [[/program_guide/containers/mapbuf#Creating_a_Mapbuf|Creating a Mapbuf]]
+  * [[/program_guide/containers/mapbuf#Adding_Content_to_the_Mapbuf|Adding Content to the Mapbuf]]
+  * [[/program_guide/containers/mapbuf#Activating_the_Mapbuf|Activating the Mapbuf]]
+  * [[/program_guide/containers/mapbuf#Signals|Signals]]
+
+=== Related Info ===
+
+  * [[https://build.enlightenment.org/job/nightly_elm_gcc_x86_64/lastSuccessfulBuild/artifact/doc/html/group__Mapbuf.html|Mapbuf Container API]]
+  * [[https://build.enlightenment.org/job/nightly_elm_gcc_x86_64/lastSuccessfulBuild/artifact/doc/html/mapbuf_example.html|A Mapbuf Example ]]
+
+==== Creating a Mapbuf ====
+
+To create a mapbuf widget, use the ''elm_mapbuf_add()'' function:
+
+<code c>
+Evas Object* mapbuf = elm_mapbuf_add(parent);
+</code>
+
+==== Adding Content to the Mapbuf ====
+
+To add content to the mapbuf widget, use the ''elm_object_content_set()'' function
+with the "default" part:
+
+<code c>
+elm_object_content_set(mapbuf, content);
+</code>
+
+<note>
+Calling ''elm_object_content_set(mapbuf, content)'' is equivalent to calling
+''elm_object_part_content_set(mapbuf, "default", content)''.
+</note>
+
+To activate smooth map rendering and alpha rendering for the mapbuf widget:
+
+<code c>
+elm_mapbuf_smooth_set(mapbuf, EINA_TRUE);
+elm_mapbuf_alpha_set(mapbuf, EINA_TRUE);
+</code>
+
+==== Activating the Mapbuf ====
+
+Finally, to use the mapbuf widget, you must activate it:
+
+<code c>
+elm_mapbuf_enabled_set (mapbuf, EINA_TRUE);
+</code>
+
+This enables the map that is set or disables it. On enable, the object
+geometry will be saved, and the new geometry will change (position and size)
+to reflect the map geometry set.
+
+Also, when enabled, alpha and smooth states will be used, so if the content
+isn't solid, alpha should be enabled, for example, otherwise a black rectangle
+will fill the content.
+
+When disabled, the stored map will be freed and geometry prior to enabling the
+map will be restored.
+
+It's disabled by default.
+
+==== Signals ====
+
+The mapbuf widget does not emit any signals and therefore does not provide any
+callbacks that you can register.
+
+\\
+//**__[[https://build.enlightenment.org/job/nightly_elm_gcc_x86_64/lastSuccessfulBuild/artifact/doc/html/mapbuf_example.html|A Mapbuf Example ]]__**//
+\\
+----
+{{page>index}}

pages/program_guide/containers/naviframe.txt

@@ -0,0 +1,109 @@
+~~Title: Naviframe Container PG~~
+{{page>index}}
+----
+===== Naviframe Container =====
+
+{{ :container_naviframe_tree.png }}
+
+A naviframe widget consists of a stack of views. New views are pushed on top
+of previous ones, and only the top-most view on the stack is displayed. The
+previous views are not deleted. A previous view is displayed when the view on
+top of it is popped. Transitions can be animated on a push or a pop, depending
+on the theme applied to the widget.
+
+=== Table of Contents ===
+
+  * [[/program_guide/containers/naviframe#Creating_a_Naviframe|Creating a Naviframe]]
+  * [[/program_guide/containers/naviframe#Adding_and_Deleting Views|Adding and Deleting Views]]
+  * [[/program_guide/containers/naviframe#Adding_Fixed_Content|Adding Fixed Content]]
+  * [[/program_guide/containers/naviframe#Signals|]]
+
+=== Related Info ===
+
+  * [[https://build.enlightenment.org/job/nightly_elm_gcc_x86_64/lastSuccessfulBuild/artifact/doc/html/group__Naviframe.html|Naviframe Container API]]
+  * [[https://build.enlightenment.org/job/nightly_elm_gcc_x86_64/lastSuccessfulBuild/artifact/doc/html/naviframe_example_8c-example.html|A Naviframe  Example ]]
+
+==== Creating a Naviframe ====
+
+To create a naviframe, use the ''elm_naviframe_add()'' function:
+
+<code c>
+Evas_Object *nav = elm_naviframe_add(parent);;
+</code>
+
+==== Addind and Deleting Views ====
+
+The naviframe is a stack of views. A new view is always pushed to the top of
+the stack. The top-most view is deleted by popping it.
+
+To add a new view to the naviframe stack (and show it):
+
+<code c>
+Elm_Object_Item *nav_it = elm_naviframe_item_push(nav, title_label, prev_button, next_button, view, item_style);
+</code>
+
+^Parameters^^
+|''title_label''|The label in the title area. The name of the title label part is "elm.text.title"|
+|''prev_button''|The button to go to the previous item. If it is NULL, then naviframe will create a back button automatically. The name of the prev_btn part is "elm.swallow.prev_btn" |
+|''next_button''|The button to go to the next item. Or It could be just an extra function button. The name of the next_btn part is "elm.swallow.next_btn" |
+|''view''|The main content object. The name of content part is "elm.swallow.content" |
+|''item_style''|The current item style name. NULL would be default. |
+
+In fact, you can simply use ''elm_naviframe_item_push()'' with default
+parameters:
+
+<code c>
+Elm_Object_Item *nav_it = elm_naviframe_item_push(nav, NULL, NULL, NULL, view, NULL);
+</code>
+
+When you push a new view to the stack, you receive an ''Elm_Object_Item'' for the
+view. You can use this item to modify the view.
+
+The item pushed becomes one page of the naviframe, this item will be deleted
+when it is popped with ''elm_naviframe_item_pop()'':
+
+<code c>
+elm_naviframe_item_pop(nav);
+</code>
+
+==== Adding Fixed Content ====
+
+The naviframe can also display fixed content on top of the current (top-most)
+view. Use the ''elm_object_item_part_content_set()'' function to set this content.
+Use the following part names to specify the location of the content:
+
+  * ''"default"'' - The main content of the current page
+  * ''"icon"'' - An icon in the title area of the current page
+  * ''"prev_btn"'' - A button of the current page to go to the previous page
+  * ''"next_btn"'' - A button of the current page to go to the next page
+
+For example, to add a button to the naviframe:
+
+<code c>
+btn = elm_button_add(nav);
+elm_object_item_part_content_set(nav_it, "prev_btn", btn);
+</code>
+
+To set the title labels of the naviframe, use the
+''elm_object_item_part_text_set()'' function and specify one of the following
+label locations:
+
+  * ''"default"'': Sets the title label in the title area of the current view.
+  * ''"subtitle"'': Sets the subtitle label in the title area of the current view.
+
+==== Signals ====
+
+The naviframe emits the following signals:
+
+  * ''"transition,finished"'' - When the transition is finished in changing the item
+  * ''"title,transition,finished"'' - When the title area's transition is finished in changing the state of the title
+  * ''"title,clicked"'' - User clicked title area
+  * ''"focused"'' - When the naviframe has received focus. (since 1.8)
+  * ''"unfocused"'' - When the naviframe has lost focus. (since 1.8)
+  * ''"language,changed"'' - the program's language changed (since 1.9)
+
+\\
+//**__[[https://build.enlightenment.org/job/nightly_elm_gcc_x86_64/lastSuccessfulBuild/artifact/doc/html/naviframe_example_8c-example.html|A Naviframe  Example ]]__**//
+\\
+----
+{{page>index}}

pages/program_guide/containers/panes.txt

@@ -0,0 +1,70 @@
+~~Title: Panes Container PG~~
+{{page>index}}
+----
+===== Panes Container =====
+{{ :container_panes_tree.png }}{{ :container_panes.png }}
+
+A panes widget adds a draggable bar between two sections of content. The
+sections are resized when the bar is dragged.
+
+=== Table of Contents ===
+
+  * [[/program_guide/containers/panes#Creating_Panes|Creating Panes]]
+  * [[/program_guide/containers/panes#Adding Content to the Panes|Adding Content to the Panes]]
+  * [[/program_guide/containers/panes#Setting_Panes_Options|Setting Panes Options]]
+  * [[/program_guide/containers/panes#Signals|Signals]]
+
+=== Related Info ===
+
+  * [[https://build.enlightenment.org/job/nightly_elm_gcc_x86_64/lastSuccessfulBuild/artifact/doc/html/group__Panes.html|Panes Container API]]
+  * [[/tutorial/panes_tutorial|Panes Tutorial]]
+  * [[https://build.enlightenment.org/job/nightly_elm_gcc_x86_64/lastSuccessfulBuild/artifact/doc/html/panes_example.html|A Panes Example ]]
+
+==== Creating a Panes ====
+
+To create a panes widget, use the ''elm_panes_add()'' function:
+
+<code c>
+Evas_Object *panes = elm_panes_add(parent);
+</code>
+
+==== Adding Content to the Panes ====
+
+To add content to the panes, use the ''elm_object_part_content_set()'' function.
+The following code adds an object to the left pane:
+
+<code c>
+elm_object_part_content_set(panes, "left", obj);
+</code>
+
+Here, the Default content parts of the panes widget that you can use are:
+
+  * ''"left"'' - A leftside content of the panes
+  * ''"right"'' - A rightside content of the panes
+  * ''"top"'' - A top content of the vertical panes
+  * ''"bottom"'' - A bottom content of the vertical panes
+
+If panes are displayed vertically, left content will be displayed on top.
+
+==== Setting Panes Options ====
+
+To set the orientation of the panes, use the ''elm_panes_horizontal_set()''
+function.
+
+To set the size of the panes, use the ''elm_panes_content_left_size_set()'' and
+''elm_panes_content_right_size_set()'' functions.
+
+==== Signals ====
+
+The panes widget emits the following signals:
+
+  * ''"press"'': The panes widget has been pressed (but the press has not been released yet).
+  * ''"unpress"'': The press has been released.
+  * ''"clicked"'': The panes widget has been clicked.
+  * ''"clicked,double"'': The panes widget has been double-clicked.
+
+\\
+//**__[[https://build.enlightenment.org/job/nightly_elm_gcc_x86_64/lastSuccessfulBuild/artifact/doc/html/panes_example.html|A Panes Example ]]__**//
+\\
+----
+{{page>index}}

pages/program_guide/containers/scroller.txt

@@ -0,0 +1,200 @@
+~~Title: Scroller Container PG~~
+{{page>index}}
+----
+===== Scroller Container =====
+
+{{ :container_scroller_tree.png }}{{ :container_scroller.png }}
+
+A scroller holds (and clips) a single object and allows you to scroll across
+it. This means that the user can use a scroll bar or their finger to drag the
+viewable region across the object, moving through a much larger area than is
+contained in the viewport. The scroller will always have a default minimum
+size that is not limited by its contents.
+
+The scroller widget inherits all the functions of the
+[[/program_guide/container/layout|Layout Container]].
+
+=== Table of Contents ===
+
+  * [[/program_guide/containers/scroller#Creating_a_Scroller|Creating a Scroller]]
+  * [[/program_guide/containers/scroller#Adding_Objects_to_the_Scroller|Adding Objects to the Scroller]]
+  * [[/program_guide/containers/scroller#Managing_the_Properties_of_the_Scroller|Managing the Properties of the Scroller]]
+  * [[/program_guide/containers/scroller#Signals|Signals]]
+  * [[/program_guide/containers/scroller#Example|Example]]
+
+=== Related Info ===
+
+  * [[https://build.enlightenment.org/job/nightly_elm_gcc_x86_64/lastSuccessfulBuild/artifact/doc/html/group__Scroller.html|Scroller Container API]]
+  * [[https://build.enlightenment.org/job/nightly_elm_gcc_x86_64/lastSuccessfulBuild/artifact/doc/html/tutorial_scroller.html|A Scroller Example]]
+
+===== Creating a Scroller =====
+
+To create a scroller, use the ''elm_scroller_add()'' function:
+
+<code c>
+Evas_Object *scroller = elm_scroller_add(parent);
+</code>
+
+==== Adding Objects to the Scoller ====
+
+To add an object to the scroller, use the ''elm_object_content_set()'' function:
+
+<code c>
+Evas_Object *image;
+
+image = elm_image_add(parent);
+elm_image_file_set(image, "image.png", NULL);
+evas_object_show(image);
+evas_object_size_hint_min_set(image, 2560, 1600);
+elm_object_content_set(scroller, image);
+</code>
+
+In the above code, we set a minimum size of 2560 x 1600 pixels for the image.
+The scroller is smaller than the image, so you can scroll across the image.
+
+If you want to be informed when the user begins scrolling the image, use the
+following code:
+
+<code c>
+evas_object_smart_callback_add(scroller, "scroll,drag,start",
+_scroll_start_cb, NULL);
+
+// Callback function for the "animate,begin" signal.
+// This callback is called when the user begins scrolling the image.
+void _scroll_start_cb(void *data, Evas_Object *obj, void *event_info)
+{
+   printf("Scroll starts\n");
+}
+</code>
+
+==== Managing the Properties of the Scroll ====
+
+When scrolling content, the scroller may "bounce" when reaching the edge of
+the content. This is a visual way of indicating that there is no more content
+to scroll in that direction. Bounce is enabled by default for both axes. To
+enable or disable the bounce for either or both axes, use the
+elm_scroller_bounce_set() function. The following code disables the bounce for
+the horizontal axis and enables it for the vertical axis:
+
+<code c>
+elm_scroller_bounce_set(scroller, EINA_FALSE, EINA_TRUE);
+</code>
+
+The scroller can limit the scrolling to "pages". In this case, the scrolling
+occurs in page-sized chunks of content rather than in a purely continuous
+fashion, with the scroller displaying a single "page" at a time. This feature
+sets the size of the page relative to the viewport of the scroller. A size of
+1.0 equals 1 viewport (horizontally or vertically). A size of 0.0 disables
+paging for that axis. These settings are mutually exclusive with page size
+(see the ''elm_scroller_page_size_set()'' function). A size of 0.5 equals half a
+viewport. Usable size values are normally between 0.0 and 1.0, including 1.0.
+If you only want a single axis to scroll in pages, use 0.0 for the other axis.
+
+==== Signals ====
+
+The scroller emits the following signals, which you can catch in your
+application:
+
+  * ''"edge,left"'' - the left edge of the content has been reached
+  * ''"edge,right"'' - the right edge of the content has been reached
+  * ''"edge,top"'' - the top edge of the content has been reached
+  * ''"edge,bottom"'' - the bottom edge of the content has been reached
+  * ''"scroll"'' - the content has been scrolled (moved)
+  * ''"scroll,left"'' - the content has been scrolled (moved) leftwards
+  * ''"scroll,right"'' - the content has been scrolled (moved) rightwards
+  * ''"scroll,up"'' - the content has been scrolled (moved) upwards
+  * ''"scroll,down"'' - the content has been scrolled (moved) downwards
+  * ''"scroll,anim,start"'' - scrolling animation has started
+  * ''"scroll,anim,stop"'' - scrolling animation has stopped
+  * ''"scroll,drag,start"'' - dragging the contents around has started
+  * ''"scroll,drag,stop"'' - dragging the contents around has stopped
+  * ''"vbar,drag"'' - the vertical scroll bar has been dragged
+  * ''"vbar,press"'' - the vertical scroll bar has been pressed
+  * ''"vbar,unpress"'' - the vertical scroll bar has been unpressed
+  * ''"hbar,drag"'' - the horizontal scroll bar has been dragged
+  * ''"hbar,press"'' - the horizontal scroll bar has been pressed
+  * ''"hbar,unpress"'' - the horizontal scroll bar has been unpressed
+  * ''"scroll,page,changed"'' - the visible page has changed
+  * ''"focused"'' - When the scroller has received focus. (since 1.8)
+  * ''"unfocused"'' - When the scroller has lost focus. (since 1.8)
+
+
+==== Example ====
+
+A good example of the scroller is a picture slideshow: we add images to the
+scroller and limit the scrolling to pages (one picture at a time). In the
+following code, we disable the scroll bars for both axes, limit the scrolling
+to pages by using the ''elm_scroller_page_scroll_limit_set()'' function, and lock
+the scrolling on the Y axis by using the ''elm_object_scroll_lock_y_set()''
+function:
+
+<code c>
+elm_scroller_policy_set(scroller, ELM_SCROLLER_POLICY_OFF, ELM_SCROLLER_POLICY_OFF);
+elm_scroller_page_scroll_limit_set(scroller, 1, 0);
+elm_object_scroll_lock_y_set(scroller, EINA_TRUE);
+</code>
+
+We create a horizontal box, which will contain all the images, and which
+itself will be contained by the scroller:
+
+<code c>
+box = elm_box_add(scroller);
+elm_box_horizontal_set(box, EINA_TRUE);
+elm_object_content_set(scroller, box);
+evas_object_show(box);
+</code>
+
+We then create all the images and add them to the horizontal box:
+
+<code c>
+img = elm_image_add(scroller);
+snprintf(buf, sizeof(buf), IMAGE_DIR"/%d.jpg", i);
+elm_image_file_set(img, buf, NULL);
+evas_object_show(img);
+pages = eina_list_append(pages, img);
+elm_box_pack_end(box, img);
+</code>
+
+We store references to the images in an ''eina_list'' for easy retrieval later.
+
+Finally, we display the first page of the scroller:
+
+<code c>
+elm_scroller_page_show(scroller, 0, 0);
+</code>
+
+The size of the scroller depends on the size of the parent. When the parent
+changes, for example when the window is resized or rotated, the scroller is
+also resized. Since we need to be informed when the scroller is resized, we
+add a callback on the ''EVAS_CALLBACK_RESIZE'' event for the scroller:
+
+<code c>
+evas_object_event_callback_add(scroller, EVAS_CALLBACK_RESIZE, _scroller_resize_cb, NULL);
+</code>
+
+The callback retrieves the new size of the scroller by using the
+''evas_object_geometry_get()'' function on the object pointer. The pointer is
+relative to the object that has been resized, which in our case is the
+scroller itself. We can then iterate through the images of the scroller and
+set the minimum size to fit the scroller size:
+
+<code c>
+EINA_LIST_FOREACH(images, l, page)
+{
+   evas_object_size_hint_min_set(page, w, h);
+}
+</code>
+
+Finally, we set the page size of the scroller to match the scroller size and
+display the first page:
+
+<code c>
+elm_scroller_page_size_set(obj, w, h);
+elm_scroller_page_show(obj, 0, 0);
+</code>
+
+\\
+[[https://build.enlightenment.org/job/nightly_elm_gcc_x86_64/lastSuccessfulBuild/artifact/doc/html/tutorial_scroller.html|A Scroller Example]]
+\\
+----
+{{page>index}}

pages/program_guide/containers/table.txt

@@ -0,0 +1,91 @@
+~~Title: Table Container PG~~
+{{page>index}}
+----
+===== Table Container =====
+
+{{ :container_table_tree.png }}{{ :container_table.png }}
+
+A table is like a box but with 2 dimensions. You have the same kind of APIs as
+with boxes. An item inside the table can span multiple columns and rows, and
+even overlap with other items (and it can then be raised or lowered
+accordingly to adjust stacking if there is overlap).
+
+=== Table of Contents ===
+
+  * [[/program_guide/containers/table#Creating_a_Table|Creating a Table]]
+  * [[/program_guide/containers/table#Adding_Items_to_the_Table|Adding Items to the Table]]
+  * [[/program_guide/containers/table#Managing_the_Items|Managing the Items]]
+  * [[/program_guide/containers/table#Clearing_the_Table|Clearing the Table]]
+
+=== Related Info ===
+
+  * [[https://build.enlightenment.org/job/nightly_elm_gcc_x86_64/lastSuccessfulBuild/artifact/doc/html/group__Table.html|Table Container API]]
+
+^Table Examples^^
+|//**__[[https://build.enlightenment.org/job/nightly_elm_gcc_x86_64/lastSuccessfulBuild/artifact/doc/html/tutorial_table_01.html|A First Table Example ]]__**//| //**__[[https://build.enlightenment.org/job/nightly_elm_gcc_x86_64/lastSuccessfulBuild/artifact/doc/html/tutorial_table_02.html|A Second Table Example ]]__**//|
+
+===== Creating a Table =====
+
+To create a table, use the ''elm_table_add()'' function:
+
+<code c>
+Evas_Object *table = elm_table_add(parent);
+</code>
+
+==== Adding Items to the Table ====
+
+Items are added to the table with the ''elm_table_pack()'' function. This function
+takes as parameters the table, the item to add to the table, and the position
+where to add the item: column, row, and the size of the item in number of rows
+and columns (colspan and rowspan). If we want to create an icon that takes 3
+columns and rows and a button that only takes 1 row and column, the code will
+look like this:
+
+<code c>
+ic = elm_icon_add(table);
+elm_image_file_set(ic, "icon.png", NULL);
+evas_object_show(ic);
+elm_table_pack(table, ic, 0, 0, 3, 3);
+
+btn = elm_button_add(table);
+elm_object_text_set(btn, "Click me i'm famous");
+evas_object_show(btn);
+elm_table_pack(table, btn, 3, 1, 1, 1);
+evas_object_show(table);
+</code>
+
+==== Managing the Items ====
+
+If you want to change the position of the item after adding it, use the
+''elm_table_pack_set()'' function. This function takes as parameters the item
+whose position to change, the new column, the new row, and the size of the
+item in number of rows and columns (colspan and rowspan).
+
+To add padding around the item, use the ''elm_table_padding_set()'' function. The
+second parameter is the padding between columns, and the third parameter is
+the padding between rows:
+
+<code c>
+elm_table_padding_set(table, 10, 10);
+</code>
+
+To change the alignment and size of an item, use the ''evas_object_size_hint''
+parameters. They are used in the same way as with boxes. You can set the same
+size and weight to each item by using the homogeneous parameter:
+
+<code c>
+elm_table_homogeneous_set(table, EINA_TRUE);
+</code>
+
+==== Clearing the Table ====
+
+To clear the table, use the ''elm_table_clear()'' function. If the clear
+parameter is ''EINA_TRUE'', the table items are deleted. The
+''evas_object_del()'' function will be called on each item.
+
+
+\\
+|//**__[[https://build.enlightenment.org/job/nightly_elm_gcc_x86_64/lastSuccessfulBuild/artifact/doc/html/tutorial_table_01.html|A First Table Example ]]__**//| //**__[[https://build.enlightenment.org/job/nightly_elm_gcc_x86_64/lastSuccessfulBuild/artifact/doc/html/tutorial_table_02.html|A Second Table Example ]]__**//|
+
+----
+{{page>index}}

pages/program_guide/containers_pg.txt

@@ -0,0 +1,219 @@
+~~Title: Container Programming Guide~~
+{{page>index}}
+===== Container Programming Guide =====
+
+Elementary is about displaying its widgets in a nice layout, for this purpose
+it provides a number of containers.
+
+=== Table of Contents ===
+
+  * [[/program_guide/containers/box|Box]]
+  * [[/program_guide/containers/conformant|Conformant]]
+  * [[/program_guide/containers/gengrid|Gengrid(Generic Grid)]]
+  * [[/program_guide/containers/genlist|Genlist(Generic List)]]
+  * [[/program_guide/containers/grid|Grid]]
+  * [[/program_guide/containers/layout|Layout]]
+  * [[/program_guide/containers/mapbuf|Mapbuf]]
+  * [[/program_guide/containers/naviframe|Naviframe]]
+  * [[/program_guide/containers/panes|Panes]]
+  * [[/program_guide/containers/scroller|Scroller]]
+  * [[/program_guide/containers/table|Table]]
+
+=== Related Info ===
+
+  *   [[https://build.enlightenment.org/job/nightly_elm_gcc_x86_64/lastSuccessfulBuild/artifact/doc/html/containerslist.html|Container List API]]
+
+----
+++++Box Container|
+{{ :container_box_tree.png }}{{ :container_box.png }}
+
+Most of the time, you want to display widgets on the screen in a specific
+order. In Form Tutorial, for example, the user information is arranged
+vertically. This basic container is called a box. There is no theme for a box
+layout. It is just a linear method of arranging widgets horizontally or
+vertically.
+
+  * [[/program_guide/containers/box#Creating_a_Box|Creating a Box]]
+  * [[/program_guide/containers/box#Adding_Objects_to_the_Box|Adding Objects to the Box]]
+  * [[/program_guide/containers/box#Setting_the_Padding|Setting the Padding]]
+  * [[/program_guide/containers/box#Handling_Element_Size|Handling Element Size]]
+  * [[/program_guide/containers/box#Setting_the_Alignment|Setting the Alignment]]
+  * [[/program_guide/containers/box#Using_Size_Hints|Using Size Hints]]
+
+[[https://build.enlightenment.org/job/nightly_elm_gcc_x86_64/lastSuccessfulBuild/artifact/doc/html/group__Box.html|Box Container API]]
+++++
+----
+++++Conformant Container|
+{{ :container_conformant_tree.png }}{{ :container_conformant.png }}
+
+A conformant is a container widget that accounts for the space taken by the
+indicator, virtual keyboard, and softkey windows. The content area of the
+conformant is resized and positioned based on the space available. When the
+virtual keyboard is displayed, the content area is not resized.
+
+  * [[/program_guide/containers/conformant#Creating_a_Conformant|Creating a Conformant]]
+  * [[/program_guide/containers/conformant#Adding_Content_to_the_Conformant|Adding Content to the Conformant]]
+  * [[/program_guide/containers/conformant#Signals|Signals]]
+
+[[https://build.enlightenment.org/job/nightly_elm_gcc_x86_64/lastSuccessfulBuild/artifact/doc/html/group__Conformant.html|Conformant Container API]]
+++++
+----
+++++Gengrid Container|
+{{ :container_gengrid_tree.png }}{{ :container_gengrid.png }}
+
+Gengrid widget is based on the same idea as the genlist. It aims at displaying
+objects on a grid layout and rendering only the visible ones. As for the
+genlist, callbacks are called at item creation or deletion.
+
+This widget inherits from the layout widget and implements the scroller
+interface. Thus scroller and layout functions can be used with this widget.
+
+A gengrid may display its items using horizontal or vertical layout. In the
+first layout, items are displayed in columns from top to bottom, starting a
+new column when the space for the current column is filled. In the second one,
+items are set in rows from left to right.
+
+  * [[/program_guide/containers/gengrid#Adding_a_Gengrid|Adding a Gengrid]]
+  * [[/program_guide/containers/gengrid#Gengrid_Items|Gengrid Items]]
+  * [[/program_guide/containers/gengrid#Creating_and_Deleting_Items|Creating and Deleting Items]]
+  * [[/program_guide/containers/gengrid#Managing_Items|Managing Items]]
+  * [[/program_guide/containers/gengrid#Using_Gengrid_Callbacks|Using Gengrid Callbacks]]
+
+[[https://build.enlightenment.org/job/nightly_elm_gcc_x86_64/lastSuccessfulBuild/artifact/doc/html/group__Gengrid.html|Gengrid Container API]]
+++++
+----
+++++Genlist Container|
+{{ :container_genlist_tree.png }}{{ :container_genlist.png }}
+
+Genlist is a widget that displays a scrollable list of items. It allows a lot of entries while being fast and has a low memory footprint (only the visible items are allocated in the memory).
+
+  * [[/program_guide/containers/genlist#Genlist_Item_Style|Genlist Item Style]]
+  * [[/program_guide/containers/genlist#Adding_a_Genlist|Adding a Genlist]]
+  * [[/program_guide/containers/genlist#Creating_And_Deleting_Items|Creating And Deleting Items]]
+  * [[/program_guide/containers/genlist#Managing_Items|Managing Items]]
+  * [[/program_guide/containers/genlist#Selection|Selection]]
+  * [[/program_guide/containers/genlist#Using_Genlist_Callbacks|Using Genlist Callbacks]]
+
+[[https://build.enlightenment.org/job/nightly_elm_gcc_x86_64/lastSuccessfulBuild/artifact/doc/html/group__Genlist.html|Genlist Container API]]
+++++
+----
+++++Grid Container|
+In a grid, objects are placed at specific positions along a fixed grid, where
+the position of each object is given as a percentage of the full width and
+height of the grid. By default, the size of the grid is 100 x 100 pixels.
+
+  * [[/program_guide/containers/grid#Creating_a_Grid|Creating a Grid]]
+  * [[/program_guide/containers/grid#Adding_Items_to_the_Grid|Adding Items to the Grid]]
+  * [[/program_guide/containers/grid#Changing_Position_and_Size|Changing Position and Size]]
+  * [[/program_guide/containers/grid#Clearing_the_Grid|Clearing the Grid]]
+
+[[https://build.enlightenment.org/job/nightly_elm_gcc_x86_64/lastSuccessfulBuild/artifact/doc/html/group__Grid.html|Grid Container API]]
+++++
+----
+++++Layout Container|
+A layout is a container widget that takes a standard Edje design file and
+wraps it very thinly in a widget. Layouts are the basis of a lot of graphics
+widgets used in Elementary.
+
+An Edje design file describes how the elements of the UI are positioned and
+how they behave when interacted with. For more information about Edje, see the
+Edje guide.
+
+  * [[/program_guide/containers/layout#Creating_a_Layout|Creating a Layout]]
+  * [[/program_guide/containers/layout#Adding_Objects_to_the_Layout|Adding Objects to the Layout]]
+  * [[/program_guide/containers/layout#Using_Layout_Themes|Using Layout Themes]]
+
+[[https://build.enlightenment.org/job/nightly_elm_gcc_x86_64/lastSuccessfulBuild/artifact/doc/html/group__Layout.html|Layout Container API]]
+++++
+----
+++++Mapbuf Container|
+{{ :container_mapbuf_tree.png }}
+
+A mapbuf widget is a container widget that uses an Evas map to hold a content
+object. This widget is used to improve the moving and resizing performance of
+complex widgets.
+
+The content object is treated as a single image by the Evas map. If you have a
+content object containing several child objects, frequently moving the mapbuf
+widget will be faster than frequently moving the content object.
+
+The mapbuf widget inherits all the functions of the container class.
+
+  * [[/program_guide/containers/mapbuf#Creating_a_Mapbuf|Creating a Mapbuf]]
+  * [[/program_guide/containers/mapbuf#Adding_Content_to_the_Mapbuf|Adding Content to the Mapbuf]]
+  * [[/program_guide/containers/mapbuf#Activating_the_Mapbuf|Activating the Mapbuf]]
+  * [[/program_guide/containers/mapbuf#Signals|Signals]]
+
+[[https://build.enlightenment.org/job/nightly_elm_gcc_x86_64/lastSuccessfulBuild/artifact/doc/html/group__Mapbuf.html|Mapbuf Container API]]
+++++
+----
+++++Naviframe Container|
+{{ :container_naviframe_tree.png }}
+
+A naviframe widget consists of a stack of views. New views are pushed on top
+of previous ones, and only the top-most view on the stack is displayed. The
+previous views are not deleted. A previous view is displayed when the view on
+top of it is popped. Transitions can be animated on a push or a pop, depending
+on the theme applied to the widget.
+
+  * [[/program_guide/containers/naviframe#Creating_a_Naviframe|Creating a Naviframe]]
+  * [[/program_guide/containers/naviframe#Adding_and_Deleting Views|Adding and Deleting Views]]
+  * [[/program_guide/containers/naviframe#Adding_Fixed_Content|Adding Fixed Content]]
+  * [[/program_guide/containers/naviframe#Signals|]]
+
+[[https://build.enlightenment.org/job/nightly_elm_gcc_x86_64/lastSuccessfulBuild/artifact/doc/html/group__Naviframe.html|Naviframe Container API]]
+++++
+----
+++++Panes Container|
+{{ :container_panes_tree.png }}{{ :container_panes.png }}
+
+A panes widget adds a draggable bar between two sections of content. The
+sections are resized when the bar is dragged.
+
+  * [[/program_guide/containers/panes#Creating_Panes|Creating Panes]]
+  * [[/program_guide/containers/panes#Adding Content to the Panes|Adding Content to the Panes]]
+  * [[/program_guide/containers/panes#Setting_Panes_Options|Setting Panes Options]]
+  * [[/program_guide/containers/panes#Signals|Signals]]
+
+[[https://build.enlightenment.org/job/nightly_elm_gcc_x86_64/lastSuccessfulBuild/artifact/doc/html/group__Panes.html|Panes Container API]]
+++++
+----
+++++Scroller Container|
+{{ :container_scroller_tree.png }}{{ :container_scroller.png }}
+
+A scroller holds (and clips) a single object and allows you to scroll across
+it. This means that the user can use a scroll bar or their finger to drag the
+viewable region across the object, moving through a much larger area than is
+contained in the viewport. The scroller will always have a default minimum
+size that is not limited by its contents.
+
+The scroller widget inherits all the functions of the Layout Container.
+
+  * [[/program_guide/containers/scroller#Creating_a_Scroller|Creating a Scroller]]
+  * [[/program_guide/containers/scroller#Adding_Objects_to_the_Scroller|Adding Objects to the Scroller]]
+  * [[/program_guide/containers/scroller#Managing_the_Properties_of_the_Scroller|Managing the Properties of the Scroller]]
+  * [[/program_guide/containers/scroller#Signals|Signals]]
+  * [[/program_guide/containers/scroller#Example|Example]]
+
+[[https://build.enlightenment.org/job/nightly_elm_gcc_x86_64/lastSuccessfulBuild/artifact/doc/html/group__Scroller.html|Scroller Container API]]
+++++
+----
+++++Table Container|
+{{ :container_table_tree.png }}{{ :container_table.png }}
+
+A table is like a box but with 2 dimensions. You have the same kind of APIs as
+with boxes. An item inside the table can span multiple columns and rows, and
+even overlap with other items (and it can then be raised or lowered
+accordingly to adjust stacking if there is overlap).
+
+  * [[/program_guide/containers/table#Creating_a_Table|Creating a Table]]
+  * [[/program_guide/containers/table#Adding_Items_to_the_Table|Adding Items to the Table]]
+  * [[/program_guide/containers/table#Managing_the_Items|Managing the Items]]
+  * [[/program_guide/containers/table#Clearing_the_Table|Clearing the Table]]
+
+[[https://build.enlightenment.org/job/nightly_elm_gcc_x86_64/lastSuccessfulBuild/artifact/doc/html/group__Table.html|Table Container API]]
+++++
+
+\\
+----
+{{page>index}}

pages/program_guide/index.txt

@@ -1,3 +1,4 @@
 ++++Programming Guide Menu|
   * [[program_guide/basic_application_structure_pg|Basic Application structure PG]]
+  * [[program_guide/containers_pg|Container PG]]
 ++++

pages/tutorial/menu/basic_ui.txt

@@ -7,7 +7,7 @@ The view container ''view/main'' is structured like this:
 {{ :view_main.png?direct |View main}}
 
 The naviframe contains and manages the boxes. For more information, see the
-[[/coming_soon|Container programming guide]]. This widget handle views. In
+[[/program_guide/containers_pg|Container programming guide]]. This widget handle views. In
 this example each view is contained in a box and the box is contained in the
 naviframe.