From: Adeel Kazmi <adeel.kazmi@samsung.com>
Date: Mon, 20 Mar 2017 12:11:39 +0000 (-0700)
Subject: Merge "Change the double tap and long press events on top of no text actions to highl... 
X-Git-Tag: dali_1.2.32~9
X-Git-Url: http://review.tizen.org/git/?p=platform%2Fcore%2Fuifw%2Fdali-toolkit.git;a=commitdiff_plain;h=7f0a28e0f0da67178997e5a647bdc471e8dcb652;hp=de3eeac76074ae55de7a795e519d80a628c11628

Merge "Change the double tap and long press events on top of no text actions to highlight." into devel/master
---

diff --git a/automated-tests/src/dali-toolkit-internal/utc-Dali-DebugRendering.cpp b/automated-tests/src/dali-toolkit-internal/utc-Dali-DebugRendering.cpp
index 7348859..f853c90 100644
--- a/automated-tests/src/dali-toolkit-internal/utc-Dali-DebugRendering.cpp
+++ b/automated-tests/src/dali-toolkit-internal/utc-Dali-DebugRendering.cpp
@@ -41,7 +41,7 @@ const char* TEST_GIF_FILE_NAME = TEST_RESOURCE_DIR "/anim.gif";
 
 const std::string DEFAULT_FONT_DIR( "/resources/fonts" );
 
-void TestDebugVisual( Visual::Base& visual, Visual::Type actualType, Vector2 expectedNaturalSize )
+void TestDebugVisual( Visual::Base& visual, DevelVisual::Type actualType, Vector2 expectedNaturalSize )
 {
   DALI_TEST_CHECK( &typeid( Toolkit::Internal::WireframeVisual ) == &typeid( GetImplementation(visual) ) );
 
@@ -96,7 +96,7 @@ int UtcDaliDebugRenderingGetVisual1(void)
   propertyMap1.Insert(ColorVisual::Property::MIX_COLOR,  Color::BLUE);
   Visual::Base colorVisual = factory.CreateVisual(propertyMap1);
   DALI_TEST_CHECK( colorVisual );
-  TestDebugVisual( colorVisual, Visual::COLOR, Vector2::ZERO );
+  TestDebugVisual( colorVisual, DevelVisual::COLOR, Vector2::ZERO );
 
   // Test that border visual is replaced with debug visual
   Property::Map propertyMap2;
@@ -105,7 +105,7 @@ int UtcDaliDebugRenderingGetVisual1(void)
   propertyMap2.Insert(BorderVisual::Property::SIZE,  2.f);
   Visual::Base borderVisual = factory.CreateVisual(propertyMap2);
   DALI_TEST_CHECK( borderVisual );
-  TestDebugVisual( borderVisual, Visual::BORDER, Vector2::ZERO );
+  TestDebugVisual( borderVisual, DevelVisual::BORDER, Vector2::ZERO );
 
   // Test that gradient visual is replaced with debug visual
   Property::Map propertyMap3;
@@ -125,7 +125,7 @@ int UtcDaliDebugRenderingGetVisual1(void)
   propertyMap3.Insert(GradientVisual::Property::STOP_COLOR, stopColors);
   Visual::Base gradientVisual = factory.CreateVisual(propertyMap3);
   DALI_TEST_CHECK( gradientVisual );
-  TestDebugVisual( gradientVisual, Visual::GRADIENT, Vector2::ZERO );
+  TestDebugVisual( gradientVisual, DevelVisual::GRADIENT, Vector2::ZERO );
 
   // Test that image visual is replaced with debug visual
   Property::Map propertyMap4;
@@ -135,7 +135,7 @@ int UtcDaliDebugRenderingGetVisual1(void)
   propertyMap4.Insert( ImageVisual::Property::DESIRED_HEIGHT,  100.f );
   Visual::Base imageVisual = factory.CreateVisual( propertyMap4 );
   DALI_TEST_CHECK( imageVisual );
-  TestDebugVisual( imageVisual, Visual::IMAGE, Vector2( 50.f, 100.f ) );
+  TestDebugVisual( imageVisual, DevelVisual::IMAGE, Vector2( 50.f, 100.f ) );
 
   // Test that SVG visual is replaced with debug visual
   // TEST_SVG_FILE:
@@ -143,21 +143,21 @@ int UtcDaliDebugRenderingGetVisual1(void)
   //  <circle cx="50" cy="50" r="40" stroke="green" stroke-width="4" fill="yellow" />
   //  </svg>
   Property::Map propertyMap5;
-  propertyMap5.Insert( Visual::Property::TYPE,  Visual::IMAGE );
+  propertyMap5.Insert( Visual::Property::TYPE, DevelVisual::SVG );
   propertyMap5.Insert( ImageVisual::Property::URL,  TEST_SVG_FILE_NAME );
   Visual::Base svgVisual = factory.CreateVisual( propertyMap5 );
   DALI_TEST_CHECK( svgVisual );
-  TestDebugVisual( svgVisual, Visual::IMAGE, Vector2(100.f, 100.f) );
+  TestDebugVisual( svgVisual, DevelVisual::SVG, Vector2(100.f, 100.f) );
 
   // Test that AnimatedImageVisual is replaced with debug visual
   // TEST_GIF_FILE: anim.gif
   // resolution: 50*50, frame count: 4, frame delay: 0.2 second for each frame
   Property::Map propertyMap6;
-  propertyMap6.Insert( Visual::Property::TYPE,  Visual::IMAGE );
+  propertyMap6.Insert( Visual::Property::TYPE, DevelVisual::ANIMATED_IMAGE );
   propertyMap6.Insert( ImageVisual::Property::URL,  TEST_GIF_FILE_NAME );
   Visual::Base animatedImageVisual = factory.CreateVisual( propertyMap6 );
   DALI_TEST_CHECK( animatedImageVisual );
-  TestDebugVisual( animatedImageVisual, Visual::IMAGE, Vector2(50.f, 50.f) );
+  TestDebugVisual( animatedImageVisual, DevelVisual::ANIMATED_IMAGE, Vector2(50.f, 50.f) );
 
   // Test that text visual is replaced with debug visual
 
@@ -188,6 +188,15 @@ int UtcDaliDebugRenderingGetVisual1(void)
   const float height = textVisual.GetHeightForWidth( 40.f );
   DALI_TEST_EQUALS( height, 40.f, Math::MACHINE_EPSILON_1000, TEST_LOCATION );
 
+  // Test that NPatchVisual is replaced with debug visual
+  // TEST_NPATCH_FILE_NAME: image_01.9.jpg
+  Property::Map propertyMap8;
+  propertyMap8.Insert( Visual::Property::TYPE, DevelVisual::N_PATCH );
+  propertyMap8.Insert( ImageVisual::Property::URL,  TEST_NPATCH_FILE_NAME );
+  Visual::Base nPatchVisual = factory.CreateVisual( propertyMap8 );
+  DALI_TEST_CHECK( nPatchVisual );
+  TestDebugVisual( nPatchVisual, DevelVisual::N_PATCH, Vector2::ZERO );
+
   EnvironmentVariable::SetTestingEnvironmentVariable(false);
   END_TEST;
 }
@@ -208,7 +217,7 @@ int UtcDaliDebugRenderingGetVisual2(void)
 
   Visual::Base colorVisual = factory.CreateVisual( map);
   DALI_TEST_CHECK( colorVisual );
-  TestDebugVisual( colorVisual, Visual::COLOR, Vector2::ZERO );
+  TestDebugVisual( colorVisual, DevelVisual::COLOR, Vector2::ZERO );
 
   // Test that border visual is replaced with debug visual
   map.Clear();
@@ -217,18 +226,18 @@ int UtcDaliDebugRenderingGetVisual2(void)
   map[ BorderVisual::Property::SIZE   ] = 2.f;
   Visual::Base borderVisual = factory.CreateVisual( map );
   DALI_TEST_CHECK( borderVisual );
-  TestDebugVisual( borderVisual, Visual::BORDER, Vector2::ZERO );
+  TestDebugVisual( borderVisual, DevelVisual::BORDER, Vector2::ZERO );
 
   // Test that image visual is replaced with debug visual
   Image image = ResourceImage::New(TEST_IMAGE_FILE_NAME);
   Visual::Base imageVisual = factory.CreateVisual( image );
   DALI_TEST_CHECK( imageVisual );
-  TestDebugVisual( imageVisual, Visual::IMAGE, Vector2::ZERO);
+  TestDebugVisual( imageVisual, DevelVisual::IMAGE, Vector2::ZERO);
 
   // Test that n patch visual is replaced with debug visual
   Visual::Base nPatchVisual = factory.CreateVisual( TEST_NPATCH_FILE_NAME, ImageDimensions() );
   DALI_TEST_CHECK( nPatchVisual );
-  TestDebugVisual( nPatchVisual, Visual::IMAGE, Vector2::ZERO );
+  TestDebugVisual( nPatchVisual, DevelVisual::N_PATCH, Vector2::ZERO );
 
   EnvironmentVariable::SetTestingEnvironmentVariable(false);
   END_TEST;
diff --git a/automated-tests/src/dali-toolkit-styling/utc-Dali-StyleManager.cpp b/automated-tests/src/dali-toolkit-styling/utc-Dali-StyleManager.cpp
index 6a81e06..dc95a8e 100644
--- a/automated-tests/src/dali-toolkit-styling/utc-Dali-StyleManager.cpp
+++ b/automated-tests/src/dali-toolkit-styling/utc-Dali-StyleManager.cpp
@@ -30,6 +30,7 @@
 #include <dummy-control.h>
 #include <dali-toolkit/devel-api/controls/control-devel.h>
 #include <dali-toolkit/devel-api/visuals/text-visual-properties.h>
+#include <dali-toolkit/devel-api/visuals/visual-properties-devel.h>
 #include <dali-toolkit/devel-api/visual-factory/visual-factory.h>
 #include <dali-toolkit/devel-api/visual-factory/visual-base.h>
 
@@ -1249,13 +1250,13 @@ int UtcDaliStyleManagerSetSubState02(void)
   tet_infoline( "Changing state to FOCUSED - check visual changes\n");
 
   Visual::Base fgVisual1 = CheckVisual( dummyImpl, DummyControl::Property::FOREGROUND_VISUAL, Toolkit::Visual::GRADIENT, TEST_LOCATION);
-  Visual::Base focusVisual1 = CheckVisual( dummyImpl, DummyControl::Property::FOCUS_VISUAL, Toolkit::Visual::IMAGE, TEST_LOCATION);
+  Visual::Base focusVisual1 = CheckVisual( dummyImpl, DummyControl::Property::FOCUS_VISUAL, Toolkit::DevelVisual::N_PATCH, TEST_LOCATION);
 
   actor.SetProperty(DevelControl::Property::SUB_STATE, "SELECTED");
   tet_infoline( "Changing  substate to SELECTED - Expect no change\n");
 
   Visual::Base fgVisual2 = CheckVisual( dummyImpl, DummyControl::Property::FOREGROUND_VISUAL, Toolkit::Visual::GRADIENT, TEST_LOCATION);
-  Visual::Base focusVisual2 = CheckVisual( dummyImpl, DummyControl::Property::FOCUS_VISUAL, Toolkit::Visual::IMAGE, TEST_LOCATION);
+  Visual::Base focusVisual2 = CheckVisual( dummyImpl, DummyControl::Property::FOCUS_VISUAL, Toolkit::DevelVisual::N_PATCH, TEST_LOCATION);
 
   DALI_TEST_CHECK( fgVisual1 == fgVisual2 );
   DALI_TEST_CHECK( focusVisual1 == focusVisual2 );
diff --git a/automated-tests/src/dali-toolkit/utc-Dali-Visual.cpp b/automated-tests/src/dali-toolkit/utc-Dali-Visual.cpp
index fc94130..9e39e36 100644
--- a/automated-tests/src/dali-toolkit/utc-Dali-Visual.cpp
+++ b/automated-tests/src/dali-toolkit/utc-Dali-Visual.cpp
@@ -27,6 +27,7 @@
 #include <dali-toolkit/devel-api/visual-factory/transition-data.h>
 #include <dali-toolkit/devel-api/visuals/text-visual-properties.h>
 #include <dali-toolkit/devel-api/visuals/visual-properties-devel.h>
+#include <dali-toolkit/devel-api/visuals/image-visual-properties-devel.h>
 #include <dali-toolkit/devel-api/align-enums.h>
 #include <dali-toolkit/dali-toolkit.h>
 #include "dummy-control.h"
@@ -54,7 +55,8 @@ Property::Map DefaultTransform()
     .Add( Toolkit::DevelVisual::Transform::Property::SIZE, Vector2(1.0f, 1.0f) )
     .Add( Toolkit::DevelVisual::Transform::Property::ORIGIN, Toolkit::Align::CENTER )
     .Add( Toolkit::DevelVisual::Transform::Property::ANCHOR_POINT, Toolkit::Align::CENTER )
-    .Add( Toolkit::DevelVisual::Transform::Property::OFFSET_SIZE_MODE, Vector4::ZERO );
+    .Add( Toolkit::DevelVisual::Transform::Property::OFFSET_POLICY, Vector2( Toolkit::DevelVisual::Transform::Policy::RELATIVE, Toolkit::DevelVisual::Transform::Policy::RELATIVE ) )
+    .Add( Toolkit::DevelVisual::Transform::Property::SIZE_POLICY, Vector2( Toolkit::DevelVisual::Transform::Policy::RELATIVE, Toolkit::DevelVisual::Transform::Policy::RELATIVE ) );
   return transformMap;
 }
 
@@ -747,12 +749,15 @@ int UtcDaliVisualGetPropertyMap6(void)
   ToolkitTestApplication application;
   tet_infoline( "UtcDaliVisualGetPropertyMap6: NPatchVisual" );
 
+  Rect< int > border( 1, 1, 1, 1 );
+
   VisualFactory factory = VisualFactory::Get();
   Property::Map propertyMap;
-  propertyMap.Insert( Visual::Property::TYPE,  Visual::IMAGE );
+  propertyMap.Insert( Visual::Property::TYPE, DevelVisual::N_PATCH );
   propertyMap.Insert( "mixColor",  Color::MAGENTA );
   propertyMap.Insert( ImageVisual::Property::URL,  TEST_NPATCH_FILE_NAME );
   propertyMap.Insert( ImageVisual::Property::BORDER_ONLY,  true );
+  propertyMap.Insert( DevelImageVisual::Property::BORDER, border );
   Visual::Base nPatchVisual = factory.CreateVisual( propertyMap );
 
   Property::Map resultMap;
@@ -761,7 +766,40 @@ int UtcDaliVisualGetPropertyMap6(void)
   // check the property values from the returned map from visual
   Property::Value* value = resultMap.Find( Visual::Property::TYPE,  Property::INTEGER );
   DALI_TEST_CHECK( value );
-  DALI_TEST_CHECK( value->Get<int>() == Visual::IMAGE );
+  DALI_TEST_CHECK( value->Get<int>() == DevelVisual::N_PATCH );
+
+  value = resultMap.Find( DevelVisual::Property::MIX_COLOR,  Property::VECTOR4 );
+  DALI_TEST_CHECK( value );
+  DALI_TEST_CHECK( value->Get<Vector4>() == Color::MAGENTA );
+
+  value = resultMap.Find( ImageVisual::Property::URL,  Property::STRING );
+  DALI_TEST_CHECK( value );
+  DALI_TEST_CHECK( value->Get<std::string>() == TEST_NPATCH_FILE_NAME );
+
+  value = resultMap.Find( ImageVisual::Property::BORDER_ONLY,  Property::BOOLEAN );
+  DALI_TEST_CHECK( value );
+  DALI_TEST_CHECK( value->Get<bool>() );
+
+  value = resultMap.Find( DevelImageVisual::Property::BORDER,  Property::RECTANGLE );
+  DALI_TEST_CHECK( value );
+  DALI_TEST_CHECK( value->Get< Rect< int > >() == border );
+
+  Vector4 border1( 1.0f, 1.0f, 1.0f, 1.0f );
+
+  Property::Map propertyMap1;
+  propertyMap1.Insert( Visual::Property::TYPE, DevelVisual::N_PATCH );
+  propertyMap1.Insert( "mixColor",  Color::MAGENTA );
+  propertyMap1.Insert( ImageVisual::Property::URL,  TEST_NPATCH_FILE_NAME );
+  propertyMap1.Insert( ImageVisual::Property::BORDER_ONLY,  true );
+  propertyMap1.Insert( DevelImageVisual::Property::BORDER, border1 );
+  nPatchVisual = factory.CreateVisual( propertyMap1 );
+
+  nPatchVisual.CreatePropertyMap( resultMap );
+
+  // check the property values from the returned map from visual
+  value = resultMap.Find( Visual::Property::TYPE,  Property::INTEGER );
+  DALI_TEST_CHECK( value );
+  DALI_TEST_CHECK( value->Get<int>() == DevelVisual::N_PATCH );
 
   value = resultMap.Find( DevelVisual::Property::MIX_COLOR,  Property::VECTOR4 );
   DALI_TEST_CHECK( value );
@@ -775,6 +813,9 @@ int UtcDaliVisualGetPropertyMap6(void)
   DALI_TEST_CHECK( value );
   DALI_TEST_CHECK( value->Get<bool>() );
 
+  value = resultMap.Find( DevelImageVisual::Property::BORDER,  Property::RECTANGLE );
+  DALI_TEST_CHECK( value );
+  DALI_TEST_CHECK( value->Get< Rect< int > >() == border );
 
   END_TEST;
 }
@@ -787,7 +828,7 @@ int UtcDaliVisualGetPropertyMap7(void)
   // request SvgVisual with a property map
   VisualFactory factory = VisualFactory::Get();
   Property::Map propertyMap;
-  propertyMap.Insert( Visual::Property::TYPE,  Visual::IMAGE );
+  propertyMap.Insert( Visual::Property::TYPE, DevelVisual::SVG );
   propertyMap.Insert( DevelVisual::Property::MIX_COLOR, Color::WHITE );
   propertyMap.Insert( ImageVisual::Property::URL, TEST_SVG_FILE_NAME );
   Visual::Base svgVisual = factory.CreateVisual( propertyMap );
@@ -797,7 +838,7 @@ int UtcDaliVisualGetPropertyMap7(void)
   // check the property values from the returned map from a visual
   Property::Value* value = resultMap.Find( Visual::Property::TYPE,  Property::INTEGER );
   DALI_TEST_CHECK( value );
-  DALI_TEST_CHECK( value->Get<int>() == Visual::IMAGE );
+  DALI_TEST_CHECK( value->Get<int>() == DevelVisual::SVG );
 
   value = resultMap.Find( ImageVisual::Property::URL,  Property::STRING );
   DALI_TEST_CHECK( value );
@@ -810,7 +851,7 @@ int UtcDaliVisualGetPropertyMap7(void)
   // check the property values from the returned map from a visual
   value = resultMap.Find( Visual::Property::TYPE,  Property::INTEGER );
   DALI_TEST_CHECK( value );
-  DALI_TEST_CHECK( value->Get<int>() == Visual::IMAGE );
+  DALI_TEST_CHECK( value->Get<int>() == DevelVisual::SVG );
 
   value = resultMap.Find( ImageVisual::Property::URL,  Property::STRING );
   DALI_TEST_CHECK( value );
@@ -1041,34 +1082,33 @@ int UtcDaliVisualGetPropertyMap10(void)
 int UtcDaliVisualGetPropertyMap11(void)
 {
   ToolkitTestApplication application;
-  tet_infoline( "UtcDaliVisualGetPropertyMap7: AnimatedImageVisual" );
+  tet_infoline( "UtcDaliVisualGetPropertyMap11: AnimatedImageVisual" );
 
-  // request SvgVisual with a property map
+  // request AnimatedImageVisual with a property map
   VisualFactory factory = VisualFactory::Get();
-  Property::Map propertyMap;
-  Visual::Base svgVisual = factory.CreateVisual( Property::Map()
-                                                 .Add( Visual::Property::TYPE,  Visual::IMAGE )
+  Visual::Base animatedImageVisual = factory.CreateVisual( Property::Map()
+                                                 .Add( Visual::Property::TYPE, DevelVisual::ANIMATED_IMAGE )
                                                  .Add( ImageVisual::Property::URL, TEST_GIF_FILE_NAME ) );
 
   Property::Map resultMap;
-  svgVisual.CreatePropertyMap( resultMap );
+  animatedImageVisual.CreatePropertyMap( resultMap );
   // check the property values from the returned map from a visual
   Property::Value* value = resultMap.Find( Visual::Property::TYPE,  Property::INTEGER );
   DALI_TEST_CHECK( value );
-  DALI_TEST_CHECK( value->Get<int>() == Visual::IMAGE );
+  DALI_TEST_CHECK( value->Get<int>() == DevelVisual::ANIMATED_IMAGE );
 
   value = resultMap.Find( ImageVisual::Property::URL,  Property::STRING );
   DALI_TEST_CHECK( value );
   DALI_TEST_CHECK( value->Get<std::string>() == TEST_GIF_FILE_NAME );
 
-  // request SvgVisual with an URL
-  Visual::Base svgVisual2 = factory.CreateVisual( TEST_GIF_FILE_NAME, ImageDimensions() );
+  // request AnimatedImageVisual with an URL
+  Visual::Base animatedImageVisual2 = factory.CreateVisual( TEST_GIF_FILE_NAME, ImageDimensions() );
   resultMap.Clear();
-  svgVisual2.CreatePropertyMap( resultMap );
+  animatedImageVisual2.CreatePropertyMap( resultMap );
   // check the property values from the returned map from a visual
   value = resultMap.Find( Visual::Property::TYPE,  Property::INTEGER );
   DALI_TEST_CHECK( value );
-  DALI_TEST_CHECK( value->Get<int>() == Visual::IMAGE );
+  DALI_TEST_CHECK( value->Get<int>() == DevelVisual::ANIMATED_IMAGE );
 
   value = resultMap.Find( ImageVisual::Property::URL,  Property::STRING );
   DALI_TEST_CHECK( value );
@@ -1639,9 +1679,14 @@ int UtcDaliVisualGetTransform(void)
     DALI_TEST_CHECK( typeValue->Get<Vector2>() == Vector2(1.0f,1.0f) );
   }
   {
-    Property::Value* typeValue = map->Find( Toolkit::DevelVisual::Transform::Property::OFFSET_SIZE_MODE );
+    Property::Value* typeValue = map->Find( Toolkit::DevelVisual::Transform::Property::OFFSET_POLICY );
     DALI_TEST_CHECK( typeValue );
-    DALI_TEST_CHECK( typeValue->Get<Vector4>() == Vector4(0.0f,0.0f,0.0f,0.0f) );
+    DALI_TEST_CHECK( typeValue->Get< Vector2 >() == Vector2( Toolkit::DevelVisual::Transform::Policy::RELATIVE, Toolkit::DevelVisual::Transform::Policy::RELATIVE ) );
+  }
+  {
+    Property::Value* typeValue = map->Find( Toolkit::DevelVisual::Transform::Property::SIZE_POLICY );
+    DALI_TEST_CHECK( typeValue );
+    DALI_TEST_CHECK( typeValue->Get< Vector2 >() == Vector2( Toolkit::DevelVisual::Transform::Policy::RELATIVE, Toolkit::DevelVisual::Transform::Policy::RELATIVE ) );
   }
   {
     Property::Value* typeValue = map->Find( Toolkit::DevelVisual::Transform::Property::ORIGIN );
@@ -1662,7 +1707,7 @@ static void TestTransform( ToolkitTestApplication& application, Visual::Base vis
   Property::Map transform;
   transform.Insert( DevelVisual::Transform::Property::OFFSET, Vector2(10.0f, 10.0f) );
   transform.Insert( DevelVisual::Transform::Property::SIZE, Vector2(0.2f, 0.2f) );
-  transform.Insert( DevelVisual::Transform::Property::OFFSET_SIZE_MODE, Vector4(1.0f, 1.0f, 0.0f,0.0f) );
+  transform.Insert( DevelVisual::Transform::Property::OFFSET_POLICY, Vector2( Toolkit::DevelVisual::Transform::Policy::ABSOLUTE, Toolkit::DevelVisual::Transform::Policy::ABSOLUTE ) );
   transform.Insert( DevelVisual::Transform::Property::ORIGIN, "TOP_BEGIN" );
   transform.Insert( DevelVisual::Transform::Property::ANCHOR_POINT, Toolkit::Align::BOTTOM_END );
 
@@ -1685,9 +1730,14 @@ static void TestTransform( ToolkitTestApplication& application, Visual::Base vis
     DALI_TEST_EQUALS( typeValue->Get<Vector2>(), Vector2(0.2f,0.2f), TEST_LOCATION );
   }
   {
-    Property::Value* typeValue = map->Find( Toolkit::DevelVisual::Transform::Property::OFFSET_SIZE_MODE );
+    Property::Value* typeValue = map->Find( Toolkit::DevelVisual::Transform::Property::OFFSET_POLICY );
     DALI_TEST_CHECK( typeValue );
-    DALI_TEST_EQUALS( typeValue->Get<Vector4>(), Vector4(1.0f,1.0f,0.0f,0.0f), TEST_LOCATION );
+    DALI_TEST_EQUALS( typeValue->Get< Vector2 >(), Vector2( Toolkit::DevelVisual::Transform::Policy::ABSOLUTE, Toolkit::DevelVisual::Transform::Policy::ABSOLUTE ), TEST_LOCATION );
+  }
+  {
+    Property::Value* typeValue = map->Find( Toolkit::DevelVisual::Transform::Property::SIZE_POLICY );
+    DALI_TEST_CHECK( typeValue );
+    DALI_TEST_EQUALS( typeValue->Get< Vector2 >(), Vector2( Toolkit::DevelVisual::Transform::Policy::RELATIVE, Toolkit::DevelVisual::Transform::Policy::RELATIVE ), TEST_LOCATION );
   }
   {
     Property::Value* typeValue = map->Find( Toolkit::DevelVisual::Transform::Property::ORIGIN );
@@ -1745,7 +1795,7 @@ static void TestTransform( ToolkitTestApplication& application, Visual::Base vis
   transform = DefaultTransform();
   transform.Insert( DevelVisual::Transform::Property::OFFSET, Vector2(20.0f, 20.0f) );
   transform.Insert( DevelVisual::Transform::Property::SIZE, Vector2(100.0f, 100.0f) );
-  transform.Insert( DevelVisual::Transform::Property::OFFSET_SIZE_MODE, Vector4(0.0f, 0.0f, 1.0f,1.0f) );
+  transform.Insert( DevelVisual::Transform::Property::SIZE_POLICY, Vector2( Toolkit::DevelVisual::Transform::Policy::ABSOLUTE, Toolkit::DevelVisual::Transform::Policy::ABSOLUTE ) );
   visual.SetTransformAndSize( transform, Vector2(100, 100) );
   application.SendNotification();
   application.Render(0);
@@ -1927,6 +1977,44 @@ int UtcDaliVisualSetTransform7(void)
   END_TEST;
 }
 
+int UtcDaliVisualTestTransformPoliciesAsStrings(void)
+{
+  ToolkitTestApplication application;
+  tet_infoline( "UtcDaliVisualTestTransformPoliciesAsStrings: Use a ColorVisual and test the offset and size policies as strings" );
+
+  VisualFactory factory = VisualFactory::Get();
+  Property::Map propertyMap;
+  propertyMap.Insert(Visual::Property::TYPE,  Visual::COLOR);
+  propertyMap.Insert(ColorVisual::Property::MIX_COLOR,  Color::BLUE);
+  Visual::Base visual = factory.CreateVisual( propertyMap );
+
+  Property::Map transform;
+  transform[ "offsetPolicy" ] = Property::Array().Add( "ABSOLUTE" )
+                                                 .Add( "RELATIVE" );
+  transform[ "sizePolicy"   ] = Property::Array().Add( "RELATIVE" )
+                                                 .Add( "ABSOLUTE" );
+  visual.SetTransformAndSize( transform, Vector2(100, 100) );
+
+  Dali::Property::Map visualMap;
+  visual.CreatePropertyMap( visualMap );
+  Property::Value* value = visualMap.Find( Dali::Toolkit::DevelVisual::Property::TRANSFORM );
+  Dali::Property::Map* map = value->GetMap();
+  DALI_TEST_CHECK( map );
+
+  {
+    Property::Value* typeValue = map->Find( Toolkit::DevelVisual::Transform::Property::OFFSET_POLICY );
+    DALI_TEST_CHECK( typeValue );
+    DALI_TEST_EQUALS( typeValue->Get< Vector2 >(), Vector2( Toolkit::DevelVisual::Transform::Policy::ABSOLUTE, Toolkit::DevelVisual::Transform::Policy::RELATIVE ), TEST_LOCATION );
+  }
+  {
+    Property::Value* typeValue = map->Find( Toolkit::DevelVisual::Transform::Property::SIZE_POLICY );
+    DALI_TEST_CHECK( typeValue );
+    DALI_TEST_EQUALS( typeValue->Get< Vector2 >(), Vector2( Toolkit::DevelVisual::Transform::Policy::RELATIVE, Toolkit::DevelVisual::Transform::Policy::ABSOLUTE ), TEST_LOCATION );
+  }
+
+  END_TEST;
+}
+
 int UtcDaliNPatchVisualCustomShader(void)
 {
   ToolkitTestApplication application;
@@ -1941,7 +2029,7 @@ int UtcDaliNPatchVisualCustomShader(void)
   Property::Map transformMap;
   transformMap["size"] = Vector2( 0.5f, 0.5f ) ;
   transformMap["offset"] = Vector2( 20.0f, 0.0f ) ;
-  transformMap["offsetSizeMode"] = Vector4( 1.0f, 1.0f, 0.0f, 0.0f );
+  transformMap["offsetPolicy"] = Vector2( DevelVisual::Transform::Policy::ABSOLUTE, DevelVisual::Transform::Policy::ABSOLUTE );
   transformMap["anchorPoint"] = Align::CENTER;
   transformMap["origin"] = Align::CENTER;
   properties[DevelVisual::Property::TRANSFORM] = transformMap;
diff --git a/automated-tests/src/dali-toolkit/utc-Dali-VisualFactory.cpp b/automated-tests/src/dali-toolkit/utc-Dali-VisualFactory.cpp
index 4ad689f..29c4cc7 100644
--- a/automated-tests/src/dali-toolkit/utc-Dali-VisualFactory.cpp
+++ b/automated-tests/src/dali-toolkit/utc-Dali-VisualFactory.cpp
@@ -1,5 +1,5 @@
 /*
- * Copyright (c) 2016 Samsung Electronics Co., Ltd.
+ * 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.
@@ -26,6 +26,7 @@
 #include <dali/devel-api/images/nine-patch-image.h>
 #include <dali-toolkit/devel-api/align-enums.h>
 #include <dali-toolkit/devel-api/visuals/visual-properties-devel.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/dali-toolkit.h>
 #include "dummy-control.h"
@@ -61,7 +62,8 @@ Property::Map DefaultTransform()
     .Add( Toolkit::DevelVisual::Transform::Property::SIZE, Vector2(1.0f, 1.0f) )
     .Add( Toolkit::DevelVisual::Transform::Property::ORIGIN, Toolkit::Align::CENTER )
     .Add( Toolkit::DevelVisual::Transform::Property::ANCHOR_POINT, Toolkit::Align::CENTER )
-    .Add( Toolkit::DevelVisual::Transform::Property::OFFSET_SIZE_MODE, Vector4::ZERO );
+    .Add( Toolkit::DevelVisual::Transform::Property::OFFSET_POLICY, Vector2( Toolkit::DevelVisual::Transform::Policy::RELATIVE, Toolkit::DevelVisual::Transform::Policy::RELATIVE ) )
+    .Add( Toolkit::DevelVisual::Transform::Property::SIZE_POLICY, Vector2( Toolkit::DevelVisual::Transform::Policy::RELATIVE, Toolkit::DevelVisual::Transform::Policy::RELATIVE ) );
   return transformMap;
 }
 
@@ -844,7 +846,7 @@ int UtcDaliVisualFactoryGetNPatchVisual1(void)
   Integration::ResourcePointer ninePatchResource = CustomizeNinePatch( application, ninePatchImageWidth, ninePatchImageHeight, stretchRangesX, stretchRangesY );
 
   Property::Map propertyMap;
-  propertyMap.Insert( Visual::Property::TYPE,  Visual::IMAGE );
+  propertyMap.Insert( Visual::Property::TYPE, DevelVisual::N_PATCH );
   propertyMap.Insert( ImageVisual::Property::URL,  TEST_NPATCH_FILE_NAME );
   {
     tet_infoline( "whole grid" );
@@ -888,6 +890,52 @@ int UtcDaliVisualFactoryGetNPatchVisual1(void)
 int UtcDaliVisualFactoryGetNPatchVisual2(void)
 {
   ToolkitTestApplication application;
+  tet_infoline( "UtcDaliVisualFactoryGetNPatchVisual1: Request 9-patch visual with a Property::Map including border" );
+
+  VisualFactory factory = VisualFactory::Get();
+  DALI_TEST_CHECK( factory );
+
+  Property::Map propertyMap;
+  propertyMap.Insert( Visual::Property::TYPE, DevelVisual::N_PATCH );
+  propertyMap.Insert( ImageVisual::Property::URL, gImage_34_RGBA );
+  propertyMap.Insert( DevelImageVisual::Property::BORDER, Rect< int >( 2, 2, 2, 2 ) );
+  {
+    tet_infoline( "whole grid" );
+    Visual::Base visual = factory.CreateVisual( propertyMap );
+    DALI_TEST_CHECK( visual );
+
+    TestGlAbstraction& gl = application.GetGlAbstraction();
+    TraceCallStack& textureTrace = gl.GetTextureTrace();
+    textureTrace.Enable(true);
+
+    DummyControl actor = DummyControl::New();
+    TestVisualRender( application, actor, visual, 1u );
+
+    DALI_TEST_EQUALS( textureTrace.FindMethod("BindTexture"), true, TEST_LOCATION );
+  }
+
+  propertyMap.Insert( ImageVisual::Property::BORDER_ONLY,  true );
+  {
+    tet_infoline( "border only" );
+    Visual::Base visual = factory.CreateVisual( propertyMap );
+    DALI_TEST_CHECK( visual );
+
+    TestGlAbstraction& gl = application.GetGlAbstraction();
+    TraceCallStack& textureTrace = gl.GetTextureTrace();
+    textureTrace.Enable(true);
+
+    DummyControl actor = DummyControl::New();
+    TestVisualRender( application, actor, visual, 1u );
+
+    DALI_TEST_EQUALS( textureTrace.FindMethod("BindTexture"), true, TEST_LOCATION );
+  }
+
+  END_TEST;
+}
+
+int UtcDaliVisualFactoryGetNPatchVisual3(void)
+{
+  ToolkitTestApplication application;
   tet_infoline( "UtcDaliVisualFactoryGetNPatchVisual2: Request n-patch visual with a Property::Map" );
 
   VisualFactory factory = VisualFactory::Get();
@@ -907,7 +955,7 @@ int UtcDaliVisualFactoryGetNPatchVisual2(void)
   Integration::ResourcePointer ninePatchResource = CustomizeNinePatch( application, ninePatchImageWidth, ninePatchImageHeight, stretchRangesX, stretchRangesY );
 
   Property::Map propertyMap;
-  propertyMap.Insert( Visual::Property::TYPE,  Visual::IMAGE );
+  propertyMap.Insert( Visual::Property::TYPE, DevelVisual::N_PATCH );
   propertyMap.Insert( ImageVisual::Property::URL,  TEST_NPATCH_FILE_NAME );
   {
     Visual::Base visual = factory.CreateVisual( propertyMap );
@@ -952,7 +1000,7 @@ int UtcDaliVisualFactoryGetNPatchVisual2(void)
   END_TEST;
 }
 
-int UtcDaliVisualFactoryGetNPatchVisual3(void)
+int UtcDaliVisualFactoryGetNPatchVisual4(void)
 {
   ToolkitTestApplication application;
   tet_infoline( "UtcDaliVisualFactoryGetNPatchVisual3: Request 9-patch visual with an image url" );
@@ -993,7 +1041,7 @@ int UtcDaliVisualFactoryGetNPatchVisual3(void)
   END_TEST;
 }
 
-int UtcDaliVisualFactoryGetNPatchVisual4(void)
+int UtcDaliVisualFactoryGetNPatchVisual5(void)
 {
   ToolkitTestApplication application;
   tet_infoline( "UtcDaliVisualFactoryGetNPatchVisual4: Request n-patch visual with an image url" );
@@ -1073,7 +1121,7 @@ int UtcDaliVisualFactoryGetNPatchVisualN2(void)
   DALI_TEST_CHECK( factory );
 
   Property::Map propertyMap;
-  propertyMap.Insert( Visual::Property::TYPE,  Visual::IMAGE );
+  propertyMap.Insert( Visual::Property::TYPE, DevelVisual::N_PATCH );
   propertyMap.Insert( ImageVisual::Property::URL,  "ERROR.9.jpg" );
 
   Visual::Base visual = factory.CreateVisual( propertyMap );
diff --git a/dali-toolkit/devel-api/file.list b/dali-toolkit/devel-api/file.list
index 7702ef4..b9e6263 100755
--- a/dali-toolkit/devel-api/file.list
+++ b/dali-toolkit/devel-api/file.list
@@ -98,6 +98,7 @@ devel_api_visual_factory_header_files = \
 
 devel_api_visuals_header_files = \
   $(devel_api_src_dir)/visuals/text-visual-properties.h \
+  $(devel_api_src_dir)/visuals/image-visual-properties-devel.h \
   $(devel_api_src_dir)/visuals/visual-properties-devel.h
 
 devel_api_shadow_view_header_files = \
diff --git a/dali-toolkit/devel-api/visual-factory/visual-base.h b/dali-toolkit/devel-api/visual-factory/visual-base.h
index f7ffb51..4e2e0f5 100644
--- a/dali-toolkit/devel-api/visual-factory/visual-base.h
+++ b/dali-toolkit/devel-api/visual-factory/visual-base.h
@@ -1,7 +1,7 @@
 #ifndef DALI_TOOLKIT_VISUAL_BASE_H
 #define DALI_TOOLKIT_VISUAL_BASE_H
 /*
- * Copyright (c) 2016 Samsung Electronics Co., Ltd.
+ * 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.
@@ -52,27 +52,23 @@ namespace Visual
  * | transform               | MAP              |
  *
  * where \b customShader is a map with at least one of the following properties:
- * | %Property Name          | Type             | Required | Default | Description |
- * |-------------------------|------------------|----------|---------|-------------|
- * | vertexShader            | STRING           | No | "" | Vertex shader code|
- * | fragmentShader          | STRING           | No | "" | Fragment shader code|
- * | subdivideGridX          | INTEGER          | No | 1 | How to subdivide the grid along X |
- * | subdivideGridY          | INTEGER          | No | 1 | How to subdivide the grid along Y |
- * | shaderHints             | INTEGER or ARRAY of STRING | No | NONE | Bitmask of hints @sa Dali::Shader::Hint |
+ * | %Property Name          | Type                       | Required | Default | Description                             |
+ * |-------------------------|----------------------------|----------|---------|-----------------------------------------|
+ * | vertexShader            | STRING                     | No       | ""      | Vertex shader code                      |
+ * | fragmentShader          | STRING                     | No       | ""      | Fragment shader code                    |
+ * | subdivideGridX          | INTEGER                    | No       | 1       | How to subdivide the grid along X       |
+ * | subdivideGridY          | INTEGER                    | No       | 1       | How to subdivide the grid along Y       |
+ * | shaderHints             | INTEGER or ARRAY of STRING | No       | NONE    | Bitmask of hints @sa Dali::Shader::Hint |
  *
  * and \b transform is a map with the following properties:
- * | %Property Name          | Type             | Required | Default |Description |
- * |-------------------------|------------------|----------|---------|------------|
- * | offset                  | VECTOR2          | No | (0,0) | Offset of visual from origin |
- * | size                    | VECTOR2          | No | (1,1) | size of visual |
- * | origin                  | INTEGER or STRING | No | CENTER | origin of the visual @sa Dali::Toolkit::Align |
- * | anchorPoint             | INTEGER or STRING | No | CENTER | anchor point of the visual @sa Dali::Toolkit::Align |
- * | offsetSizeMode          | VECTOR4          | No | (0,0,0,0) | See below |
- *
- *
- * offsetSizeMode describes whether the offset and the size are
- * relative or absolute by using 0 or 1 respectively in the corresponding
- * components (offsetSizeMode.xy for offset.xy; offsetSizeMode.zw for size.xy).
+ * | %Property Name          | Type              | Required | Default                | Description                                         |
+ * |-------------------------|-------------------|----------|------------------------|-----------------------------------------------------|
+ * | offset                  | VECTOR2           | No       | (0,0)                  | Offset of visual from origin                        |
+ * | size                    | VECTOR2           | No       | (1,1)                  | size of visual                                      |
+ * | origin                  | INTEGER or STRING | No       | CENTER                 | origin of the visual @sa Dali::Toolkit::Align       |
+ * | anchorPoint             | INTEGER or STRING | No       | CENTER                 | anchor point of the visual @sa Dali::Toolkit::Align |
+ * | offsetPolicy            | VECTOR2           | No       | ( RELATIVE, RELATIVE ) | @sa Dali::Toolkit::DevelVisual::Transform::Policy   |
+ * | sizePolicy              | VECTOR2           | No       | ( RELATIVE, RELATIVE ) | @sa Dali::Toolkit::DevelVisual::Transform::Policy   |
  *
  * Relative means that the component describes a factor of the parent control size;
  * size.x = 1 means full width; size.y = 0.5 means half height.
diff --git a/dali-toolkit/devel-api/visuals/image-visual-properties-devel.h b/dali-toolkit/devel-api/visuals/image-visual-properties-devel.h
new file mode 100644
index 0000000..eb2ac49
--- /dev/null
+++ b/dali-toolkit/devel-api/visuals/image-visual-properties-devel.h
@@ -0,0 +1,68 @@
+#ifndef DALI_TOOLKIT_DEVEL_API_VISUALS_IMAGE_VISUAL_PROPERTIES_DEVEL_H
+#define DALI_TOOLKIT_DEVEL_API_VISUALS_IMAGE_VISUAL_PROPERTIES_DEVEL_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.
+ *
+ */
+
+// INTERNAL INCLUDES
+#include <dali-toolkit/public-api/visuals/image-visual-properties.h>
+
+namespace Dali
+{
+
+namespace Toolkit
+{
+
+namespace DevelImageVisual
+{
+
+namespace Property
+{
+
+enum Type
+{
+  URL                 = Dali::Toolkit::ImageVisual::Property::URL,
+  FITTING_MODE        = Dali::Toolkit::ImageVisual::Property::FITTING_MODE,
+  SAMPLING_MODE       = Dali::Toolkit::ImageVisual::Property::SAMPLING_MODE,
+  DESIRED_WIDTH       = Dali::Toolkit::ImageVisual::Property::DESIRED_WIDTH,
+  DESIRED_HEIGHT      = Dali::Toolkit::ImageVisual::Property::DESIRED_HEIGHT,
+  SYNCHRONOUS_LOADING = Dali::Toolkit::ImageVisual::Property::SYNCHRONOUS_LOADING,
+  BORDER_ONLY         = Dali::Toolkit::ImageVisual::Property::BORDER_ONLY,
+  PIXEL_AREA          = Dali::Toolkit::ImageVisual::Property::PIXEL_AREA,
+  WRAP_MODE_U         = Dali::Toolkit::ImageVisual::Property::WRAP_MODE_U,
+  WRAP_MODE_V         = Dali::Toolkit::ImageVisual::Property::WRAP_MODE_V,
+
+  /**
+   * @brief The border of the image
+   * @details Name "border", type Property::RECTANGLE or Property::VECTOR4
+   *          The border of the image in the order: left, right, bottom, top.
+   *
+   * @note Optional.
+   * @note For N-Patch images only.
+   */
+  BORDER = WRAP_MODE_V + 1,
+};
+
+} //namespace Property
+
+} // namespace DevelImageVisual
+
+} // namespace Toolkit
+
+} // namespace Dali
+
+#endif // DALI_TOOLKIT_DEVEL_API_VISUALS_IMAGE_VISUAL_PROPERTIES_DEVEL_H
diff --git a/dali-toolkit/devel-api/visuals/visual-properties-devel.h b/dali-toolkit/devel-api/visuals/visual-properties-devel.h
index b70d254..adecf39 100644
--- a/dali-toolkit/devel-api/visuals/visual-properties-devel.h
+++ b/dali-toolkit/devel-api/visuals/visual-properties-devel.h
@@ -2,7 +2,7 @@
 #define DALI_TOOLKIT_DEVEL_API_VISUALS_VISUAL_PROPERTIES_DEVEL_H
 
 /*
- * Copyright (c) 2016 Samsung Electronics Co., Ltd.
+ * 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.
@@ -35,15 +35,18 @@ namespace DevelVisual
  */
 enum Type
 {
-  BORDER    = Dali::Toolkit::Visual::BORDER,
-  COLOR     = Dali::Toolkit::Visual::COLOR,
-  GRADIENT  = Dali::Toolkit::Visual::GRADIENT,
-  IMAGE     = Dali::Toolkit::Visual::IMAGE,
-  MESH      = Dali::Toolkit::Visual::MESH,
-  PRIMITIVE = Dali::Toolkit::Visual::PRIMITIVE,
-  WIREFRAME = Dali::Toolkit::Visual::WIREFRAME,
-
-  TEXT      = WIREFRAME + 1, ///< Renders text.
+  BORDER         = Dali::Toolkit::Visual::BORDER,
+  COLOR          = Dali::Toolkit::Visual::COLOR,
+  GRADIENT       = Dali::Toolkit::Visual::GRADIENT,
+  IMAGE          = Dali::Toolkit::Visual::IMAGE,
+  MESH           = Dali::Toolkit::Visual::MESH,
+  PRIMITIVE      = Dali::Toolkit::Visual::PRIMITIVE,
+  WIREFRAME      = Dali::Toolkit::Visual::WIREFRAME,
+
+  TEXT           = WIREFRAME + 1, ///< Renders text.
+  N_PATCH        = WIREFRAME + 2, ///< Renders an n-patch image.
+  SVG            = WIREFRAME + 3, ///< Renders an SVG image.
+  ANIMATED_IMAGE = WIREFRAME + 4  ///< Renders a animated image.
 };
 
 namespace Property
@@ -91,27 +94,41 @@ enum Type
   OPACITY = SHADER + 4
 };
 
-} //namespace Property
+} // namespace Property
 
 namespace Transform
 {
 
+/**
+ * @brief Policies used by the transform for the offset or size.
+ */
+namespace Policy
+{
+
+enum Type
+{
+  RELATIVE = 0,   ///< Relative to the control (percentage [0.0f to 1.0f] of the control).
+  ABSOLUTE = 1    ///< Absolute value in world units.
+};
+
+} // namespace Policy
+
 namespace Property
 {
 
 enum Type
 {
   /**
-   * @brief Offset of the visual. It can be either relative (percentage of the parent)
-   * or absolute (in world units).
+   * @brief Offset of the visual, which can be either relative (percentage [0.0f to 1.0f] of the parent) or absolute (in world units).
    * @details Name "offset", type Property::VECTOR2
+   * @see OFFSET_POLICY
    */
   OFFSET,
 
   /**
-   * @brief Size of the visual. It can be either relative (percentage of the parent)
-   * or absolute (in world units).
+   * @brief Size of the visual, which can be either relative (percentage [0.0f to 1.0f] of the parent) or absolute (in world units).
    * @details Name "size", type Property::VECTOR2
+   * @see SIZE_POLICY
    */
   SIZE,
 
@@ -130,15 +147,50 @@ enum Type
   ANCHOR_POINT,
 
   /**
-   * @brief Indicates which components of the offset and size are relative
-   * (percentage of the parent) or absolute (in world units).
-   * 0 indicates the component is relative, and 1 absolute.
-   * @details Name "offsetSizeMode", type Property::VECTOR4
+   * @brief Whether the x or y OFFSET values are relative (percentage [0.0f to 1.0f] of the control) or absolute (in world units).
+   * @details Name "offsetPolicy", type Vector2 or Property::ARRAY of Property::STRING.
+   *          If Property::ARRAY then 2 strings expected for the x and y.
+   *
+   * C++:
+   * @code
+   * control.SetProperty( ..., // Some visual based property
+   *                      Property::Map().Add( ... ) // Properties to set up visual
+   *                                     .Add( DevelVisual::Property::TRANSFORM,
+   *                                           Property::Array().Add( DevelVisual::Transform::Property::OFFSET_POLICY, Vector2( Policy::ABSOLUTE, Policy::RELATIVE ) ) )
+   *                                                            .Add( DevelVisual::Transform::Property::OFFSET, Vector2( 10, 1.0f ) ) );
+   * @endcode
+   *
+   * JSON:
+   * @code
+   * {
+   *   ...
+   *   "transition":
+   *   {
+   *     "offsetPolicy" : [ "ABSOLUTE", "RELATIVE" ],
+   *     "offset" : [ 10, 1.0 ]
+   *   }
+   *   ...
+   * }
+   *
+   * @endcode
+   * @see Policy::Type
+   * @note By default, both the x and the y offset is RELATIVE.
+   */
+  OFFSET_POLICY,
+
+  /**
+   * @brief Whether the width or height SIZE values are relative (percentage [0.0f to 1.0f] of the control) or absolute (in world units).
+   * @details Name "sizePolicy", type Vector2 or Property::ARRAY of Property::STRING.
+   *          If Property::ARRAY then 2 strings expected for the width and height.
+   *
+   * @see Policy::Type
+   * @see OFFSET_POLICY for example
+   * @note By default, both the width and the height is RELATIVE to the control's size.
    */
-  OFFSET_SIZE_MODE
+  SIZE_POLICY,
 };
 
-} //namespace Property
+} // namespace Property
 
 } // namespace Transform
 
diff --git a/dali-toolkit/internal/controls/buttons/button-impl.cpp b/dali-toolkit/internal/controls/buttons/button-impl.cpp
index a8ab543..79ac7db 100644
--- a/dali-toolkit/internal/controls/buttons/button-impl.cpp
+++ b/dali-toolkit/internal/controls/buttons/button-impl.cpp
@@ -1,5 +1,5 @@
 /*
- * Copyright (c) 2016 Samsung Electronics Co., Ltd.
+ * 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.
@@ -980,7 +980,7 @@ void Button::OnRelayout( const Vector2& size, RelayoutContainer& container )
     Property::Map visualTransform;
 
     visualTransform.Add( Toolkit::DevelVisual::Transform::Property::SIZE, size )
-                   .Add( Toolkit::DevelVisual::Transform::Property::OFFSET_SIZE_MODE, Vector4( 0.0f, 0.0f, 1.0f, 1.0f) );  // Use relative size
+                   .Add( Toolkit::DevelVisual::Transform::Property::SIZE_POLICY, Vector2( DevelVisual::Transform::Policy::ABSOLUTE, DevelVisual::Transform::Policy::ABSOLUTE ) );
 
     currentBackGroundVisual.SetTransformAndSize( visualTransform, size );
   }
@@ -993,7 +993,8 @@ void Button::OnRelayout( const Vector2& size, RelayoutContainer& container )
 
     visualTransform.Add( Toolkit::DevelVisual::Transform::Property::SIZE, visualSize )
                    .Add( Toolkit::DevelVisual::Transform::Property::OFFSET, visualPosition )
-                   .Add( Toolkit::DevelVisual::Transform::Property::OFFSET_SIZE_MODE, Vector4( 1.0f, 1.0f, 1.0f, 1.0f) )  // Use absolute size
+                   .Add( Toolkit::DevelVisual::Transform::Property::OFFSET_POLICY, Vector2( DevelVisual::Transform::Policy::ABSOLUTE, DevelVisual::Transform::Policy::ABSOLUTE ) )
+                   .Add( Toolkit::DevelVisual::Transform::Property::SIZE_POLICY, Vector2( DevelVisual::Transform::Policy::ABSOLUTE, DevelVisual::Transform::Policy::ABSOLUTE ) )
                    .Add( Toolkit::DevelVisual::Transform::Property::ORIGIN, Toolkit::Align::TOP_BEGIN )
                    .Add( Toolkit::DevelVisual::Transform::Property::ANCHOR_POINT, visualAnchorPoint );
 
@@ -1023,7 +1024,8 @@ void Button::OnRelayout( const Vector2& size, RelayoutContainer& container )
       Property::Map textVisualTransform;
       textVisualTransform.Add( Toolkit::DevelVisual::Transform::Property::SIZE, preSize )
                          .Add( Toolkit::DevelVisual::Transform::Property::OFFSET, labelPosition )
-                         .Add( Toolkit::DevelVisual::Transform::Property::OFFSET_SIZE_MODE, Vector4( 1.0f, 1.0f, 1.0f,1.0f ) ) // Use absolute size
+                         .Add( Toolkit::DevelVisual::Transform::Property::OFFSET_POLICY, Vector2( DevelVisual::Transform::Policy::ABSOLUTE, DevelVisual::Transform::Policy::ABSOLUTE ) )
+                         .Add( Toolkit::DevelVisual::Transform::Property::SIZE_POLICY, Vector2( DevelVisual::Transform::Policy::ABSOLUTE, DevelVisual::Transform::Policy::ABSOLUTE ) )
                          .Add( Toolkit::DevelVisual::Transform::Property::ORIGIN, Toolkit::Align::TOP_BEGIN )
                          .Add( Toolkit::DevelVisual::Transform::Property::ANCHOR_POINT, visualAnchorPoint );
 
diff --git a/dali-toolkit/internal/controls/buttons/toggle-button-impl.cpp b/dali-toolkit/internal/controls/buttons/toggle-button-impl.cpp
index 555cb7b..0e2b58c 100755
--- a/dali-toolkit/internal/controls/buttons/toggle-button-impl.cpp
+++ b/dali-toolkit/internal/controls/buttons/toggle-button-impl.cpp
@@ -324,7 +324,8 @@ void ToggleButton::RelayoutVisual( Property::Index index, const Vector2& size )
     Property::Map visualTransform;
     visualTransform.Add( Toolkit::DevelVisual::Transform::Property::SIZE, visualSize )
                    .Add( Toolkit::DevelVisual::Transform::Property::OFFSET, visualPosition )
-                   .Add( Toolkit::DevelVisual::Transform::Property::OFFSET_SIZE_MODE, Vector4( 1.0f, 1.0f, 1.0f, 1.0f ) )  // Use absolute size
+                   .Add( Toolkit::DevelVisual::Transform::Property::OFFSET_POLICY, Vector2( DevelVisual::Transform::Policy::ABSOLUTE, DevelVisual::Transform::Policy::ABSOLUTE ) )
+                   .Add( Toolkit::DevelVisual::Transform::Property::SIZE_POLICY, Vector2( DevelVisual::Transform::Policy::ABSOLUTE, DevelVisual::Transform::Policy::ABSOLUTE ) )
                    .Add( Toolkit::DevelVisual::Transform::Property::ORIGIN, Toolkit::Align::CENTER )
                    .Add( Toolkit::DevelVisual::Transform::Property::ANCHOR_POINT, Toolkit::Align::CENTER );
 
diff --git a/dali-toolkit/internal/controls/progress-bar/progress-bar-impl.cpp b/dali-toolkit/internal/controls/progress-bar/progress-bar-impl.cpp
index 05005f5..cddfa35 100755
--- a/dali-toolkit/internal/controls/progress-bar/progress-bar-impl.cpp
+++ b/dali-toolkit/internal/controls/progress-bar/progress-bar-impl.cpp
@@ -1,5 +1,5 @@
 /*
- * Copyright (c) 2016 Samsung Electronics Co., Ltd.
+ * 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.
@@ -142,7 +142,9 @@ void ProgressBar::OnRelayout( const Vector2& size, RelayoutContainer& container
     Property::Map visualTransform;
 
     visualTransform.Add( Toolkit::DevelVisual::Transform::Property::SIZE, trackSize )
-                   .Add( Toolkit::DevelVisual::Transform::Property::OFFSET_SIZE_MODE, Vector4( 1.0f, 1.0f, 1.0f, 1.0f ) );  // Use Absolute size
+                   .Add( Toolkit::DevelVisual::Transform::Property::OFFSET_POLICY, Vector2( DevelVisual::Transform::Policy::ABSOLUTE, DevelVisual::Transform::Policy::ABSOLUTE ) )
+                   .Add( Toolkit::DevelVisual::Transform::Property::SIZE_POLICY, Vector2( DevelVisual::Transform::Policy::ABSOLUTE, DevelVisual::Transform::Policy::ABSOLUTE ) );
+
     trackVisual.SetTransformAndSize( visualTransform, trackSize );
   }
 
@@ -151,7 +153,8 @@ void ProgressBar::OnRelayout( const Vector2& size, RelayoutContainer& container
     Property::Map visualTransform;
 
     visualTransform.Add( Toolkit::DevelVisual::Transform::Property::SIZE, Vector2( mDomain.from.x + mSecondaryProgressValue * ( mDomain.to.x - mDomain.from.x ), trackSize.height  ) )
-                   .Add( Toolkit::DevelVisual::Transform::Property::OFFSET_SIZE_MODE, Vector4( 1.0f, 1.0f, 1.0f, 1.0f ) )  // Use Absolute size
+                   .Add( Toolkit::DevelVisual::Transform::Property::OFFSET_POLICY, Vector2( DevelVisual::Transform::Policy::ABSOLUTE, DevelVisual::Transform::Policy::ABSOLUTE ) )
+                   .Add( Toolkit::DevelVisual::Transform::Property::SIZE_POLICY, Vector2( DevelVisual::Transform::Policy::ABSOLUTE, DevelVisual::Transform::Policy::ABSOLUTE ) )
                    .Add( Toolkit::DevelVisual::Transform::Property::ORIGIN, Toolkit::Align::TOP_BEGIN )
                    .Add( Toolkit::DevelVisual::Transform::Property::ANCHOR_POINT, Toolkit::Align::TOP_BEGIN );
     secondProgressVisual.SetTransformAndSize( visualTransform, trackSize );
@@ -162,7 +165,8 @@ void ProgressBar::OnRelayout( const Vector2& size, RelayoutContainer& container
     Property::Map visualTransform;
 
     visualTransform.Add( Toolkit::DevelVisual::Transform::Property::SIZE, Vector2( mDomain.from.x + mProgressValue * ( mDomain.to.x - mDomain.from.x ), trackSize.height ) )
-                   .Add( Toolkit::DevelVisual::Transform::Property::OFFSET_SIZE_MODE, Vector4( 1.0f, 1.0f, 1.0f, 1.0f ) )  // Use Absolute size
+                   .Add( Toolkit::DevelVisual::Transform::Property::OFFSET_POLICY, Vector2( DevelVisual::Transform::Policy::ABSOLUTE, DevelVisual::Transform::Policy::ABSOLUTE ) )
+                   .Add( Toolkit::DevelVisual::Transform::Property::SIZE_POLICY, Vector2( DevelVisual::Transform::Policy::ABSOLUTE, DevelVisual::Transform::Policy::ABSOLUTE ) )
                    .Add( Toolkit::DevelVisual::Transform::Property::ORIGIN, Toolkit::Align::TOP_BEGIN )
                    .Add( Toolkit::DevelVisual::Transform::Property::ANCHOR_POINT, Toolkit::Align::TOP_BEGIN );
     progressVisual.SetTransformAndSize( visualTransform, trackSize );
@@ -173,8 +177,8 @@ void ProgressBar::OnRelayout( const Vector2& size, RelayoutContainer& container
     Property::Map visualTransform;
 
     visualTransform.Add( Toolkit::DevelVisual::Transform::Property::SIZE, trackSize )
-                   .Add( Toolkit::DevelVisual::Transform::Property::OFFSET_SIZE_MODE, Vector4( 1.0f, 1.0f, 1.0f, 1.0f ) );  // Use Absolute size
-
+                   .Add( Toolkit::DevelVisual::Transform::Property::OFFSET_POLICY, Vector2( DevelVisual::Transform::Policy::ABSOLUTE, DevelVisual::Transform::Policy::ABSOLUTE ) )
+                   .Add( Toolkit::DevelVisual::Transform::Property::SIZE_POLICY, Vector2( DevelVisual::Transform::Policy::ABSOLUTE, DevelVisual::Transform::Policy::ABSOLUTE ) );
     labelVisual.SetTransformAndSize( visualTransform, trackSize );
   }
 
@@ -183,7 +187,8 @@ void ProgressBar::OnRelayout( const Vector2& size, RelayoutContainer& container
     Property::Map visualTransform;
 
     visualTransform.Add( Toolkit::DevelVisual::Transform::Property::SIZE, trackSize )
-                   .Add( Toolkit::DevelVisual::Transform::Property::OFFSET_SIZE_MODE, Vector4( 1.0f, 1.0f, 1.0f, 1.0f ) );  // Use Absolute size
+                   .Add( Toolkit::DevelVisual::Transform::Property::OFFSET_POLICY, Vector2( DevelVisual::Transform::Policy::ABSOLUTE, DevelVisual::Transform::Policy::ABSOLUTE ) )
+                   .Add( Toolkit::DevelVisual::Transform::Property::SIZE_POLICY, Vector2( DevelVisual::Transform::Policy::ABSOLUTE, DevelVisual::Transform::Policy::ABSOLUTE ) );
     indeterminateVisual.SetTransformAndSize( visualTransform, trackSize );
   }
 
diff --git a/dali-toolkit/internal/visuals/animated-image/animated-image-visual.cpp b/dali-toolkit/internal/visuals/animated-image/animated-image-visual.cpp
index 0031bc3..2512baf 100644
--- a/dali-toolkit/internal/visuals/animated-image/animated-image-visual.cpp
+++ b/dali-toolkit/internal/visuals/animated-image/animated-image-visual.cpp
@@ -101,7 +101,7 @@ void AnimatedImageVisual::DoCreatePropertyMap( Property::Map& map ) const
 {
   map.Clear();
 
-  map.Insert( Toolkit::DevelVisual::Property::TYPE, Toolkit::Visual::IMAGE );
+  map.Insert( Toolkit::DevelVisual::Property::TYPE, Toolkit::DevelVisual::ANIMATED_IMAGE );
 
   if( !mImageUrl.empty() )
   {
diff --git a/dali-toolkit/internal/visuals/npatch-loader.cpp b/dali-toolkit/internal/visuals/npatch-loader.cpp
index 6e3c8ec..5da7bd1 100644
--- a/dali-toolkit/internal/visuals/npatch-loader.cpp
+++ b/dali-toolkit/internal/visuals/npatch-loader.cpp
@@ -21,6 +21,7 @@
 // EXTERNAL HEADER
 #include <dali/devel-api/common/hash.h>
 #include <dali/devel-api/images/texture-set-image.h>
+#include <dali-toolkit/public-api/image-loader/sync-image-loader.h>
 
 namespace Dali
 {
@@ -39,7 +40,7 @@ NPatchLoader::~NPatchLoader()
 {
 }
 
-std::size_t NPatchLoader::Load( const std::string& url )
+std::size_t NPatchLoader::Load( const std::string& url, const Rect< int >& border )
 {
   std::size_t hash = CalculateHash( url );
   OwnerContainer< Data* >::SizeType index = UNINITIALIZED_ID;
@@ -56,26 +57,62 @@ std::size_t NPatchLoader::Load( const std::string& url )
     }
   }
   // got to the end so no match, decode N patch and append new item to cache
-  NinePatchImage ninePatch = NinePatchImage::New( url );
-  if( ninePatch )
+  if( border == Rect< int >( 0, 0, 0, 0 ) )
   {
-    BufferImage croppedImage = ninePatch.CreateCroppedBufferImage();
-    if( croppedImage )
+    NinePatchImage ninePatch = NinePatchImage::New( url );
+    if( ninePatch )
+    {
+      BufferImage croppedImage = ninePatch.CreateCroppedBufferImage();
+      if( croppedImage )
+      {
+        Data* data = new Data();
+        data->hash = hash;
+        data->url = url;
+        data->textureSet = TextureSet::New();
+        TextureSetImage( data->textureSet, 0u, croppedImage );
+        data->croppedWidth = croppedImage.GetWidth();
+        data->croppedHeight = croppedImage.GetHeight();
+        data->stretchPixelsX = ninePatch.GetStretchPixelsX();
+        data->stretchPixelsY = ninePatch.GetStretchPixelsY();
+        mCache.PushBack( data );
+
+        return mCache.Count(); // valid ids start from 1u
+      }
+    }
+  }
+  else
+  {
+    // Load image from file
+    PixelData pixels = SyncImageLoader::Load( url );
+    if( pixels )
     {
       Data* data = new Data();
       data->hash = hash;
       data->url = url;
+      data->croppedWidth = pixels.GetWidth();
+      data->croppedHeight = pixels.GetHeight();
+
+      Texture texture = Texture::New( TextureType::TEXTURE_2D, pixels.GetPixelFormat(), pixels.GetWidth(), pixels.GetHeight() );
+      texture.Upload( pixels, 0, 0, 0, 0, pixels.GetWidth(), pixels.GetHeight() );
+
       data->textureSet = TextureSet::New();
-      TextureSetImage( data->textureSet, 0u, croppedImage );
-      data->croppedWidth = croppedImage.GetWidth();
-      data->croppedHeight = croppedImage.GetHeight();
-      data->stretchPixelsX = ninePatch.GetStretchPixelsX();
-      data->stretchPixelsY = ninePatch.GetStretchPixelsY();
+      data->textureSet.SetTexture( 0u, texture );
+
+      NinePatchImage::StretchRanges stretchRangesX;
+      stretchRangesX.PushBack( Uint16Pair( border.left, data->croppedWidth - border.right ) );
+
+      NinePatchImage::StretchRanges stretchRangesY;
+      stretchRangesY.PushBack( Uint16Pair( border.top, data->croppedHeight - border.bottom ) );
+
+      data->stretchPixelsX = stretchRangesX;
+      data->stretchPixelsY = stretchRangesY;
+
       mCache.PushBack( data );
 
       return mCache.Count(); // valid ids start from 1u
     }
   }
+
   return 0u;
 }
 
diff --git a/dali-toolkit/internal/visuals/npatch-loader.h b/dali-toolkit/internal/visuals/npatch-loader.h
index 0d9a1c2..61ec60d 100644
--- a/dali-toolkit/internal/visuals/npatch-loader.h
+++ b/dali-toolkit/internal/visuals/npatch-loader.h
@@ -80,9 +80,10 @@ public:
    * @brief Retrieve a texture matching the n-patch url.
    *
    * @param [in] url to retrieve
+   * @param [in] border The border size of the image
    * @return id of the texture.
    */
-  std::size_t Load( const std::string& url );
+  std::size_t Load( const std::string& url, const Rect< int >& border );
 
   /**
    * @brief Retrieve N patch data matching to an id
diff --git a/dali-toolkit/internal/visuals/npatch/npatch-visual.cpp b/dali-toolkit/internal/visuals/npatch/npatch-visual.cpp
index 31e6344..9b94eb5 100644
--- a/dali-toolkit/internal/visuals/npatch/npatch-visual.cpp
+++ b/dali-toolkit/internal/visuals/npatch/npatch-visual.cpp
@@ -27,6 +27,7 @@
 // INTERNAL INCLUDES
 #include <dali-toolkit/public-api/visuals/image-visual-properties.h>
 #include <dali-toolkit/devel-api/visuals/visual-properties-devel.h>
+#include <dali-toolkit/devel-api/visuals/image-visual-properties-devel.h>
 #include <dali-toolkit/internal/visuals/npatch-loader.h>
 #include <dali-toolkit/internal/visuals/visual-factory-impl.h>
 #include <dali-toolkit/internal/visuals/visual-factory-cache.h>
@@ -46,7 +47,8 @@ namespace Internal
 
 namespace
 {
-const char * const BORDER_ONLY("borderOnly");
+const char * const BORDER_ONLY( "borderOnly" );
+const char * const BORDER( "border" );
 
 const char* VERTEX_SHADER = DALI_COMPOSE_SHADER(
   attribute mediump vec2 aPosition;\n
@@ -264,7 +266,7 @@ void NPatchVisual::GetNaturalSize( Vector2& naturalSize )
   // load now if not already loaded
   if( NPatchLoader::UNINITIALIZED_ID == mId )
   {
-    mId = mLoader.Load( mImageUrl );
+    mId = mLoader.Load( mImageUrl, mBorder );
   }
   const NPatchLoader::Data* data;
   if( mLoader.GetNPatchData( mId, data ) )
@@ -283,6 +285,20 @@ void NPatchVisual::DoSetProperties( const Property::Map& propertyMap )
   {
     borderOnlyValue->Get( mBorderOnly );
   }
+
+  Property::Value* borderValue = propertyMap.Find( Toolkit::DevelImageVisual::Property::BORDER, BORDER );
+  if( borderValue && ! borderValue->Get( mBorder ) ) // If value exists and is rect, just set mBorder
+  {
+    // Not a rect so try vector4
+    Vector4 border;
+    if( borderValue->Get( border ) )
+    {
+      mBorder.left = static_cast< int >( border.x );
+      mBorder.right = static_cast< int >( border.y );
+      mBorder.bottom = static_cast< int >( border.z );
+      mBorder.top = static_cast< int >( border.w );
+    }
+  }
 }
 
 void NPatchVisual::DoSetOnStage( Actor& actor )
@@ -290,7 +306,7 @@ void NPatchVisual::DoSetOnStage( Actor& actor )
   // load when first go on stage
   if( NPatchLoader::UNINITIALIZED_ID == mId )
   {
-    mId = mLoader.Load( mImageUrl );
+    mId = mLoader.Load( mImageUrl, mBorder );
   }
 
   Geometry geometry = CreateGeometry();
@@ -319,9 +335,10 @@ void NPatchVisual::OnSetTransform()
 void NPatchVisual::DoCreatePropertyMap( Property::Map& map ) const
 {
   map.Clear();
-  map.Insert( Toolkit::DevelVisual::Property::TYPE, Toolkit::Visual::IMAGE );
+  map.Insert( Toolkit::DevelVisual::Property::TYPE, Toolkit::DevelVisual::N_PATCH );
   map.Insert( Toolkit::ImageVisual::Property::URL, mImageUrl );
   map.Insert( Toolkit::ImageVisual::Property::BORDER_ONLY, mBorderOnly );
+  map.Insert( Toolkit::DevelImageVisual::Property::BORDER, mBorder );
 }
 
 void NPatchVisual::DoCreateInstancePropertyMap( Property::Map& map ) const
@@ -334,7 +351,8 @@ NPatchVisual::NPatchVisual( VisualFactoryCache& factoryCache )
   mLoader( factoryCache.GetNPatchLoader() ),
   mImageUrl(),
   mId( NPatchLoader::UNINITIALIZED_ID ),
-  mBorderOnly( false )
+  mBorderOnly( false ),
+  mBorder()
 {
 }
 
diff --git a/dali-toolkit/internal/visuals/npatch/npatch-visual.h b/dali-toolkit/internal/visuals/npatch/npatch-visual.h
index 22b60d5..a36f780 100644
--- a/dali-toolkit/internal/visuals/npatch/npatch-visual.h
+++ b/dali-toolkit/internal/visuals/npatch/npatch-visual.h
@@ -50,7 +50,8 @@ typedef IntrusivePtr< NPatchVisual > NPatchVisualPtr;
  * | %Property Name           | Type             |
  * |--------------------------|------------------|
  * | url                      | STRING           |
- * | borderOnly               | BOOLEAN
+ * | borderOnly               | BOOLEAN          |
+ * | border                   | RECTANGLE        |
  *
  */
 class NPatchVisual: public Visual::Base
@@ -204,7 +205,7 @@ private:
   std::string mImageUrl;      ///< The url to the N patch to load
   std::size_t mId;            ///< id of the N patch (from loader/cache)
   bool mBorderOnly;           ///< if only border is desired
-
+  Rect< int > mBorder;        ///< The size of the border
 };
 
 } // namespace Internal
diff --git a/dali-toolkit/internal/visuals/svg/svg-visual.cpp b/dali-toolkit/internal/visuals/svg/svg-visual.cpp
index 73d29e0..7676a53 100644
--- a/dali-toolkit/internal/visuals/svg/svg-visual.cpp
+++ b/dali-toolkit/internal/visuals/svg/svg-visual.cpp
@@ -137,7 +137,7 @@ void SvgVisual::GetNaturalSize( Vector2& naturalSize )
 void SvgVisual::DoCreatePropertyMap( Property::Map& map ) const
 {
   map.Clear();
-  map.Insert( Toolkit::DevelVisual::Property::TYPE, Toolkit::Visual::IMAGE );
+  map.Insert( Toolkit::DevelVisual::Property::TYPE, Toolkit::DevelVisual::SVG );
   if( !mImageUrl.empty() )
   {
     map.Insert( Toolkit::ImageVisual::Property::URL, mImageUrl );
diff --git a/dali-toolkit/internal/visuals/visual-base-data-impl.cpp b/dali-toolkit/internal/visuals/visual-base-data-impl.cpp
index 19c2c74..f79afe6 100644
--- a/dali-toolkit/internal/visuals/visual-base-data-impl.cpp
+++ b/dali-toolkit/internal/visuals/visual-base-data-impl.cpp
@@ -59,6 +59,11 @@ DALI_ENUM_TO_STRING_WITH_SCOPE( Toolkit::Align, BOTTOM_CENTER )
 DALI_ENUM_TO_STRING_WITH_SCOPE( Toolkit::Align, BOTTOM_END )
 DALI_ENUM_TO_STRING_TABLE_END( ALIGN )
 
+DALI_ENUM_TO_STRING_TABLE_BEGIN( POLICY )
+DALI_ENUM_TO_STRING_WITH_SCOPE( Toolkit::DevelVisual::Transform::Policy, RELATIVE )
+DALI_ENUM_TO_STRING_WITH_SCOPE( Toolkit::DevelVisual::Transform::Policy, ABSOLUTE )
+DALI_ENUM_TO_STRING_TABLE_END( POLICY )
+
 Dali::Vector2 PointToVector2( Toolkit::Align::Type point, Toolkit::Direction::Type direction )
 {
   static const float pointToVector2[] = { 0.0f,0.0f,
@@ -80,6 +85,33 @@ Dali::Vector2 PointToVector2( Toolkit::Align::Type point, Toolkit::Direction::Ty
   return result;
 }
 
+bool GetPolicyFromValue( const Property::Value& value, Vector2& policy )
+{
+  bool success = false;
+  if( value.Get( policy ) )
+  {
+    success = true;
+  }
+  else
+  {
+    Property::Array* array = value.GetArray();
+    if( array && array->Size() == 2 )
+    {
+      DevelVisual::Transform::Policy::Type xPolicy = static_cast< DevelVisual::Transform::Policy::Type >( -1 ); // Assign an invalid value so definitely changes
+      DevelVisual::Transform::Policy::Type yPolicy = static_cast< DevelVisual::Transform::Policy::Type >( -1 ); // Assign an invalid value so definitely changes
+
+      if( Scripting::GetEnumerationProperty< DevelVisual::Transform::Policy::Type >( array->GetElementAt( 0 ), POLICY_TABLE, POLICY_TABLE_COUNT, xPolicy ) &&
+          Scripting::GetEnumerationProperty< DevelVisual::Transform::Policy::Type >( array->GetElementAt( 1 ), POLICY_TABLE, POLICY_TABLE_COUNT, yPolicy ) )
+      {
+        policy.x = xPolicy;
+        policy.y = yPolicy;
+        success = true;
+      }
+    }
+  }
+  return success;
+}
+
 } // unnamed namespace
 
 Internal::Visual::Base::Impl::Impl()
@@ -253,9 +285,24 @@ void Internal::Visual::Base::Impl::Transform::UpdatePropertyMap( const Property:
           Scripting::GetEnumerationProperty< Toolkit::Align::Type >( keyValue.second, ALIGN_TABLE, ALIGN_TABLE_COUNT, mAnchorPoint );
           break;
         }
-        case Toolkit::DevelVisual::Transform::Property::OFFSET_SIZE_MODE:
+        case Toolkit::DevelVisual::Transform::Property::OFFSET_POLICY:
+        {
+          Vector2 policy;
+          if( GetPolicyFromValue( keyValue.second, policy ) )
+          {
+            mOffsetSizeMode.x = policy.x;
+            mOffsetSizeMode.y = policy.y;
+          }
+          break;
+        }
+        case Toolkit::DevelVisual::Transform::Property::SIZE_POLICY:
         {
-          keyValue.second.Get( mOffsetSizeMode );
+          Vector2 policy;
+          if( GetPolicyFromValue( keyValue.second, policy ) )
+          {
+            mOffsetSizeMode.z = policy.x;
+            mOffsetSizeMode.w = policy.y;
+          }
           break;
         }
       }
@@ -272,23 +319,29 @@ void Internal::Visual::Base::Impl::Transform::UpdatePropertyMap( const Property:
       }
       else if( keyValue.first == "origin" )
       {
-        Toolkit::Align::Type align(Toolkit::Align::CENTER);
-        if( Scripting::GetEnumerationProperty< Toolkit::Align::Type >( keyValue.second, ALIGN_TABLE, ALIGN_TABLE_COUNT, align ) )
-        {
-          mOrigin = align;
-        }
+        Scripting::GetEnumerationProperty< Toolkit::Align::Type >( keyValue.second, ALIGN_TABLE, ALIGN_TABLE_COUNT, mOrigin );
       }
       else if( keyValue.first == "anchorPoint" )
       {
-        Toolkit::Align::Type align(Toolkit::Align::CENTER);
-        if( Scripting::GetEnumerationProperty< Toolkit::Align::Type >( keyValue.second, ALIGN_TABLE, ALIGN_TABLE_COUNT, align ) )
+        Scripting::GetEnumerationProperty< Toolkit::Align::Type >( keyValue.second, ALIGN_TABLE, ALIGN_TABLE_COUNT, mAnchorPoint );
+      }
+      else if( keyValue.first == "offsetPolicy" )
+      {
+        Vector2 policy;
+        if( GetPolicyFromValue( keyValue.second, policy ) )
         {
-          mAnchorPoint = align;
+          mOffsetSizeMode.x = policy.x;
+          mOffsetSizeMode.y = policy.y;
         }
       }
-      else if( keyValue.first == "offsetSizeMode" )
+      else if( keyValue.first == "sizePolicy" )
       {
-        keyValue.second.Get( mOffsetSizeMode );
+        Vector2 policy;
+        if( GetPolicyFromValue( keyValue.second, policy ) )
+        {
+          mOffsetSizeMode.z = policy.x;
+          mOffsetSizeMode.w = policy.y;
+        }
       }
     }
   }
@@ -301,7 +354,8 @@ void Internal::Visual::Base::Impl::Transform::GetPropertyMap( Property::Map& map
      .Add( Toolkit::DevelVisual::Transform::Property::SIZE, mSize )
      .Add( Toolkit::DevelVisual::Transform::Property::ORIGIN, mOrigin )
      .Add( Toolkit::DevelVisual::Transform::Property::ANCHOR_POINT, mAnchorPoint )
-     .Add( Toolkit::DevelVisual::Transform::Property::OFFSET_SIZE_MODE, mOffsetSizeMode );
+     .Add( Toolkit::DevelVisual::Transform::Property::OFFSET_POLICY, Vector2( mOffsetSizeMode.x, mOffsetSizeMode.y ) )
+     .Add( Toolkit::DevelVisual::Transform::Property::SIZE_POLICY, Vector2( mOffsetSizeMode.z, mOffsetSizeMode.w ) );
 }
 
 void Internal::Visual::Base::Impl::Transform::RegisterUniforms( Dali::Renderer renderer, Toolkit::Direction::Type direction )
diff --git a/dali-toolkit/internal/visuals/visual-factory-impl.cpp b/dali-toolkit/internal/visuals/visual-factory-impl.cpp
index 909cfcc..455a8ac 100644
--- a/dali-toolkit/internal/visuals/visual-factory-impl.cpp
+++ b/dali-toolkit/internal/visuals/visual-factory-impl.cpp
@@ -27,6 +27,7 @@
 
 // INTERNAL INCLUDES
 #include <dali-toolkit/public-api/visuals/image-visual-properties.h>
+#include <dali-toolkit/devel-api/visuals/image-visual-properties-devel.h>
 #include <dali-toolkit/devel-api/visuals/text-visual-properties.h>
 #include <dali-toolkit/devel-api/visuals/visual-properties-devel.h>
 #include <dali-toolkit/internal/visuals/border/border-visual.h>
@@ -166,6 +167,39 @@ Toolkit::Visual::Base VisualFactory::CreateVisual( const Property::Map& property
       visualPtr = TextVisual::New( *( mFactoryCache.Get() ), propertyMap );
       break;
     }
+
+    case Toolkit::DevelVisual::N_PATCH:
+    {
+      Property::Value* imageURLValue = propertyMap.Find( Toolkit::ImageVisual::Property::URL, IMAGE_URL_NAME );
+      std::string imageUrl;
+      if( imageURLValue && imageURLValue->Get( imageUrl ) )
+      {
+        visualPtr = NPatchVisual::New( *( mFactoryCache.Get() ), imageUrl, propertyMap );
+      }
+      break;
+    }
+
+    case Toolkit::DevelVisual::SVG:
+    {
+      Property::Value* imageURLValue = propertyMap.Find( Toolkit::ImageVisual::Property::URL, IMAGE_URL_NAME );
+      std::string imageUrl;
+      if( imageURLValue && imageURLValue->Get( imageUrl ) )
+      {
+        visualPtr = SvgVisual::New( *( mFactoryCache.Get() ), imageUrl, propertyMap );
+      }
+      break;
+    }
+
+    case Toolkit::DevelVisual::ANIMATED_IMAGE:
+    {
+      Property::Value* imageURLValue = propertyMap.Find( Toolkit::ImageVisual::Property::URL, IMAGE_URL_NAME );
+      std::string imageUrl;
+      if( imageURLValue && imageURLValue->Get( imageUrl ) )
+      {
+        visualPtr = AnimatedImageVisual::New( *( mFactoryCache.Get() ), imageUrl, propertyMap );
+      }
+      break;
+    }
   }
 
   if( !visualPtr )
diff --git a/dali-toolkit/internal/visuals/visual-string-constants.cpp b/dali-toolkit/internal/visuals/visual-string-constants.cpp
index c57a8cf..a7a3e2c 100644
--- a/dali-toolkit/internal/visuals/visual-string-constants.cpp
+++ b/dali-toolkit/internal/visuals/visual-string-constants.cpp
@@ -39,6 +39,9 @@ DALI_ENUM_TO_STRING_WITH_SCOPE( Toolkit::Visual, IMAGE )
 DALI_ENUM_TO_STRING_WITH_SCOPE( Toolkit::Visual, MESH )
 DALI_ENUM_TO_STRING_WITH_SCOPE( Toolkit::Visual, PRIMITIVE )
 DALI_ENUM_TO_STRING_WITH_SCOPE( Toolkit::DevelVisual, TEXT )
+DALI_ENUM_TO_STRING_WITH_SCOPE( Toolkit::DevelVisual, N_PATCH )
+DALI_ENUM_TO_STRING_WITH_SCOPE( Toolkit::DevelVisual, SVG )
+DALI_ENUM_TO_STRING_WITH_SCOPE( Toolkit::DevelVisual, ANIMATED_IMAGE )
 DALI_ENUM_TO_STRING_WITH_SCOPE( Toolkit::Visual, WIREFRAME )
 DALI_ENUM_TO_STRING_TABLE_END( VISUAL_TYPE )
 
@@ -75,6 +78,7 @@ const char * const PIXEL_AREA_UNIFORM_NAME( "pixelArea" );
 const char * const WRAP_MODE_UNIFORM_NAME( "wrapMode" );
 const char * const IMAGE_WRAP_MODE_U("wrapModeU");
 const char * const IMAGE_WRAP_MODE_V("wrapModeV");
+const char * const IMAGE_BORDER( "border" );
 
 // Text visual
 const char * const TEXT_PROPERTY( "text" );
diff --git a/dali-toolkit/internal/visuals/visual-string-constants.h b/dali-toolkit/internal/visuals/visual-string-constants.h
index 1a8df73..9817b7a 100644
--- a/dali-toolkit/internal/visuals/visual-string-constants.h
+++ b/dali-toolkit/internal/visuals/visual-string-constants.h
@@ -65,6 +65,7 @@ extern const char * const PIXEL_AREA_UNIFORM_NAME;
 extern const char * const WRAP_MODE_UNIFORM_NAME;
 extern const char * const IMAGE_WRAP_MODE_U;
 extern const char * const IMAGE_WRAP_MODE_V;
+extern const char * const IMAGE_BORDER;
 
 // Text visual
 extern const char * const TEXT_PROPERTY;
diff --git a/dali-toolkit/public-api/controls/control-impl.cpp b/dali-toolkit/public-api/controls/control-impl.cpp
index 26e020a..19be9ba 100644
--- a/dali-toolkit/public-api/controls/control-impl.cpp
+++ b/dali-toolkit/public-api/controls/control-impl.cpp
@@ -686,10 +686,10 @@ public:
     }
   }
 
-  Toolkit::Visual::Type GetVisualTypeFromMap( const Property::Map& map )
+  Toolkit::DevelVisual::Type GetVisualTypeFromMap( const Property::Map& map )
   {
-    Property::Value* typeValue = map.Find( Toolkit::Visual::Property::TYPE, VISUAL_TYPE  );
-    Toolkit::Visual::Type type = Toolkit::Visual::IMAGE;
+    Property::Value* typeValue = map.Find( Toolkit::DevelVisual::Property::TYPE, VISUAL_TYPE  );
+    Toolkit::DevelVisual::Type type = Toolkit::DevelVisual::IMAGE;
     if( typeValue )
     {
       Scripting::GetEnumerationProperty( *typeValue, VISUAL_TYPE_TABLE, VISUAL_TYPE_TABLE_COUNT, type );
@@ -721,8 +721,8 @@ public:
         Property::Map fromMap;
         visual.CreatePropertyMap( fromMap );
 
-        Toolkit::Visual::Type fromType = GetVisualTypeFromMap( fromMap );
-        Toolkit::Visual::Type toType = GetVisualTypeFromMap( toMap );
+        Toolkit::DevelVisual::Type fromType = GetVisualTypeFromMap( fromMap );
+        Toolkit::DevelVisual::Type toType = GetVisualTypeFromMap( toMap );
 
         if( fromType != toType )
         {
@@ -730,7 +730,8 @@ public:
         }
         else
         {
-          if( fromType == Toolkit::Visual::IMAGE )
+          if( fromType == Toolkit::DevelVisual::IMAGE || fromType == Toolkit::DevelVisual::N_PATCH
+              || fromType == Toolkit::DevelVisual::SVG || fromType == Toolkit::DevelVisual::ANIMATED_IMAGE )
           {
             Property::Value* fromUrl = fromMap.Find( Toolkit::ImageVisual::Property::URL, IMAGE_URL_NAME );
             Property::Value* toUrl = toMap.Find( Toolkit::ImageVisual::Property::URL, IMAGE_URL_NAME );
diff --git a/dali-toolkit/public-api/dali-toolkit-version.cpp b/dali-toolkit/public-api/dali-toolkit-version.cpp
index 0fc4fc0..2f4b7a3 100644
--- a/dali-toolkit/public-api/dali-toolkit-version.cpp
+++ b/dali-toolkit/public-api/dali-toolkit-version.cpp
@@ -1,5 +1,5 @@
 /*
- * Copyright (c) 2015 Samsung Electronics Co., Ltd.
+ * 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.
@@ -31,7 +31,7 @@ namespace Toolkit
 
 const unsigned int TOOLKIT_MAJOR_VERSION = 1;
 const unsigned int TOOLKIT_MINOR_VERSION = 2;
-const unsigned int TOOLKIT_MICRO_VERSION = 30;
+const unsigned int TOOLKIT_MICRO_VERSION = 31;
 const char * const TOOLKIT_BUILD_DATE    = __DATE__ " " __TIME__;
 
 #ifdef DEBUG_ENABLED
diff --git a/docs/content/shared-javascript-and-cpp-documentation/visuals.md b/docs/content/shared-javascript-and-cpp-documentation/visuals.md
index 71c45ef..17abb35 100644
--- a/docs/content/shared-javascript-and-cpp-documentation/visuals.md
+++ b/docs/content/shared-javascript-and-cpp-documentation/visuals.md
@@ -26,23 +26,26 @@ This is required to avoid ambiguity as multiple visuals may be capable of render
 
 Visuals have a **transform** field in the property map to allow layouting within a control. If this field is not set, then the visual defaults to filling the control. The **transform** field has a property map with the following keys:
 
-| Property                                        | String   | Type    | Required | Description               |
-|-------------------------------------------------|----------|:-------:|:--------:|---------------------------|
-| Dali::Toolkit::Visual::Transform::Property::OFFSET | offset | VECTOR2 | No      | The offset of the visual. |
-| Dali::Toolkit::Visual::Transform::Property::SIZE | size | VECTOR2 | No      | The size of the visual. |
-| Dali::Toolkit::Visual::Transform::Property::OFFSET_SIZE_MODE | offsetSizeMode | VECTOR4 | No      | Whether the size or offset components are Relative or Absolute [More info](@ref offset-size-mode)|
-| Dali::Toolkit::Visual::Transform::Property::ORIGIN | origin | INTEGER or STRING | No      | The origin of the visual within the control's area. [More info](@ref align-type) |
-| Dali::Toolkit::Visual::Transform::Property::ANCHOR_POINT | anchorPoint | INTEGER or STRING | No      | The anchor point of the visual. [More info](@ref align-type)|
+| Property                                                       | String       | Type              | Required | Description                                                                                 |
+|----------------------------------------------------------------|--------------|:-----------------:|:--------:|---------------------------------------------------------------------------------------------|
+| Dali::Toolkit::DevelVisual::Transform::Property::OFFSET        | offset       | VECTOR2           | No       | The offset of the visual.                                                                   |
+| Dali::Toolkit::DevelVisual::Transform::Property::SIZE          | size         | VECTOR2           | No       | The size of the visual.                                                                     |
+| Dali::Toolkit::DevelVisual::Transform::Property::OFFSET_POLICY | offsetPolicy | VECTOR4           | No       | Whether the offset components are Relative or Absolute [More info](@ref offset-size-policy) |
+| Dali::Toolkit::DevelVisual::Transform::Property::SIZE_POLICY   | sizePolicy   | VECTOR4           | No       | Whether the size components are Relative or Absolute [More info](@ref offset-size-policy)   |
+| Dali::Toolkit::DevelVisual::Transform::Property::ORIGIN        | origin       | INTEGER or STRING | No       | The origin of the visual within the control's area. [More info](@ref align-type)            |
+| Dali::Toolkit::DevelVisual::Transform::Property::ANCHOR_POINT  | anchorPoint  | INTEGER or STRING | No       | The anchor point of the visual. [More info](@ref align-type)                                |
  
 
-## Offset & size modes  {#offset-size-mode}
-
-The offset and size modes can be either Relative or Absolute. The offset modes are in the x and y components of the offsetSizeMode property, and map to the offset's x and y components respectively. The size modes are in the z and w components of the offsetSizeMode property, and map to the size's x and y components, respectively.
+## Offset & Size Policy  {#offset-size-policy}
 
-A mode value of 0 represents a Relative mode, in which case the size or offset value represents a ratio of the control's size. A mode value of 1 represents an Absolute mode, in which case the size or offset value represents world units (pixels).
+The offset and size policies can be either Relative or Absolute.
 
-For example, an offsetSizeMode of [0, 0, 1, 1], an offset of (0, 0.25) and a size of (20, 20) means the visual will be 20 pixels by 20 pixels in size, positioned 25% above the center of the control.
+| Enumeration                                             | String   | Description                                                                   |
+|---------------------------------------------------------|----------|-------------------------------------------------------------------------------|
+| Dali::Toolkit::DevelVisual::Transform::Policy::RELATIVE | RELATIVE | *Default*. The size or offset value represents a ratio of the control's size  |
+| Dali::Toolkit::DevelVisual::Transform::Policy::ABSOLUTE | ABSOLUTE | The size or offset value represents world units (pixels)                      |
 
+For example, an offsetPolicy of [ RELATIVE, RELATIVE ], a sizePolicy of [ ABSOLUTE, ABSOLUTE ], an offset of ( 0, 0.25 ) and a size of ( 20, 20 ) means the visual will be 20 pixels by 20 pixels in size, positioned 25% above the center of the control.
 
 ## Alignment  {#align-type}
 | Enumeration                                          | String  | Description                                                                                          |
diff --git a/packaging/dali-toolkit.spec b/packaging/dali-toolkit.spec
index e49d1f8..6e66054 100644
--- a/packaging/dali-toolkit.spec
+++ b/packaging/dali-toolkit.spec
@@ -1,6 +1,6 @@
 Name:       dali-toolkit
 Summary:    The OpenGLES Canvas Core Library Toolkit
-Version:    1.2.30
+Version:    1.2.31
 Release:    1
 Group:      System/Libraries
 License:    Apache-2.0 and BSD-2-Clause and MIT
diff --git a/plugins/dali-swig/SWIG/dali-toolkit.i b/plugins/dali-swig/SWIG/dali-toolkit.i
index 7d83bf8..751e653 100755
--- a/plugins/dali-swig/SWIG/dali-toolkit.i
+++ b/plugins/dali-swig/SWIG/dali-toolkit.i
@@ -1,5 +1,5 @@
 /*
- * Copyright (c) 2016 Samsung Electronics Co., Ltd.
+ * 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.
@@ -122,6 +122,7 @@
 %rename(AlignType) Dali::Toolkit::Align::Type;
 %rename(VisualType) Dali::Toolkit::Visual::Type;
 %rename(VisualTransformPropertyType) Dali::Toolkit::DevelVisual::Transform::Property::Type;
+%rename(VisualTransformPolicyType) Dali::Toolkit::DevelVisual::Transform::Policy::Type;
 %rename(VISUAL_SHADER_VERTEX) Dali::Toolkit::Visual::Shader::Property::VERTEX_SHADER;
 %rename(VISUAL_SHADER_FRAGMENT) Dali::Toolkit::Visual::Shader::Property::FRAGMENT_SHADER;
 %rename(VISUAL_SHADER_SUBDIVIDE_GRID_X) Dali::Toolkit::Visual::Shader::Property::SUBDIVIDE_GRID_X;
diff --git a/plugins/dali-swig/examples/visuals-using-custom-view/ContactView.cs b/plugins/dali-swig/examples/visuals-using-custom-view/ContactView.cs
index f659b70..ad9bc2d 100644
--- a/plugins/dali-swig/examples/visuals-using-custom-view/ContactView.cs
+++ b/plugins/dali-swig/examples/visuals-using-custom-view/ContactView.cs
@@ -158,7 +158,8 @@ namespace VisualsUsingCustomView
             // Configure the transform and size of Image visual.
             Dali.Property.Map imageVisualTransform = new Dali.Property.Map();
             imageVisualTransform.Add((int)VisualTransformPropertyType.OFFSET, new Dali.Property.Value(new Vector2(10.0f, 0.0f)))
-                .Add((int)VisualTransformPropertyType.OFFSET_SIZE_MODE, new Dali.Property.Value(new Vector4(1.0f, 1.0f, 1.0f, 1.0f)))
+                .Add((int)VisualTransformPropertyType.OFFSET_POLICY, new Dali.Property.Value(new Vector2((int)VisualTransformPolicyType.ABSOLUTE, (int)VisualTransformPolicyType.ABSOLUTE)))
+                .Add((int)VisualTransformPropertyType.SIZE_POLICY, new Dali.Property.Value(new Vector2((int)VisualTransformPolicyType.ABSOLUTE, (int)VisualTransformPolicyType.ABSOLUTE)))
                 .Add((int)VisualTransformPropertyType.SIZE, new Dali.Property.Value(new Vector2(40.0f, 40.0f)))
                 .Add((int)VisualTransformPropertyType.ORIGIN, new Dali.Property.Value((int)AlignType.CENTER_BEGIN))
                 .Add((int)VisualTransformPropertyType.ANCHOR_POINT, new Dali.Property.Value((int)AlignType.CENTER_BEGIN));
@@ -167,7 +168,8 @@ namespace VisualsUsingCustomView
             // Configure the transform and size of Text visual.
             Dali.Property.Map textVisualTransform = new Dali.Property.Map();
             textVisualTransform.Add((int)VisualTransformPropertyType.OFFSET, new Dali.Property.Value(new Vector2(0.0f, 0.0f)))
-                .Add((int)VisualTransformPropertyType.OFFSET_SIZE_MODE, new Dali.Property.Value(new Vector4(0.0f, 0.0f, 1.0f, 1.0f)))
+                .Add((int)VisualTransformPropertyType.OFFSET_POLICY, new Dali.Property.Value(new Vector2((int)VisualTransformPolicyType.RELATIVE, (int)VisualTransformPolicyType.RELATIVE)))
+                .Add((int)VisualTransformPropertyType.SIZE_POLICY, new Dali.Property.Value(new Vector2((int)VisualTransformPolicyType.ABSOLUTE, (int)VisualTransformPolicyType.ABSOLUTE)))
                 .Add((int)VisualTransformPropertyType.SIZE, new Dali.Property.Value(new Vector2(size.X - 100.0f, 50.0f)))
                 .Add((int)VisualTransformPropertyType.ORIGIN, new Dali.Property.Value((int)Align.Type.Center))
                 .Add((int)VisualTransformPropertyType.ANCHOR_POINT, new Dali.Property.Value((int)Align.Type.Center));
@@ -176,7 +178,8 @@ namespace VisualsUsingCustomView
             // Configure the transform and size of Primitive visual.
             Dali.Property.Map primitiveVisualTransform = new Dali.Property.Map();
             primitiveVisualTransform.Add((int)VisualTransformPropertyType.OFFSET, new Dali.Property.Value(new Vector2(size.X - 60.0f, 0.0f)))
-                .Add((int)VisualTransformPropertyType.OFFSET_SIZE_MODE, new Dali.Property.Value(new Vector4(1.0f, 1.0f, 1.0f, 1.0f)))
+                .Add((int)VisualTransformPropertyType.OFFSET_POLICY, new Dali.Property.Value(new Vector2((int)VisualTransformPolicyType.ABSOLUTE, (int)VisualTransformPolicyType.ABSOLUTE)))
+                .Add((int)VisualTransformPropertyType.SIZE_POLICY, new Dali.Property.Value(new Vector2((int)VisualTransformPolicyType.ABSOLUTE, (int)VisualTransformPolicyType.ABSOLUTE)))
                 .Add((int)VisualTransformPropertyType.SIZE, new Dali.Property.Value(new Vector2(40.0f, 40.0f)))
                 .Add((int)VisualTransformPropertyType.ORIGIN, new Dali.Property.Value((int)AlignType.CENTER_BEGIN))
                 .Add((int)VisualTransformPropertyType.ANCHOR_POINT, new Dali.Property.Value((int)AlignType.CENTER_BEGIN));
@@ -185,7 +188,8 @@ namespace VisualsUsingCustomView
             // Configure the transform and size of Color visual. This is also the default value.
             Dali.Property.Map colorVisualTransform = new Dali.Property.Map();
             colorVisualTransform.Add( (int)VisualTransformPropertyType.OFFSET, new Dali.Property.Value(new Vector2(0.0f,0.0f)))
-                .Add((int)VisualTransformPropertyType.OFFSET_SIZE_MODE, new Dali.Property.Value(new Vector4(0.0f, 0.0f, 0.0f, 0.0f)))
+                .Add((int)VisualTransformPropertyType.OFFSET_POLICY, new Dali.Property.Value(new Vector2((int)VisualTransformPolicyType.RELATIVE, (int)VisualTransformPolicyType.RELATIVE)))
+                .Add((int)VisualTransformPropertyType.SIZE_POLICY, new Dali.Property.Value(new Vector2((int)VisualTransformPolicyType.RELATIVE, (int)VisualTransformPolicyType.RELATIVE)))
                 .Add( (int)VisualTransformPropertyType.SIZE, new Dali.Property.Value(new Vector2(1.0f, 1.0f)) )
                 .Add( (int)VisualTransformPropertyType.ORIGIN, new Dali.Property.Value((int)AlignType.TOP_BEGIN) )
                 .Add( (int)VisualTransformPropertyType.ANCHOR_POINT, new Dali.Property.Value((int)AlignType.TOP_BEGIN) );