Extending Layout tester demo 74/181374/1
authoragnelo vaz <agnelo.vaz@samsung.com>
Tue, 1 May 2018 17:01:29 +0000 (18:01 +0100)
committerAdeel Kazmi <adeel.kazmi@samsung.com>
Tue, 12 Jun 2018 14:55:10 +0000 (15:55 +0100)
Pressing "Change layout" will show another test example.

Pressing Change button toggles padding on/off for second ImageView
First Image View has a margin applied.

Issues
TogglePadding button is not unparented from stage

Change-Id: I728071af85540df0a8fd27b7e78349e4f2370d2b

examples/layouting/layouting-example.cpp [deleted file]
examples/layouting/layouting-examples.cpp [new file with mode: 0644]
examples/layouting/linear-example.cpp [new file with mode: 0644]
examples/layouting/linear-example.h [new file with mode: 0644]
examples/layouting/padding-example.cpp [new file with mode: 0644]
examples/layouting/padding-example.h [new file with mode: 0644]

diff --git a/examples/layouting/layouting-example.cpp b/examples/layouting/layouting-example.cpp
deleted file mode 100644 (file)
index bba1a03..0000000
+++ /dev/null
@@ -1,222 +0,0 @@
-/*
- * Copyright (c) 2018 Samsung Electronics Co., Ltd.
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- * http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- */
-
-#include <string>
-#include "shared/view.h"
-#include <dali/dali.h>
-#include <dali-toolkit/dali-toolkit.h>
-#include <dali-toolkit/devel-api/visuals/image-visual-properties-devel.h>
-#include <dali-toolkit/devel-api/visual-factory/visual-factory.h>
-#include <dali-toolkit/devel-api/controls/control-devel.h>
-#include <dali-toolkit/devel-api/layouting/hbox-layout.h>
-#include <dali-toolkit/devel-api/layouting/vbox-layout.h>
-
-using namespace Dali;
-using namespace Dali::Toolkit;
-
-namespace
-{
-
-const char* BACKGROUND_IMAGE( DEMO_IMAGE_DIR "lake_front.jpg" );
-const char* TOOLBAR_IMAGE( DEMO_IMAGE_DIR "top-bar.png" );
-
-const char* LTR_IMAGE( DEMO_IMAGE_DIR "icon-play.png" );
-const char* LTR_SELECTED_IMAGE( DEMO_IMAGE_DIR "icon-play-selected.png" );
-
-const char* RTL_IMAGE( DEMO_IMAGE_DIR "icon-reverse.png" );
-const char* RTL_SELECTED_IMAGE( DEMO_IMAGE_DIR "icon-reverse-selected.png" );
-
-const char* ROTATE_CLOCKWISE_IMAGE( DEMO_IMAGE_DIR "icon-reset.png" );
-const char* ROTATE_CLOCKWISE_SELECTED_IMAGE( DEMO_IMAGE_DIR "icon-reset-selected.png" );
-
-//const char* ROTATE_ANTICLOCKWISE_IMAGE( DEMO_IMAGE_DIR "icon-rotate-anticlockwise.png" );
-//const char* ROTATE_ANTICLOCKWISE_SELECTED_IMAGE( DEMO_IMAGE_DIR "icon-rotate-anticlockwise-selected.png" );
-
-
-const char* APPLICATION_TITLE( "Layout tester" );
-
-const char* IMAGE_PATH[] = {
-  DEMO_IMAGE_DIR "application-icon-101.png",
-  DEMO_IMAGE_DIR "application-icon-102.png",
-  DEMO_IMAGE_DIR "application-icon-103.png",
-  DEMO_IMAGE_DIR "application-icon-104.png"
-};
-const unsigned int NUMBER_OF_RESOURCES = sizeof(IMAGE_PATH) / sizeof(char*);
-
-}  // namespace
-
-class LayoutingExample: public ConnectionTracker
-{
- public:
-
-  LayoutingExample( Application& application )
-  : mApplication( application ),
-    mDirection( false )
-  {
-    // Connect to the Application's Init signal
-    mApplication.InitSignal().Connect( this, &LayoutingExample::Create );
-  }
-
-  ~LayoutingExample()
-  {
-    // Nothing to do here
-  }
-
-  void Create( Application& application )
-  {
-    // The Init signal is received once (only) during the Application lifetime
-    auto stage = Stage::GetCurrent();
-
-    auto bg = ImageView::New( BACKGROUND_IMAGE );
-    bg.SetParentOrigin( ParentOrigin::CENTER );
-    stage.Add( bg );
-    auto toolbar = ImageView::New( TOOLBAR_IMAGE );
-    toolbar.SetParentOrigin( ParentOrigin::TOP_CENTER );
-    toolbar.SetAnchorPoint( AnchorPoint::TOP_CENTER );
-    toolbar.SetResizePolicy( ResizePolicy::FILL_TO_PARENT, Dimension::WIDTH );
-    toolbar.SetProperty( Actor::Property::SIZE_HEIGHT, 50.0f);
-
-    stage.Add( toolbar );
-
-    auto title = TextLabel::New( APPLICATION_TITLE );
-    title.SetParentOrigin( ParentOrigin::CENTER );
-    title.SetAnchorPoint( AnchorPoint::CENTER );
-    title.SetProperty( TextLabel::Property::TEXT_COLOR, Color::BLUE );
-    title.SetProperty( TextLabel::Property::HORIZONTAL_ALIGNMENT, HorizontalAlignment::CENTER );
-    toolbar.Add( title );
-
-    mDirectionButton = PushButton::New();
-    mDirectionButton.SetProperty( PushButton::Property::UNSELECTED_ICON, RTL_IMAGE );
-    mDirectionButton.SetProperty( PushButton::Property::SELECTED_ICON, RTL_SELECTED_IMAGE );
-    mDirectionButton.ClickedSignal().Connect( this, &LayoutingExample::OnDirectionClicked );
-    mDirectionButton.SetParentOrigin( Vector3(0.33f, 1.0f, 0.5f ) );
-    mDirectionButton.SetAnchorPoint( AnchorPoint::BOTTOM_CENTER );
-    mDirectionButton.SetSize(75, 75);
-    stage.Add( mDirectionButton );
-
-    mRotateButton = PushButton::New();
-    mRotateButton.SetProperty( PushButton::Property::UNSELECTED_ICON, ROTATE_CLOCKWISE_IMAGE );
-    mRotateButton.SetProperty( PushButton::Property::SELECTED_ICON, ROTATE_CLOCKWISE_SELECTED_IMAGE );
-    mRotateButton.ClickedSignal().Connect( this, &LayoutingExample::OnRotateClicked );
-    mRotateButton.SetParentOrigin( Vector3(0.66f, 1.0f, 0.5f ));
-    mRotateButton.SetAnchorPoint( Vector3(0.5f, 1.0f, 0.5f));
-    mRotateButton.SetSize(75, 75);
-    stage.Add( mRotateButton );
-
-    // Create a hbox layout
-    mLinearContainer = Control::New();
-    mIsHorizontal = false;
-
-    auto layout = VboxLayout::New();
-    layout.SetAnimateLayout(true);
-    DevelControl::SetLayout( mLinearContainer, layout );
-
-    mLinearContainer.SetParentOrigin( ParentOrigin::CENTER );
-    mLinearContainer.SetAnchorPoint( AnchorPoint::CENTER );
-    mLinearContainer.SetName( "linearContainer" );
-    stage.Add( mLinearContainer );
-    mLinearContainer.SetProperty( Toolkit::LayoutItem::ChildProperty::WIDTH_SPECIFICATION, ChildLayoutData::MATCH_PARENT );
-    mLinearContainer.SetProperty( Toolkit::LayoutItem::ChildProperty::HEIGHT_SPECIFICATION, ChildLayoutData::MATCH_PARENT );
-    mLinearContainer.SetProperty( Actor::Property::LAYOUT_DIRECTION, LayoutDirection::LEFT_TO_RIGHT );
-
-    for( unsigned int x = 0; x < NUMBER_OF_RESOURCES; ++x )
-    {
-      mImageViews[x] = Toolkit::ImageView::New();
-      Property::Map imagePropertyMap;
-      imagePropertyMap[ Toolkit::Visual::Property::TYPE ] = Toolkit::Visual::IMAGE;
-      imagePropertyMap[ Toolkit::ImageVisual::Property::URL ] = IMAGE_PATH[ x ];
-      imagePropertyMap[ ImageVisual::Property::DESIRED_WIDTH ] = 100.0f;
-      imagePropertyMap[ ImageVisual::Property::DESIRED_HEIGHT ] = 100.0f;
-
-      mImageViews[x].SetProperty(Toolkit::ImageView::Property::IMAGE , imagePropertyMap );
-      mImageViews[x].SetName("ImageView");
-      mImageViews[x].SetAnchorPoint( AnchorPoint::TOP_LEFT );
-      mImageViews[x].SetResizePolicy( ResizePolicy::FIXED, Dimension::ALL_DIMENSIONS );
-      mLinearContainer.Add( mImageViews[x] );
-    }
-
-    Stage::GetCurrent().KeyEventSignal().Connect(this, &LayoutingExample::OnKeyEvent);
-  }
-
-private:
-  /**
-   * Main key event handler
-   */
-  void OnKeyEvent(const KeyEvent& event)
-  {
-    if(event.state == KeyEvent::Down)
-    {
-      if( IsKey( event, DALI_KEY_ESCAPE) || IsKey( event, DALI_KEY_BACK ) )
-      {
-        mApplication.Quit();
-      }
-    }
-  }
-
-  bool OnDirectionClicked( Button button )
-  {
-    if( mDirection )
-    {
-      mDirectionButton.SetProperty( PushButton::Property::UNSELECTED_ICON, LTR_IMAGE );
-      mDirectionButton.SetProperty( PushButton::Property::SELECTED_ICON, LTR_SELECTED_IMAGE );
-      mLinearContainer.SetProperty( Actor::Property::LAYOUT_DIRECTION, LayoutDirection::LEFT_TO_RIGHT );
-    }
-    else
-    {
-      mDirectionButton.SetProperty( PushButton::Property::UNSELECTED_ICON, RTL_IMAGE );
-      mDirectionButton.SetProperty( PushButton::Property::SELECTED_ICON, RTL_SELECTED_IMAGE );
-      mLinearContainer.SetProperty( Actor::Property::LAYOUT_DIRECTION, LayoutDirection::RIGHT_TO_LEFT );
-    }
-    mDirection = !mDirection;
-    return true;
-  }
-
-  bool OnRotateClicked( Button button )
-  {
-    mIsHorizontal = !mIsHorizontal;
-    if( mIsHorizontal )
-    {
-      auto hboxLayout = HboxLayout::New();
-      hboxLayout.SetAnimateLayout(true);
-      DevelControl::SetLayout( mLinearContainer, hboxLayout );
-    }
-    else
-    {
-      auto vboxLayout = VboxLayout::New();
-      vboxLayout.SetAnimateLayout(true);
-      DevelControl::SetLayout( mLinearContainer, vboxLayout );
-    }
-    return true;
-  }
-
-private:
-  Application& mApplication;
-  Toolkit::ImageView mImageViews[ NUMBER_OF_RESOURCES ];
-  PushButton mDirectionButton;
-  PushButton mRotateButton;
-  Control mLinearContainer;
-  bool mDirection;
-  bool mIsHorizontal = true;
-};
-
-int DALI_EXPORT_API main( int argc, char **argv )
-{
-  Application application = Application::New( &argc, &argv, DEMO_THEME_PATH );
-  LayoutingExample test( application );
-  application.MainLoop();
-  return 0;
-}
diff --git a/examples/layouting/layouting-examples.cpp b/examples/layouting/layouting-examples.cpp
new file mode 100644 (file)
index 0000000..c41cba5
--- /dev/null
@@ -0,0 +1,151 @@
+/*
+ * Copyright (c) 2018 Samsung Electronics Co., Ltd.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *
+ */
+
+#include <string>
+#include "shared/view.h"
+#include "linear-example.h"
+#include "padding-example.h"
+#include <dali/dali.h>
+#include <dali-toolkit/dali-toolkit.h>
+#include <dali-toolkit/devel-api/controls/control-devel.h>
+
+using namespace Dali;
+using namespace Dali::Toolkit;
+
+namespace
+{
+
+const char* BACKGROUND_IMAGE( DEMO_IMAGE_DIR "lake_front.jpg" );
+const char* TOOLBAR_IMAGE( DEMO_IMAGE_DIR "top-bar.png" );
+
+const char* APPLICATION_TITLE( "Layout tester" );
+
+}  // namespace
+
+class LayoutingExample: public ConnectionTracker
+{
+ public:
+
+  LayoutingExample( Application& application )
+  : mApplication( application ),
+    mLinearExample(),
+    mPaddedExample(),
+    mLayoutIndex( 0 )
+  {
+    // Connect to the Application's Init signal
+    mApplication.InitSignal().Connect( this, &LayoutingExample::Create );
+  }
+
+  ~LayoutingExample()
+  {
+    // Nothing to do here
+  }
+
+  void Create( Application& application )
+  {
+    // The Init signal is received once (only) during the Application lifetime
+
+    auto stage = Stage::GetCurrent();
+
+    auto bg = ImageView::New( BACKGROUND_IMAGE );
+    bg.SetParentOrigin( ParentOrigin::CENTER );
+    stage.Add( bg );
+    auto toolbar = ImageView::New( TOOLBAR_IMAGE );
+    toolbar.SetParentOrigin( ParentOrigin::TOP_CENTER );
+    toolbar.SetAnchorPoint( AnchorPoint::TOP_CENTER );
+    toolbar.SetResizePolicy( ResizePolicy::FILL_TO_PARENT, Dimension::WIDTH );
+    toolbar.SetProperty( Actor::Property::SIZE_HEIGHT, 50.0f);
+
+    stage.Add( toolbar );
+
+    auto title = TextLabel::New( APPLICATION_TITLE );
+    title.SetParentOrigin( ParentOrigin::CENTER );
+    title.SetAnchorPoint( AnchorPoint::CENTER );
+    title.SetProperty( TextLabel::Property::TEXT_COLOR, Color::BLUE );
+    title.SetProperty( TextLabel::Property::HORIZONTAL_ALIGNMENT, HorizontalAlignment::LEFT );
+    toolbar.Add( title );
+
+    mNextLayout = PushButton::New();
+    mNextLayout.SetProperty( Toolkit::Button::Property::LABEL, "change layout");
+    mNextLayout.ClickedSignal().Connect( this, &LayoutingExample::ChangeLayout );
+    mNextLayout.SetParentOrigin( ParentOrigin::TOP_RIGHT );
+    mNextLayout.SetAnchorPoint( AnchorPoint::TOP_RIGHT );
+    mNextLayout.SetSize(175, 50);
+    toolbar.Add( mNextLayout );
+
+    mLinearExample.Demo::LinearExample::Create();
+  }
+
+  bool ChangeLayout( Button button )
+  {
+    mLayoutIndex++;
+
+    switch( mLayoutIndex )
+    {
+      case 1 :
+      {
+        mLinearExample.Remove();
+        mPaddedExample.Create();
+        break;
+      }
+      case 2 :
+      {
+        mPaddedExample.Remove();
+        mNextLayout.SetProperty( Toolkit::Button::Property::LABEL, "end of test");
+        mNextLayout.SetProperty( Toolkit::Button::Property::DISABLED, true );
+        break;
+      }
+      default :
+      {
+        break;
+      }
+    }
+
+    return true;
+  }
+
+private:
+  /**
+   * Main key event handler
+   */
+  void OnKeyEvent(const KeyEvent& event)
+  {
+    if(event.state == KeyEvent::Down)
+    {
+      if( IsKey( event, DALI_KEY_ESCAPE) || IsKey( event, DALI_KEY_BACK ) )
+      {
+        mApplication.Quit();
+      }
+    }
+  }
+
+
+private:
+  Application& mApplication;
+  Demo::LinearExample mLinearExample;
+  Demo::PaddingExample mPaddedExample;
+  PushButton mNextLayout;
+  unsigned int mLayoutIndex;
+};
+
+int DALI_EXPORT_API main( int argc, char **argv )
+{
+  Application application = Application::New( &argc, &argv, DEMO_THEME_PATH );
+  LayoutingExample test( application );
+  application.MainLoop();
+  return 0;
+};
diff --git a/examples/layouting/linear-example.cpp b/examples/layouting/linear-example.cpp
new file mode 100644 (file)
index 0000000..0347c6b
--- /dev/null
@@ -0,0 +1,168 @@
+/*
+ * Copyright (c) 2018 Samsung Electronics Co., Ltd.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *
+ */
+
+#include <string>
+#include "linear-example.h"
+#include <dali-toolkit/devel-api/visuals/image-visual-properties-devel.h>
+#include <dali-toolkit/devel-api/visual-factory/visual-factory.h>
+#include <dali-toolkit/devel-api/controls/control-devel.h>
+#include <dali-toolkit/devel-api/layouting/hbox-layout.h>
+#include <dali-toolkit/devel-api/layouting/vbox-layout.h>
+
+using namespace Dali;
+using namespace Dali::Toolkit;
+
+namespace
+{
+
+// Button file names
+const char* LTR_IMAGE( DEMO_IMAGE_DIR "icon-play.png" );
+const char* LTR_SELECTED_IMAGE( DEMO_IMAGE_DIR "icon-play-selected.png" );
+
+const char* RTL_IMAGE( DEMO_IMAGE_DIR "icon-reverse.png" );
+const char* RTL_SELECTED_IMAGE( DEMO_IMAGE_DIR "icon-reverse-selected.png" );
+
+const char* ROTATE_CLOCKWISE_IMAGE( DEMO_IMAGE_DIR "icon-reset.png" );
+const char* ROTATE_CLOCKWISE_SELECTED_IMAGE( DEMO_IMAGE_DIR "icon-reset-selected.png" );
+
+// Child image filenames
+const char* IMAGE_PATH[] = {
+  DEMO_IMAGE_DIR "application-icon-101.png",
+  DEMO_IMAGE_DIR "application-icon-102.png",
+  DEMO_IMAGE_DIR "application-icon-103.png",
+  DEMO_IMAGE_DIR "application-icon-104.png"
+};
+
+const unsigned int NUMBER_OF_RESOURCES = sizeof(IMAGE_PATH) / sizeof(char*);
+
+// Helper function to create ImageViews with given filename and size.
+void CreateChildImageView( ImageView& imageView, const char* filename, Size size )
+{
+  imageView = ImageView::New();
+  Property::Map imagePropertyMap;
+  imagePropertyMap[ Toolkit::Visual::Property::TYPE ] = Toolkit::Visual::IMAGE;
+  imagePropertyMap[ Toolkit::ImageVisual::Property::URL ] = filename;
+  imagePropertyMap[ ImageVisual::Property::DESIRED_WIDTH ] = size.width;
+  imagePropertyMap[ ImageVisual::Property::DESIRED_HEIGHT ] = size.height;
+  imageView.SetProperty(Toolkit::ImageView::Property::IMAGE , imagePropertyMap );
+  imageView.SetName("ImageView");
+  imageView.SetAnchorPoint( AnchorPoint::TOP_LEFT );
+  imageView.SetResizePolicy( ResizePolicy::FIXED, Dimension::ALL_DIMENSIONS );
+}
+
+}  // namespace
+
+namespace Demo
+{
+
+void LinearExample::Create()
+{
+  // The Init signal is received once (only) during the Application lifetime
+  auto stage = Stage::GetCurrent();
+
+  mDirectionButton = PushButton::New();
+  mDirectionButton.SetProperty( PushButton::Property::UNSELECTED_ICON, RTL_IMAGE );
+  mDirectionButton.SetProperty( PushButton::Property::SELECTED_ICON, RTL_SELECTED_IMAGE );
+  mDirectionButton.ClickedSignal().Connect( this, &LinearExample::OnDirectionClicked );
+  mDirectionButton.SetParentOrigin( Vector3(0.33f, 1.0f, 0.5f ) );
+  mDirectionButton.SetAnchorPoint( AnchorPoint::BOTTOM_CENTER );
+  mDirectionButton.SetSize(75, 75);
+  stage.Add( mDirectionButton );
+
+  mRotateButton = PushButton::New();
+  mRotateButton.SetProperty( PushButton::Property::UNSELECTED_ICON, ROTATE_CLOCKWISE_IMAGE );
+  mRotateButton.SetProperty( PushButton::Property::SELECTED_ICON, ROTATE_CLOCKWISE_SELECTED_IMAGE );
+  mRotateButton.ClickedSignal().Connect( this, &LinearExample::OnRotateClicked );
+  mRotateButton.SetParentOrigin( Vector3(0.66f, 1.0f, 0.5f ));
+  mRotateButton.SetAnchorPoint( Vector3(0.5f, 1.0f, 0.5f));
+  mRotateButton.SetSize(75, 75);
+  stage.Add( mRotateButton );
+
+  // Create a linear layout
+  mLinearContainer = Control::New();
+  mIsHorizontal = false;
+
+  auto layout = VboxLayout::New();
+  layout.SetAnimateLayout(true);
+  DevelControl::SetLayout( mLinearContainer, layout );
+
+  mLinearContainer.SetParentOrigin( ParentOrigin::CENTER );
+  mLinearContainer.SetAnchorPoint( AnchorPoint::CENTER );
+  mLinearContainer.SetName( "LinearExample" );
+  stage.Add( mLinearContainer );
+  mLinearContainer.SetProperty( Toolkit::LayoutItem::ChildProperty::WIDTH_SPECIFICATION, ChildLayoutData::MATCH_PARENT );
+  mLinearContainer.SetProperty( Toolkit::LayoutItem::ChildProperty::HEIGHT_SPECIFICATION, ChildLayoutData::MATCH_PARENT );
+  mLinearContainer.SetProperty( Actor::Property::LAYOUT_DIRECTION, LayoutDirection::LEFT_TO_RIGHT );
+
+  for( unsigned int x = 0; x < NUMBER_OF_RESOURCES; ++x )
+  {
+    Toolkit::ImageView imageView;
+    CreateChildImageView( imageView, IMAGE_PATH[ x ], Size(100.0f, 100.0f) );
+    mLinearContainer.Add( imageView );
+  }
+}
+
+// Remove controls added by this example from stage
+void LinearExample::Remove()
+{
+  if ( mLinearContainer )
+  {
+    UnparentAndReset( mDirectionButton );
+    UnparentAndReset( mRotateButton );
+    UnparentAndReset( mLinearContainer);
+  }
+}
+
+// Mirror items in layout
+bool LinearExample::OnDirectionClicked( Button button )
+{
+  if( mDirection )
+  {
+    mDirectionButton.SetProperty( PushButton::Property::UNSELECTED_ICON, LTR_IMAGE );
+    mDirectionButton.SetProperty( PushButton::Property::SELECTED_ICON, LTR_SELECTED_IMAGE );
+    mLinearContainer.SetProperty( Actor::Property::LAYOUT_DIRECTION, LayoutDirection::LEFT_TO_RIGHT );
+  }
+  else
+  {
+    mDirectionButton.SetProperty( PushButton::Property::UNSELECTED_ICON, RTL_IMAGE );
+    mDirectionButton.SetProperty( PushButton::Property::SELECTED_ICON, RTL_SELECTED_IMAGE );
+    mLinearContainer.SetProperty( Actor::Property::LAYOUT_DIRECTION, LayoutDirection::RIGHT_TO_LEFT );
+  }
+  mDirection = !mDirection;
+  return true;
+}
+
+// Rotate layout by changing layout
+bool LinearExample::OnRotateClicked( Button button )
+{
+  mIsHorizontal = !mIsHorizontal;
+  if( mIsHorizontal )
+  {
+    auto hboxLayout = HboxLayout::New();
+    hboxLayout.SetAnimateLayout(true);
+    DevelControl::SetLayout( mLinearContainer, hboxLayout );
+  }
+  else
+  {
+    auto vboxLayout = VboxLayout::New();
+    vboxLayout.SetAnimateLayout(true);
+    DevelControl::SetLayout( mLinearContainer, vboxLayout );
+  }
+  return true;
+}
+
+} // namespace Demo
\ No newline at end of file
diff --git a/examples/layouting/linear-example.h b/examples/layouting/linear-example.h
new file mode 100644 (file)
index 0000000..5779379
--- /dev/null
@@ -0,0 +1,64 @@
+#ifndef DALI_DEMO_LINEAR_EXAMPLE_H
+#define DALI_DEMO_LINEAR_EXAMPLE_H
+
+/*
+ * Copyright (c) 2018 Samsung Electronics Co., Ltd.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *
+ */
+
+#include <dali/dali.h>
+#include <dali-toolkit/dali-toolkit.h>
+
+using namespace Dali;
+using namespace Dali::Toolkit;
+
+namespace Demo
+{
+
+/**
+ * @file linear-example.hcpp
+ * @brief Example of a Linear Layout with mirror feature and
+ * tranisition from horizontal to vertical.
+ */
+class LinearExample: public ConnectionTracker
+{
+
+public:
+
+  // Creates a Linear Layout Example and displays it.
+  void Create();
+
+  // Remove and destroy this layout
+  void Remove();
+
+private:
+
+  // Changes the direction of the items.
+  bool OnDirectionClicked( Button button );
+
+  // Alternates the linear layout from horizontal to vertical
+  bool OnRotateClicked( Button button );
+
+private:
+  PushButton mDirectionButton;
+  PushButton mRotateButton;
+  Control mLinearContainer;
+  bool mDirection;
+  bool mIsHorizontal = true;
+}; // class LinearContainer
+
+} // namespace Demo
+
+#endif //DALI_DEMO_LINEAR_CONTAINER_H
\ No newline at end of file
diff --git a/examples/layouting/padding-example.cpp b/examples/layouting/padding-example.cpp
new file mode 100644 (file)
index 0000000..3c1cc45
--- /dev/null
@@ -0,0 +1,128 @@
+/*
+ * Copyright (c) 2017 Samsung Electronics Co., Ltd.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *
+ */
+
+#include <string>
+#include "padding-example.h"
+#include <dali-toolkit/devel-api/visuals/image-visual-properties-devel.h>
+#include <dali-toolkit/devel-api/visual-factory/visual-factory.h>
+#include <dali-toolkit/devel-api/controls/control-devel.h>
+#include <dali-toolkit/devel-api/layouting/hbox-layout.h>
+
+using namespace Dali;
+using namespace Dali::Toolkit;
+
+
+namespace
+{
+
+// Helper function to create ImageViews with given filename and size.
+void CreateChildImageView( ImageView& imageView, const char* filename, Size size )
+{
+  imageView = ImageView::New();
+  Property::Map imagePropertyMap;
+  imagePropertyMap[ Toolkit::Visual::Property::TYPE ] = Toolkit::Visual::IMAGE;
+  imagePropertyMap[ Toolkit::ImageVisual::Property::URL ] = filename;
+  imagePropertyMap[ ImageVisual::Property::DESIRED_WIDTH ] = size.width;
+  imagePropertyMap[ ImageVisual::Property::DESIRED_HEIGHT ] = size.height;
+  imageView.SetProperty(Toolkit::ImageView::Property::IMAGE , imagePropertyMap );
+  imageView.SetName("ImageView");
+  imageView.SetAnchorPoint( AnchorPoint::TOP_LEFT );
+  imageView.SetResizePolicy( ResizePolicy::FIXED, Dimension::ALL_DIMENSIONS );
+}
+
+}
+
+namespace Demo
+{
+
+void PaddingExample::Create()
+{
+  // The Init signal is received once (only) during the Application lifetime
+
+  // Creates a default view with a default tool bar.
+  // The view is added to the stage.
+  auto stage = Stage::GetCurrent();
+  // Create a table view to show a pair of buttons above each image.
+  mHorizontalBox = Control::New();
+
+  // Create HBoxLayout for this control.
+  auto hboxLayout = HboxLayout::New();
+  DevelControl::SetLayout( mHorizontalBox, hboxLayout );
+  mHorizontalBox.SetName("HBox");
+
+  mHorizontalBox.SetAnchorPoint( AnchorPoint::CENTER );
+  mHorizontalBox.SetParentOrigin( ParentOrigin::CENTER );
+
+  stage.Add( mHorizontalBox );
+
+  for( unsigned int x = 0; x < NUMBER_OF_IMAGE_VIEWS; x++ )
+  {
+    mToggleButton = Toolkit::PushButton::New();
+    mToggleButton.SetProperty( Toolkit::Button::Property::LABEL, "Toggle Padding on #2" );
+    mToggleButton.SetParentOrigin( ParentOrigin::BOTTOM_CENTER );
+    mToggleButton.SetAnchorPoint( AnchorPoint::BOTTOM_CENTER );
+    mToggleButton.ClickedSignal().Connect( this, &Demo::PaddingExample::ChangePaddingClicked );
+    mToggleButton.SetResizePolicy( ResizePolicy::FILL_TO_PARENT, Dimension::WIDTH );
+    mToggleButton.SetResizePolicy( ResizePolicy::USE_NATURAL_SIZE, Dimension::HEIGHT );
+
+    stage.Add( mToggleButton );
+
+    CreateChildImageView( mImageViews[x], DEMO_IMAGE_DIR "gallery-small-23.jpg" , Size(100.0f, 100.0f) );
+
+    // Set Padding for second ImageView
+    if( 1 == x )
+    {
+      mImageViews[x].SetProperty(Toolkit::Control::Property::PADDING, Extents(10.0f,10.0f,5.0f, 5.0f));
+    }
+
+    // Set margin for first ImageView
+    if( 0 == x )
+    {
+      mImageViews[x].SetProperty(Toolkit::Control::Property::MARGIN, Extents(10.0f,10.0f,0.0f, 0.0f));
+    }
+
+    mHorizontalBox.Add( mImageViews[x] );
+
+    mImageViewToggleStatus[ x ] = true;
+  }
+}
+
+void PaddingExample::Remove()
+{
+  UnparentAndReset( mToggleButton );
+  UnparentAndReset( mHorizontalBox );
+}
+
+bool PaddingExample::ChangePaddingClicked( Toolkit::Button button )
+{
+  if ( true == mImageViewToggleStatus[ 1 ] )
+  {
+    mImageViews[1].SetProperty(Toolkit::Control::Property::PADDING, Extents( .0f, .0f, .0f, .0f));
+    mImageViews[1].SetProperty(Actor::Property::COLOR_ALPHA, 0.5f);
+    mImageViewToggleStatus[ 1 ] = false;
+  }
+  else
+  {
+    mImageViews[1].SetProperty(Toolkit::Control::Property::PADDING, Extents( 10.0f, 10.0f, 5.0f, 5.0f));
+    mImageViews[1].SetProperty(Actor::Property::COLOR_ALPHA, 1.0f);
+    mImageViewToggleStatus[ 1 ] = true;
+  }
+
+  return true;
+}
+
+} // namespace Demo
\ No newline at end of file
diff --git a/examples/layouting/padding-example.h b/examples/layouting/padding-example.h
new file mode 100644 (file)
index 0000000..ce13eed
--- /dev/null
@@ -0,0 +1,64 @@
+#ifndef DALI_DEMO_PADDING_EXAMPLE_H
+#define DALI_DEMO_PADDING_EXAMPLE_H
+
+/*
+ * Copyright (c) 2017 Samsung Electronics Co., Ltd.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *
+ */
+
+#include <string>
+#include <dali/dali.h>
+#include <dali-toolkit/dali-toolkit.h>
+
+using namespace Dali;
+using namespace Dali::Toolkit;
+
+namespace Demo
+{
+
+/**
+ * @file padding-example.hcpp
+ * @brief Example of a Linear Layout with padding applied, enables updating of padding values for
+ * one of the children.
+ */
+class PaddingExample: public ConnectionTracker
+{
+public:
+
+  static const unsigned int NUMBER_OF_IMAGE_VIEWS = 3;
+
+  // Create a Linear layout of ImagesViews, one with a Margin, One with padding.
+  void Create();
+
+  // Remove created Layout
+  void Remove();
+
+private:
+
+  // Change Paddding callback
+  bool ChangePaddingClicked( Toolkit::Button button );
+
+private:
+
+  Toolkit::Control           mHorizontalBox;
+  Toolkit::ImageView         mImageViews[ NUMBER_OF_IMAGE_VIEWS ];
+  bool                       mImageViewToggleStatus[ NUMBER_OF_IMAGE_VIEWS ];
+  Toolkit::PushButton        mToggleButton;
+
+};
+
+} // namespace Demo
+
+#endif // DALI_DEMO_PADDING_EXAMPLE_H