[dali_1.0.43] Merge branch 'tizen'

Change-Id: I3f5e19c1e72727115078bedd42037e66eac878e2

[dali_1.0.43] Merge branch 'tizen'
Change-Id: I3f5e19c1e72727115078bedd42037e66eac878e2
Richard Huang
2 parents a1ecdd9d 8178ca9a
Showing 18 changed files with 229 additions and 254 deletions
com.samsung.dali-demo.xml
demo/dali-demo.cpp
demo/dali-table-view.cpp
demo/dali-table-view.h
examples/animated-shapes/animated-shapes-example.cpp
examples/cluster/cluster-impl.cpp
examples/cluster/cluster-impl.h
examples/item-view/item-view-example.cpp
examples/path-animation/path-animation.cpp
examples/text-field/text-field-example.cpp
examples/text-label/text-label-example.cpp
packaging/com.samsung.dali-demo.spec
resources/images/folder_appicon_empty_bg.png
resources/images/grab-handle.png
resources/scripts/animated-colors.json
resources/scripts/background-color.json
resources/scripts/table-view.json
shared/dali-demo-strings.h
@@ -86,7 +86,7 @@
 		<label>Emojis Text Label</label>
 	</ui-application>
 	<ui-application appid="text-field.example" exec="/usr/apps/com.samsung.dali-demo/bin/text-field.example" nodisplay="true" multiple="false" type="c++app" taskmanage="true">
-		<label>Text Label</label>
+		<label>Text Field</label>
 	</ui-application>
 	<ui-application appid="text-message-field.example" exec="/usr/apps/com.samsung.dali-demo/bin/text-message-field.example" nodisplay="true" multiple="false" type="c++app" taskmanage="true">
 		<label>Text Label</label>
@@ -53,6 +53,7 @@ int main(int argc, char **argv)
   demo.AddExample(Example("builder.example", DALI_DEMO_STR_TITLE_SCRIPT_BASED_UI));
   demo.AddExample(Example("image-scaling-and-filtering.example", DALI_DEMO_STR_TITLE_IMAGE_FITTING_SAMPLING));
   demo.AddExample(Example("image-scaling-irregular-grid.example", DALI_DEMO_STR_TITLE_IMAGE_SCALING));
+  demo.AddExample(Example("text-field.example", DALI_DEMO_STR_TITLE_TEXT_FIELD));
   demo.AddExample(Example("text-label.example", DALI_DEMO_STR_TITLE_TEXT_LABEL));
   demo.AddExample(Example("text-label-multi-language.example", DALI_DEMO_STR_TITLE_TEXT_LABEL_MULTI_LANGUAGE));
   demo.AddExample(Example("text-label-emojis.example", DALI_DEMO_STR_TITLE_EMOJI_TEXT));
@@ -387,12 +387,12 @@ void DaliTableView::Populate()
           const Example& example = ( *iter );
           Actor tile = CreateTile( example.name, example.title, Vector3( tileParentMultiplier, tileParentMultiplier, 1.0f ), true );
-          FocusManager focusManager = FocusManager::Get();
-          focusManager.SetFocusOrder( tile, ++exampleCount );
-          focusManager.SetAccessibilityAttribute( tile, Dali::Toolkit::FocusManager::ACCESSIBILITY_LABEL,
+          AccessibilityFocusManager accessibilityFocusManager = AccessibilityFocusManager::Get();
+          accessibilityFocusManager.SetFocusOrder( tile, ++exampleCount );
+          accessibilityFocusManager.SetAccessibilityAttribute( tile, Dali::Toolkit::AccessibilityFocusManager::ACCESSIBILITY_LABEL,
                                                   example.title );
-          focusManager.SetAccessibilityAttribute( tile, Dali::Toolkit::FocusManager::ACCESSIBILITY_TRAIT, "Tile" );
-          focusManager.SetAccessibilityAttribute( tile, Dali::Toolkit::FocusManager::ACCESSIBILITY_HINT,
+          accessibilityFocusManager.SetAccessibilityAttribute( tile, Dali::Toolkit::AccessibilityFocusManager::ACCESSIBILITY_TRAIT, "Tile" );
+          accessibilityFocusManager.SetAccessibilityAttribute( tile, Dali::Toolkit::AccessibilityFocusManager::ACCESSIBILITY_HINT,
                                                   "You can run this example" );
           tile.SetPadding( Padding( margin, margin, margin, margin ) );
@@ -551,7 +551,7 @@ bool DaliTableView::OnTilePressed( Actor actor, const TouchEvent&amp; event )
     std::string name = actor.GetName();
     ExampleMapConstIter iter = mExampleMap.find( name );
-    FocusManager focusManager = FocusManager::Get();
+    AccessibilityFocusManager accessibilityFocusManager = AccessibilityFocusManager::Get();
     if( iter != mExampleMap.end() )
     {
@@ -594,11 +594,11 @@ void DaliTableView::OnPressedAnimationFinished( Dali::Animation&amp; source )
       if( name == BUTTON_QUIT )
       {
         // Move focus to the OK button
-        FocusManager focusManager = FocusManager::Get();
+        AccessibilityFocusManager accessibilityFocusManager = AccessibilityFocusManager::Get();
         // Enable the group mode and wrap mode
-        focusManager.SetGroupMode( true );
-        focusManager.SetWrapMode( true );
+        accessibilityFocusManager.SetGroupMode( true );
+        accessibilityFocusManager.SetWrapMode( true );
       }
     }
     else
@@ -630,8 +630,8 @@ void DaliTableView::OnScrollComplete( const Dali::Vector2&amp; position )
   mScrolling = false;
   // move focus to 1st item of new page
-  FocusManager focusManager = FocusManager::Get();
-  focusManager.SetCurrentFocusActor(mPages[mScrollView.GetCurrentPage()].GetChildAt(0) );
+  AccessibilityFocusManager accessibilityFocusManager = AccessibilityFocusManager::Get();
+  accessibilityFocusManager.SetCurrentFocusActor(mPages[mScrollView.GetCurrentPage()].GetChildAt(0) );
 }
 bool DaliTableView::OnScrollTouched( Actor actor, const TouchEvent& event )
@@ -890,7 +890,7 @@ void DaliTableView::PlayAnimation()
   mAnimationTimer.SetInterval( BACKGROUND_ANIMATION_DURATION );
 }
-Dali::Actor DaliTableView::OnKeyboardPreFocusChange( Dali::Actor current, Dali::Actor proposed, Dali::Toolkit::Control::KeyboardFocusNavigationDirection direction )
+Dali::Actor DaliTableView::OnKeyboardPreFocusChange( Dali::Actor current, Dali::Actor proposed, Dali::Toolkit::Control::KeyboardFocus::Direction direction )
 {
   Actor nextFocusActor = proposed;
@@ -905,22 +905,22 @@ Dali::Actor DaliTableView::OnKeyboardPreFocusChange( Dali::Actor current, Dali::
     // in the given direction. We should work out which page to scroll to next.
     int currentPage = mScrollView.GetCurrentPage();
     int newPage = currentPage;
-    if( direction == Dali::Toolkit::Control::Left )
+    if( direction == Dali::Toolkit::Control::KeyboardFocus::LEFT )
     {
       newPage--;
     }
-    else if( direction == Dali::Toolkit::Control::Right )
+    else if( direction == Dali::Toolkit::Control::KeyboardFocus::RIGHT )
     {
       newPage++;
     }
-    newPage = std::max(0, std::min(static_cast<int>(mScrollRulerX->GetTotalPages() - 1), newPage));
+    newPage = std::max(0, std::min(mTotalPages - 1, newPage));
     if( newPage == currentPage )
     {
-      if( direction == Dali::Toolkit::Control::Left )
+      if( direction == Dali::Toolkit::Control::KeyboardFocus::LEFT )
       {
-        newPage = mScrollRulerX->GetTotalPages() - 1;
-      } else if( direction == Dali::Toolkit::Control::Right )
+        newPage = mTotalPages - 1;
+      } else if( direction == Dali::Toolkit::Control::KeyboardFocus::RIGHT )
       {
         newPage = 0;
       }
@@ -929,7 +929,7 @@ Dali::Actor DaliTableView::OnKeyboardPreFocusChange( Dali::Actor current, Dali::
     // Scroll to the page in the given direction
     mScrollView.ScrollTo(newPage);
-    if( direction == Dali::Toolkit::Control::Left )
+    if( direction == Dali::Toolkit::Control::KeyboardFocus::LEFT )
     {
       // Work out the cell position for the last tile
       int remainingExamples = mExampleList.size() - newPage * EXAMPLES_PER_PAGE;
@@ -937,7 +937,7 @@ Dali::Actor DaliTableView::OnKeyboardPreFocusChange( Dali::Actor current, Dali::
       int colPos = remainingExamples >= EXAMPLES_PER_PAGE ? EXAMPLES_PER_ROW - 1 : ( remainingExamples % EXAMPLES_PER_PAGE - rowPos * EXAMPLES_PER_ROW - 1 );
       // Move the focus to the last tile in the new page.
-      nextFocusActor = mPages[newPage].GetChildAt(colPos * EXAMPLES_PER_ROW + rowPos);
+      nextFocusActor = mPages[newPage].GetChildAt(rowPos * EXAMPLES_PER_ROW + colPos);
     }
     else
     {
@@ -345,7 +345,7 @@ private: // Application callbacks &amp; implementation
    * @param[in] direction The direction to move the focus
    * @return The actor to move the keyboard focus to.
    */
-  Dali::Actor OnKeyboardPreFocusChange( Dali::Actor current, Dali::Actor proposed, Dali::Toolkit::Control::KeyboardFocusNavigationDirection direction );
+  Dali::Actor OnKeyboardPreFocusChange( Dali::Actor current, Dali::Actor proposed, Dali::Toolkit::Control::KeyboardFocus::Direction direction );
   /**
    * Callback when the keyboard focused actor is activated.
@@ -55,11 +55,12 @@ public:
     // Get a handle to the stage
     Stage stage = Stage::GetCurrent();
-    //Create a view
+    // Create a view
     mView = Dali::Toolkit::Control::New();
     mView.SetAnchorPoint( Dali::AnchorPoint::CENTER );
     mView.SetParentOrigin( Dali::ParentOrigin::CENTER );
     mView.SetResizePolicy( ResizePolicy::FILL_TO_PARENT, Dimension::ALL_DIMENSIONS );
+    mView.SetDrawMode( DrawMode::OVERLAY );
     stage.Add( mView );
     //Set background image for the view
@@ -23,7 +23,9 @@
 #include <cstring> // for strcmp
 #include <dali/public-api/animation/animation.h>
 #include <dali/public-api/object/type-registry.h>
+#include <dali/public-api/object/property-array.h>
 #include <dali/devel-api/object/type-registry-helper.h>
+#include <dali/devel-api/scripting/scripting.h>
 #include <dali/integration-api/debug.h>
 // INTERNAL INCLUDES
@@ -475,17 +477,21 @@ void Cluster::UpdateTitle(float duration)
   }
 }
-void Cluster::DoExpandAction(const PropertyValueContainer& attributes)
+void Cluster::DoExpandAction(const Property::Map& attributes)
 {
-  if(attributes.size() >= 1)
+  Property::Value* value = attributes.Find( "indices" );
+
+  if( value )
   {
-    for(PropertyValueConstIter iter = attributes.begin(); iter != attributes.end(); ++iter)
+    if( value->GetType() == Property::ARRAY )
     {
-      const Property::Value& value = *iter;
-
-      DALI_ASSERT_ALWAYS(value.GetType() == Property::FLOAT);
-      unsigned int index = value.Get<float>();
-      ExpandChild( index );
+      Property::Array array = value->Get<Property::Array>();
+      for( size_t i = 0; i < array.Size(); i++ )
+      {
+        Property::Value& item = array[i];
+        DALI_ASSERT_ALWAYS(item.GetType() == Property::INTEGER);
+        ExpandChild( item.Get<int>() );
+      }
     }
   }
   else
@@ -494,17 +500,21 @@ void Cluster::DoExpandAction(const PropertyValueContainer&amp; attributes)
   }
 }
-void Cluster::DoCollapseAction(const PropertyValueContainer& attributes)
+void Cluster::DoCollapseAction(const Property::Map& attributes)
 {
-  if(attributes.size() >= 1)
+  Property::Value* value = attributes.Find( "indices" );
+
+  if( value )
   {
-    for(PropertyValueConstIter iter = attributes.begin(); iter != attributes.end(); ++iter)
+    if( value->GetType() == Property::ARRAY )
     {
-      const Property::Value& value = *iter;
-
-      DALI_ASSERT_ALWAYS(value.GetType() == Property::FLOAT);
-      unsigned int index = value.Get<float>();
-      CollapseChild( index, false );
+      Property::Array array = value->Get<Property::Array>();
+      for( size_t i = 0; i < array.Size(); i++ )
+      {
+        Property::Value& item = array[i];
+        DALI_ASSERT_ALWAYS(item.GetType() == Property::INTEGER);
+        CollapseChild( item.Get<int>(), false );
+      }
     }
   }
   else
@@ -513,27 +523,33 @@ void Cluster::DoCollapseAction(const PropertyValueContainer&amp; attributes)
   }
 }
-void Cluster::DoTransformAction(const PropertyValueContainer& attributes)
+
+void Cluster::DoTransformAction(const Property::Map& attributes)
 {
-  DALI_ASSERT_ALWAYS(attributes.size() >= 2);
+  typedef Dali::StringValuePair StringValuePair;
-  DALI_ASSERT_ALWAYS(attributes[0].GetType() == Property::FLOAT);
-  unsigned int index = attributes[0].Get<float>();
+  int index = 0;
   Vector3 position;
   Vector3 scale(Vector3::ONE);
   Quaternion rotation( Dali::ANGLE_0, Vector3::ZAXIS );
-  DALI_ASSERT_ALWAYS(attributes[1].GetType() == Property::VECTOR3);
-  attributes[1].Get(position);
-
-  if(attributes.size()>2)
+  for(size_t i = 0; i < attributes.Count(); i++)
   {
-    attributes[2].Get(scale);
-  }
+    StringValuePair& stringValue = attributes.GetPair(i);
+    Property::Type type = stringValue.second.GetType();
-  if(attributes.size()>3)
-  {
-    attributes[3].Get(rotation);
+    if( Property::VECTOR3 == type && "position" == stringValue.first )
+    {
+      stringValue.second.Get(position);
+    }
+    else if( Property::VECTOR3 == type && "scale" == stringValue.first )
+    {
+      stringValue.second.Get(scale);
+    }
+    else if( "rotation" == stringValue.first )
+    {
+      (void)Scripting::SetRotation(stringValue.second, rotation);
+    }
   }
   // wrap index around -1 => size - 1
@@ -547,7 +563,7 @@ void Cluster::OnControlChildRemove(Actor&amp; child)
   child.RemoveConstraints();
 }
-bool Cluster::DoAction(BaseObject* object, const std::string& actionName, const PropertyValueContainer& attributes)
+bool Cluster::DoAction(BaseObject* object, const std::string& actionName, const Property::Map& attributes)
 {
   bool ret = false;
@@ -212,7 +212,7 @@ private:
    * @param[in] attributes list of indices of actors to expand.
    * (if no attributes specifies, then all actors expand)
    */
-  void DoExpandAction(const PropertyValueContainer& attributes);
+  void DoExpandAction(const Property::Map& attributes);
   /**
    * Action: Collapse
@@ -221,7 +221,7 @@ private:
    * @param[in] attributes list of indices of actors to collapse.
    * (if no attributes specifies, then all actors collapse)
    */
-  void DoCollapseAction(const PropertyValueContainer& attributes);
+  void DoCollapseAction(const Property::Map& attributes);
   /**
    * Action: Transform
@@ -230,7 +230,7 @@ private:
    *
    * @param[in] attributes index and transform values.
    */
-  void DoTransformAction(const PropertyValueContainer& attributes);
+  void DoTransformAction(const Property::Map& attributes);
 private: // From Control
   /**
@@ -248,7 +248,7 @@ public:
    * @param[in] attributes The attributes with which to perfrom this action.
    * @return true if action has been accepted by this control
    */
-  static bool DoAction(BaseObject* object, const std::string& actionName, const PropertyValueContainer& attributes);
+  static bool DoAction(BaseObject* object, const std::string& actionName, const Property::Map& attributes);
 private: // From Control
@@ -313,7 +313,7 @@ public:
     mWhiteImage = BufferImage::WHITE();
   }
-  Actor OnKeyboardPreFocusChange( Actor current, Actor proposed, Control::KeyboardFocusNavigationDirection direction )
+  Actor OnKeyboardPreFocusChange( Actor current, Actor proposed, Control::KeyboardFocus::Direction direction )
   {
     if ( !current && !proposed  )
     {
@@ -140,8 +140,6 @@ public:
    */
   void DrawPath( unsigned int resolution )
   {
-    Stage stage = Dali::Stage::GetCurrent();
-
     //Create path mesh actor
     Dali::MeshData meshData = MeshFactory::NewPath( mPath, resolution );
     Dali::Material material = Material::New("LineMaterial");
@@ -150,12 +148,12 @@ public:
     Dali::Mesh mesh = Dali::Mesh::New( meshData );
     if( mMeshPath )
     {
-      stage.Remove( mMeshPath );
+      mContentLayer.Remove( mMeshPath );
     }
     mMeshPath = Dali::MeshActor::New( mesh );
     mMeshPath.SetAnchorPoint( AnchorPoint::TOP_LEFT );
     mMeshPath.SetParentOrigin( ParentOrigin::TOP_LEFT );
-    stage.Add( mMeshPath );
+    mContentLayer.Add( mMeshPath );
     ////Create mesh connecting interpolation points and control points
@@ -192,12 +190,12 @@ public:
     mesh = Dali::Mesh::New( meshData );
     if( mMeshHandlers )
     {
-      stage.Remove( mMeshHandlers );
+      mContentLayer.Remove( mMeshHandlers );
     }
     mMeshHandlers = Dali::MeshActor::New( mesh );
     mMeshHandlers.SetAnchorPoint( AnchorPoint::TOP_LEFT );
     mMeshHandlers.SetParentOrigin( ParentOrigin::TOP_LEFT );
-    stage.Add( mMeshHandlers );
+    mContentLayer.Add( mMeshHandlers );
     //Create actors representing interpolation points
@@ -456,6 +454,7 @@ public:
                                             BACKGROUND_IMAGE,
                                             TOOLBAR_IMAGE,
                                             "" );
+    mContentLayer.SetDrawMode( DrawMode::OVERLAY );
     mContentLayer.TouchedSignal().Connect(this, &PathController::OnTouchLayer);
@@ -475,7 +474,7 @@ public:
     mActor = ImageActor::New( img );
     mActor.SetAnchorPoint( AnchorPoint::CENTER );
     mActor.SetSize( 100, 50, 1 );
-    stage.Add( mActor );
+    mContentLayer.Add( mActor );
     CreateAnimation();
     CreateControls();
@@ -22,7 +22,9 @@
 // EXTERNAL INCLUDES
 #include <dali-toolkit/dali-toolkit.h>
+#include <dali-toolkit/devel-api/controls/popup/popup.h>
 #include <iostream>
+#include <dali/public-api/events/touch-point.h>
 // INTERNAL INCLUDES
 #include "shared/multi-language-strings.h"
@@ -35,38 +37,11 @@ using namespace MultiLanguageStrings;
 namespace
 {
-  const char* const BACKGROUND_IMAGE = DALI_IMAGE_DIR "button-up.9.png";
+  const char* const FOLDER_ICON_IMAGE = DALI_IMAGE_DIR "folder_appicon_empty_bg.png";
   const float BORDER_WIDTH = 4.0f;
-  const unsigned int KEY_ZERO = 10;
-  const unsigned int KEY_ONE = 11;
-  const unsigned int KEY_F = 41;
-  const unsigned int KEY_H = 43;
-  const unsigned int KEY_V = 55;
-  const unsigned int KEY_M = 58;
-  const unsigned int KEY_L = 46;
-  const unsigned int KEY_S = 39;
-  const unsigned int KEY_PLUS = 21;
-  const unsigned int KEY_MINUS = 20;
-
-  const char* H_ALIGNMENT_STRING_TABLE[] =
-  {
-    "BEGIN",
-    "CENTER",
-    "END"
-  };
-
-  const unsigned int H_ALIGNMENT_STRING_COUNT = sizeof( H_ALIGNMENT_STRING_TABLE ) / sizeof( H_ALIGNMENT_STRING_TABLE[0u] );
-
-  const char* V_ALIGNMENT_STRING_TABLE[] =
-  {
-    "TOP",
-    "CENTER",
-    "BOTTOM"
-  };
-
-  const unsigned int V_ALIGNMENT_STRING_COUNT = sizeof( V_ALIGNMENT_STRING_TABLE ) / sizeof( V_ALIGNMENT_STRING_TABLE[0u] );
+  const Vector3 POPUP_SIZE_FACTOR_TO_PARENT = Vector3( 0.0, 0.25, 0.0 );
 } // unnamed namespace
@@ -78,9 +53,7 @@ class TextFieldExample : public ConnectionTracker
 public:
   TextFieldExample( Application& application )
-  : mApplication( application ),
-    mLanguageId( 0u ),
-    mAlignment( 0u )
+  : mApplication( application )
   {
     // Connect to the Application's Init signal
     mApplication.InitSignal().Connect( this, &TextFieldExample::Create );
@@ -98,40 +71,119 @@ public:
   {
     Stage stage = Stage::GetCurrent();
-    mTapGestureDetector = TapGestureDetector::New();
-    mTapGestureDetector.Attach( stage.GetRootLayer() );
-    mTapGestureDetector.DetectedSignal().Connect( this, &TextFieldExample::OnTap );
-
+    stage.SetBackgroundColor( Vector4( 0.04f, 0.345f, 0.392f, 1.0f ) );
     stage.KeyEventSignal().Connect(this, &TextFieldExample::OnKeyEvent);
+    mButton = CreateFolderButton();
+    mButton.ClickedSignal().Connect( this, &TextFieldExample::OnButtonClicked );
+    stage.Add( mButton );
+  }
+
+  PushButton CreateFolderButton()
+  {
+    PushButton button = PushButton::New();
+    ResourceImage image = ResourceImage::New( FOLDER_ICON_IMAGE );
+    ImageActor folderButton = ImageActor::New( image );
+    folderButton.SetColor( Color::WHITE );
+    button.SetButtonImage( folderButton );
+    button.SetAnchorPoint( AnchorPoint::TOP_LEFT );
+    button.SetResizePolicy( ResizePolicy::FIXED, Dimension::ALL_DIMENSIONS );
+    button.SetSize( image.GetWidth(), image.GetHeight() );
+
+    return button;
+  }
+
+  bool OnButtonClicked( Toolkit::Button button )
+  {
+    Stage stage = Stage::GetCurrent();
     Vector2 stageSize = stage.GetSize();
-    Control container = Control::New();
-    container.SetName( "Container" );
-    container.SetParentOrigin( ParentOrigin::CENTER );
-    container.SetSize( Vector2(stageSize.width*0.6f, stageSize.width*0.6f) );
-    container.SetBackgroundColor( Color::WHITE );
-    container.GetChildAt(0).SetZ(-1.0f);
-    stage.Add( container );
+    // Launch a pop-up containing TextField
+    mField = CreateTextField( stageSize, mButtonLabel );
+    mPopup = CreatePopup( stageSize.width * 0.8f );
+    mPopup.Add( mField );
+    mPopup.OutsideTouchedSignal().Connect( this, &TextFieldExample::OnPopupOutsideTouched );
+    mPopup.Show();
+
+    return true;
+  }
-    mField = TextField::New();
-    mField.SetAnchorPoint( AnchorPoint::TOP_LEFT );
-    mField.SetResizePolicy( ResizePolicy::FILL_TO_PARENT, Dimension::WIDTH );
-    mField.SetResizePolicy( ResizePolicy::DIMENSION_DEPENDENCY, Dimension::HEIGHT );
-    mField.SetProperty( TextField::Property::PLACEHOLDER_TEXT, "Unnamed folder" );
-    mField.SetProperty( TextField::Property::PLACEHOLDER_TEXT_FOCUSED, "Enter folder name." );
-    mField.SetProperty( TextField::Property::DECORATION_BOUNDING_BOX, Rect<int>( BORDER_WIDTH, BORDER_WIDTH, stageSize.width - BORDER_WIDTH*2, stageSize.height - BORDER_WIDTH*2 ) );
+  TextField CreateTextField( const Vector2& stageSize, const std::string& text )
+  {
+    TextField field = TextField::New();
+    field.SetAnchorPoint( AnchorPoint::TOP_LEFT );
+    field.SetResizePolicy( ResizePolicy::FILL_TO_PARENT, Dimension::WIDTH );
+    field.SetResizePolicy( ResizePolicy::DIMENSION_DEPENDENCY, Dimension::HEIGHT );
+    field.SetProperty( TextField::Property::TEXT, text );
+    field.SetProperty( TextField::Property::TEXT_COLOR, Vector4( 0.0f, 1.0f, 1.0f, 1.0f ) ); // CYAN
+    field.SetProperty( TextField::Property::PLACEHOLDER_TEXT, "Unnamed folder" );
+    field.SetProperty( TextField::Property::PLACEHOLDER_TEXT_FOCUSED, "Enter folder name." );
+    field.SetProperty( TextField::Property::DECORATION_BOUNDING_BOX, Rect<int>( BORDER_WIDTH, BORDER_WIDTH, stageSize.width - BORDER_WIDTH*2, stageSize.height - BORDER_WIDTH*2 ) );
+
+    return field;
+  }
-    container.Add( mField );
+  Popup CreatePopup( float width )
+  {
+    Popup popup = Popup::New();
+    popup.SetParentOrigin( ParentOrigin::CENTER );
+    popup.SetAnchorPoint( AnchorPoint::CENTER );
+    popup.SetSize( width, 0.0f );
+    popup.HideTail();
+    popup.SetResizePolicy( ResizePolicy::SIZE_RELATIVE_TO_PARENT, Dimension::HEIGHT );
+    popup.SetSizeModeFactor( POPUP_SIZE_FACTOR_TO_PARENT );
+    popup.TouchedSignal().Connect( this, &TextFieldExample::OnPopupTouched );
+
+    return popup;
+  }
-    Property::Value fieldText = mField.GetProperty( TextField::Property::TEXT );
+  void OnPopupOutsideTouched()
+  {
+    // Update the folder text
+    if( mButton && mField )
+    {
+      Property::Value text = mField.GetProperty( TextField::Property::TEXT );
+      mButtonLabel = text.Get< std::string >();
+      mButton.SetLabel( mButtonLabel );
+    }
-    std::cout << "Displaying text: " << fieldText.Get< std::string >() << std::endl;
+    // Hide & discard the pop-up
+    if( mPopup )
+    {
+      mPopup.Hide();
+    }
+    mField.Reset();
+    mPopup.Reset();
   }
-  void OnTap( Actor actor, const TapGesture& tapGesture )
+  bool OnPopupTouched( Actor actor, const TouchEvent& event )
   {
-    mField.ClearKeyInputFocus();
+    // End edit mode for TextField if parent Popup touched.
+    if(event.GetPointCount() > 0)
+    {
+      const TouchPoint& point = event.GetPoint(0);
+      switch(point.state)
+      {
+        case TouchPoint::Down:
+        {
+          // Update the folder text and lose focus for Key events
+          if( mButton && mField )
+          {
+            Property::Value text = mField.GetProperty( TextField::Property::TEXT );
+            mButtonLabel = text.Get< std::string >();
+            mButton.SetLabel( mButtonLabel );
+            mField.ClearKeyInputFocus();
+          }
+          break;
+        }
+        default:
+        {
+          break;
+        }
+      } // end switch
+    }
+
+    return true;
   }
   /**
@@ -145,73 +197,6 @@ public:
       {
         mApplication.Quit();
       }
-      else if( event.IsCtrlModifier() )
-      {
-        switch( event.keyCode )
-        {
-          // Select rendering back-end
-          case KEY_ZERO: // fall through
-          case KEY_ONE:
-          {
-            mField.SetProperty( TextField::Property::RENDERING_BACKEND, event.keyCode - 10 );
-            break;
-          }
-          case KEY_H: // Horizontal alignment
-          {
-            if( ++mAlignment >= H_ALIGNMENT_STRING_COUNT )
-            {
-              mAlignment = 0u;
-            }
-
-            mField.SetProperty( TextField::Property::HORIZONTAL_ALIGNMENT, H_ALIGNMENT_STRING_TABLE[ mAlignment ] );
-            break;
-          }
-          case KEY_V: // Vertical alignment
-          {
-            if( ++mAlignment >= V_ALIGNMENT_STRING_COUNT )
-            {
-              mAlignment = 0u;
-            }
-
-            mField.SetProperty( TextField::Property::VERTICAL_ALIGNMENT, V_ALIGNMENT_STRING_TABLE[ mAlignment ] );
-            break;
-          }
-          case KEY_L: // Language
-          {
-            const Language& language = LANGUAGES[ mLanguageId ];
-
-            mField.SetProperty( TextField::Property::TEXT, language.text );
-
-            if( ++mLanguageId >= NUMBER_OF_LANGUAGES )
-            {
-              mLanguageId = 0u;
-            }
-            break;
-          }
-          case KEY_S: // Shadow color
-          {
-            if( Color::BLACK == mField.GetProperty<Vector4>( TextField::Property::SHADOW_COLOR ) )
-            {
-              mField.SetProperty( TextField::Property::SHADOW_COLOR, Color::RED );
-            }
-            else
-            {
-              mField.SetProperty( TextField::Property::SHADOW_COLOR, Color::BLACK );
-            }
-            break;
-          }
-          case KEY_PLUS: // Increase shadow offset
-          {
-            mField.SetProperty( TextField::Property::SHADOW_OFFSET, mField.GetProperty<Vector2>( TextField::Property::SHADOW_OFFSET ) + Vector2( 1.0f, 1.0f ) );
-            break;
-          }
-          case KEY_MINUS: // Decrease shadow offset
-          {
-            mField.SetProperty( TextField::Property::SHADOW_OFFSET, mField.GetProperty<Vector2>( TextField::Property::SHADOW_OFFSET ) - Vector2( 1.0f, 1.0f ) );
-            break;
-          }
-        }
-      }
     }
   }
@@ -219,12 +204,13 @@ private:
   Application& mApplication;
-  TextField mField;
-
-  TapGestureDetector mTapGestureDetector;
+  // This button launches a pop-up containing TextField
+  PushButton mButton;
+  std::string mButtonLabel;
-  unsigned int mLanguageId;
-  unsigned int mAlignment;
+  // Pop-up contents
+  TextField mField;
+  Popup mPopup;
 };
 void RunTest( Application& application )
@@ -34,7 +34,7 @@ using namespace MultiLanguageStrings;
 namespace
 {
-  const char* const BACKGROUND_IMAGE = DALI_IMAGE_DIR "button-up.9.png";
+  const char* const BACKGROUND_IMAGE = DALI_IMAGE_DIR "grab-handle.png";
   const unsigned int KEY_ZERO = 10;
   const unsigned int KEY_ONE = 11;
@@ -107,16 +107,16 @@ public:
     mContainer.SetParentOrigin( ParentOrigin::CENTER );
     mLayoutSize = Vector2(stageSize.width*0.6f, stageSize.width*0.6f);
     mContainer.SetSize( mLayoutSize );
+    mContainer.SetDrawMode( DrawMode::OVERLAY );
     stage.Add( mContainer );
     // Resize the center layout when the corner is grabbed
     mGrabCorner = Control::New();
     mGrabCorner.SetName( "GrabCorner" );
-    mGrabCorner.SetAnchorPoint( AnchorPoint::BOTTOM_RIGHT );
+    mGrabCorner.SetAnchorPoint( AnchorPoint::TOP_CENTER );
     mGrabCorner.SetParentOrigin( ParentOrigin::BOTTOM_RIGHT );
-    mGrabCorner.SetSize( Vector2(stageSize.width*0.1f, stageSize.width*0.1f) );
-    mGrabCorner.SetZ(1.0f);
-    mGrabCorner.SetBackgroundColor( Color::YELLOW );
+    mGrabCorner.SetBackgroundImage( ResourceImage::New( BACKGROUND_IMAGE ) );
+    mGrabCorner.SetResizePolicy( ResizePolicy::USE_NATURAL_SIZE, Dimension::ALL_DIMENSIONS );
     mContainer.Add( mGrabCorner );
     mPanGestureDetector = PanGestureDetector::New();
@@ -2,7 +2,7 @@
 Name:       com.samsung.dali-demo
 Summary:    The OpenGLES Canvas Core Demo
-Version:    1.0.42
+Version:    1.0.43
 Release:    1
 Group:      System/Libraries
 License:    Apache-2.0
@@ -18,12 +18,10 @@
   "stage": [
     {
       "type": "Control",
-      "relayout-enabled": false,
+      "draw-mode": "OVERLAY",
       "actors": [
         {
           "type": "Control",
-	  "relayout-enabled": true,
-          "actors": [],
           "name": "Control 8",
           "position": [
             0,
@@ -62,12 +60,9 @@
         },
         {
           "type": "Control",
-	  "relayout-enabled": false,
           "actors": [
             {
               "type": "Control",
-	      "relayout-enabled": false,
-              "actors": [],
               "name": "Container 2",
               "position": [
                 0,
@@ -106,12 +101,9 @@
             },
             {
               "type": "Control",
-	      "relayout-enabled": false,
               "actors": [
                 {
                   "type": "Control",
-		  "relayout-enabled": false,
-                  "actors": [],
                   "name": "Container 4",
                   "position": [
                     0,
@@ -187,12 +179,9 @@
             },
             {
               "type": "Control",
-	      "relayout-enabled": false,
               "actors": [
                 {
                   "type": "Control",
-		  "relayout-enabled": false,
-                  "actors": [],
                   "name": "Container 5",
                   "position": [
                     0,
@@ -231,12 +220,9 @@
                 },
                 {
                   "type": "Control",
-		  "relayout-enabled": false,
                   "actors": [
                     {
                       "type": "Control",
-		      "relayout-enabled": false,
-                      "actors": [],
                       "name": "Container 7",
                       "position": [
                         0,
@@ -312,12 +298,9 @@
                 },
                 {
                   "type": "Control",
-		  "relayout-enabled": false,
                   "actors": [
                     {
                       "type": "Control",
-		      "relayout-enabled": false,
-                      "actors": [],
                       "name": "Container 8",
                       "position": [
                         0,
@@ -356,12 +339,9 @@
                     },
                     {
                       "type": "Control",
-		      "relayout-enabled": false,
                       "actors": [
                         {
                           "type": "Control",
-			  "relayout-enabled": false,
-                          "actors": [],
                           "name": "Container 10",
                           "position": [
                             0,
@@ -548,12 +528,9 @@
         },
         {
           "type": "Control",
-	  "relayout-enabled": false,
           "actors": [
             {
               "type": "Control",
-	      "relayout-enabled": false,
-              "actors": [],
               "name": "Control 4",
               "position": [
                 0,
@@ -629,15 +606,12 @@
         },
         {
           "type": "Control",
-	  "relayout-enabled": false,
           "actors": [
             {
               "type": "Control",
-	      "relayout-enabled": false,
               "actors": [
                 {
                   "type": "Control",
-                  "actors": [],
                   "name": "Container 13",
                   "position": [
                     0,
@@ -713,8 +687,6 @@
             },
             {
               "type": "Control",
-	      "relayout-enabled": false,
-              "actors": [],
               "name": "Container 11",
               "position": [
                 0,
@@ -753,16 +725,12 @@
             },
             {
               "type": "Control",
-	      "relayout-enabled": false,
               "actors": [
                 {
                   "type": "Control",
-		  "relayout-enabled": false,
                   "actors": [
                     {
                       "type": "Control",
-		      "relayout-enabled": false,
-                      "actors": [],
                       "name": "Container 15",
                       "position": [
                         0,
@@ -838,8 +806,6 @@
                 },
                 {
                   "type": "Control",
-		  "relayout-enabled": false,
-                  "actors": [],
                   "name": "Container 16",
                   "position": [
                     0,
@@ -949,7 +915,27 @@
             0.3411764705882353,
             1
           ]
+        },
+            {
+      "type": "TextLabel",
+      "name": "text",
+      "parent-origin": "CENTER",
+      "anchor-point": "CENTER",
+      "text": "START",
+      "point-size": 20,
+      "signals": [
+        {
+          "name": "tapped",
+          "action": "play",
+          "animation": "Animation_1"
+        },
+        {
+          "name": "tapped",
+          "action": "play",
+          "animation": "HideText"
         }
+      ]
+    }
       ],
       "name": "Container 1",
       "position": [
@@ -986,26 +972,6 @@
         0.32941176470588235,
         1
       ]
-    },
-    {
-      "type": "TextLabel",
-      "name": "text",
-      "parent-origin": "CENTER",
-      "anchor-point": "CENTER",
-      "text": "START",
-      "point-size": 20,
-      "signals": [
-        {
-          "name": "tapped",
-          "action": "play",
-          "animation": "Animation_1"
-        },
-        {
-          "name": "tapped",
-          "action": "play",
-          "animation": "HideText"
-        }
-      ]
     }
   ],
   "animations": {
 /*
- * Copyright (c) 2014 Samsung Electronics Co., Ltd.
+ * Copyright (c) 2015 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.
@@ -19,10 +19,13 @@
     // A TextLabel with a red background
     {
       "type": "TextLabel",
+      "draw-mode": "OVERLAY",
       "text": "Hello World",
       "parent-origin": "TOP_CENTER",
       "anchor-point": "TOP_CENTER",
       "background-color": [1, 0, 0, 1],
+      "position": [0, 50, 0],
+      "point-size": 40,
       "size": [400, 150, 1]
     },
@@ -21,6 +21,7 @@
       "type":"TableView",
       "background-color": [0.5,0.5,0,1],
       "parent-origin": "CENTER",
+      "draw-mode": "OVERLAY",
       "size":[400,500,1],
       "cell-padding": [10, 5],
       "layout-rows": {  // set the height of the rows
@@ -49,6 +49,7 @@ extern &quot;C&quot;
 #define DALI_DEMO_STR_TITLE_SCRIPT_BASED_UI dgettext(DALI_DEMO_DOMAIN_LOCAL, "DALI_DEMO_STR_TITLE_SCRIPT_BASED_UI")
 #define DALI_DEMO_STR_TITLE_IMAGE_FITTING_SAMPLING dgettext(DALI_DEMO_DOMAIN_LOCAL, "DALI_DEMO_STR_TITLE_IMAGE_FITTING_SAMPLING")
 #define DALI_DEMO_STR_TITLE_IMAGE_SCALING dgettext(DALI_DEMO_DOMAIN_LOCAL, "DALI_DEMO_STR_TITLE_IMAGE_SCALING")
+#define DALI_DEMO_STR_TITLE_TEXT_FIELD dgettext(DALI_DEMO_DOMAIN_LOCAL, "DALI_DEMO_STR_TITLE_TEXT_FIELD")
 #define DALI_DEMO_STR_TITLE_TEXT_LABEL dgettext(DALI_DEMO_DOMAIN_LOCAL, "DALI_DEMO_STR_TITLE_TEXT_LABEL")
 #define DALI_DEMO_STR_TITLE_TEXT_LABEL_MULTI_LANGUAGE dgettext(DALI_DEMO_DOMAIN_LOCAL, "DALI_DEMO_STR_TITLE_TEXT_LABEL_MULTI_LANGUAGE")
 #define DALI_DEMO_STR_TITLE_EMOJI_TEXT dgettext(DALI_DEMO_DOMAIN_LOCAL, "DALI_DEMO_STR_TITLE_EMOJI_TEXT")
@@ -77,6 +78,7 @@ extern &quot;C&quot;
 #define DALI_DEMO_STR_TITLE_SCRIPT_BASED_UI           "Script Based UI"
 #define DALI_DEMO_STR_TITLE_IMAGE_FITTING_SAMPLING    "Image Fitting and Sampling"
 #define DALI_DEMO_STR_TITLE_IMAGE_SCALING             "Image Scaling Grid"
+#define DALI_DEMO_STR_TITLE_TEXT_FIELD                "Text Field"
 #define DALI_DEMO_STR_TITLE_TEXT_LABEL                "Text Label"
 #define DALI_DEMO_STR_TITLE_TEXT_LABEL_MULTI_LANGUAGE "Text Scripts"
 #define DALI_DEMO_STR_TITLE_EMOJI_TEXT                "Emoji Text"