[dali_1.1.45] Merge branch 'devel/master'

Change-Id: Ie5ff6dbe0e8c581b17736a742d3eb13b99c6423d

[dali_1.1.45] Merge branch 'devel/master'
Change-Id: Ie5ff6dbe0e8c581b17736a742d3eb13b99c6423d
Adeel Kazmi
2 parents 1a3e7b29 a3d5c29a
Showing 29 changed files with 1273 additions and 269 deletions
com.samsung.dali-demo.xml
demo/dali-demo.cpp
examples/dissolve-effect/dissolve-effect-example.cpp
examples/gradients/gradients-example.cpp
examples/image-scaling-and-filtering/image-scaling-and-filtering-example.cpp
examples/item-view/item-view-example.cpp
examples/line-mesh/line-mesh-example.cpp
examples/mesh-renderer/mesh-renderer-example.cpp → examples/mesh-visual/mesh-visual-example.cpp
examples/model3d-view/model3d-view-example.cpp
examples/motion-blur/motion-blur-example.cpp
examples/native-image-source/native-image-source-example.cpp
examples/point-mesh/point-mesh-example.cpp
examples/primitive-shapes/primitive-shapes-example.cpp
examples/renderer-stencil/renderer-stencil-example.cpp
examples/renderer-stencil/renderer-stencil-shaders.h
examples/scroll-view/scroll-view-example.cpp
examples/text-scrolling/text-scrolling-example.cpp
examples/video-view/video-view-example.cpp
packaging/com.samsung.dali-demo.spec
resources/images/wood.png
@@ -34,6 +34,9 @@
 	<ui-application appid="item-view.example" exec="/usr/apps/com.samsung.dali-demo/bin/item-view.example" nodisplay="true" multiple="false" type="c++app" taskmanage="true">
 		<label>Item View</label>
 	</ui-application>
+	<ui-application appid="renderer-stencil.example" exec="/usr/apps/com.samsung.dali-demo/bin/renderer-stencil.example" nodisplay="true" multiple="false" type="c++app" taskmanage="true">
+		<label>Renderer Stencils</label>
+	</ui-application>
 	<ui-application appid="magnifier.example" exec="/usr/apps/com.samsung.dali-demo/bin/magnifier.example" nodisplay="true" multiple="false" type="c++app" taskmanage="true">
 		<label>Magnifier</label>
 	</ui-application>
@@ -160,8 +163,8 @@
 	<ui-application appid="video-view.example" exec="/usr/apps/com.samsung.dali-demo/bin/video-view.example" nodisplay="true" multiple="false" type="c++app" taskmanage="true">
 		<label>Video View</label>
 	</ui-application>
-	<ui-application appid="mesh-renderer.example" exec="/usr/apps/com.samsung.dali-demo/bin/mesh-renderer.example" nodisplay="true" multiple="false" type="c++app" taskmanage="true">
-		<label>Mesh Renderer</label>
+	<ui-application appid="mesh-visual.example" exec="/usr/apps/com.samsung.dali-demo/bin/mesh-visual.example" nodisplay="true" multiple="false" type="c++app" taskmanage="true">
+		<label>Mesh Visual</label>
 	</ui-application>
 	<ui-application appid="primitive-shapes.example" exec="/usr/apps/com.samsung.dali-demo/bin/primitive-shapes.example" nodisplay="true" multiple="false" type="c++app" taskmanage="true">
 		<label>Primitive Shapes</label>
@@ -41,8 +41,8 @@ int DALI_EXPORT_API main(int argc, char **argv)
   demo.AddExample(Example("cube-transition-effect.example", DALI_DEMO_STR_TITLE_CUBE_TRANSITION));
   demo.AddExample(Example("dissolve-effect.example", DALI_DEMO_STR_TITLE_DISSOLVE_TRANSITION));
   demo.AddExample(Example("item-view.example", DALI_DEMO_STR_TITLE_ITEM_VIEW));
+  demo.AddExample(Example("renderer-stencil.example", DALI_DEMO_STR_TITLE_RENDERER_STENCIL));
   demo.AddExample(Example("magnifier.example", DALI_DEMO_STR_TITLE_MAGNIFIER));
-  demo.AddExample(Example("model3d-view.example", DALI_DEMO_STR_TITLE_MODEL_3D_VIEWER));
   demo.AddExample(Example("motion-blur.example", DALI_DEMO_STR_TITLE_MOTION_BLUR));
   demo.AddExample(Example("motion-stretch.example", DALI_DEMO_STR_TITLE_MOTION_STRETCH));
   demo.AddExample(Example("page-turn-view.example", DALI_DEMO_STR_TITLE_PAGE_TURN_VIEW));
@@ -78,7 +78,7 @@ int DALI_EXPORT_API main(int argc, char **argv)
   demo.AddExample(Example("tilt.example", DALI_DEMO_STR_TITLE_TILT_SENSOR));
   demo.AddExample(Example("effects-view.example", DALI_DEMO_STR_TITLE_EFFECTS_VIEW));
   demo.AddExample(Example("native-image-source.example", DALI_DEMO_STR_TITLE_NATIVE_IMAGE_SOURCE));
-  demo.AddExample(Example("mesh-renderer.example", DALI_DEMO_STR_TITLE_MESH_RENDERER));
+  demo.AddExample(Example("mesh-visual.example", DALI_DEMO_STR_TITLE_MESH_VISUAL));
   demo.AddExample(Example("primitive-shapes.example", DALI_DEMO_STR_TITLE_PRIMITIVE_SHAPES));
  
   demo.SortAlphabetically( true );
@@ -91,13 +91,13 @@ Toolkit::ImageView CreateStageFillingImageView( const char * const imagePath )
   Size stageSize = Stage::GetCurrent().GetSize();
   Toolkit::ImageView imageView = Toolkit::ImageView::New();
   Property::Map map;
-  map["rendererType"] = "IMAGE";
-  map["url"] = imagePath;
-  map["desiredWidth"] = stageSize.x;
-  map["desiredHeight"] = stageSize.y;
-  map["fittingMode"] = "SCALE_TO_FILL";
-  map["samplingMode"] = "BOX_THEN_LINEAR";
-  map["synchronousLoading"] = true;
+  map[Toolkit::Visual::Property::TYPE] = Toolkit::Visual::IMAGE;
+  map[Toolkit::ImageVisual::Property::URL] = imagePath;
+  map[Toolkit::ImageVisual::Property::DESIRED_WIDTH] = stageSize.x;
+  map[Toolkit::ImageVisual::Property::DESIRED_HEIGHT] = stageSize.y;
+  map[Toolkit::ImageVisual::Property::FITTING_MODE] = FittingMode::SCALE_TO_FILL;
+  map[Toolkit::ImageVisual::Property::SAMPLING_MODE] = SamplingMode::BOX_THEN_LINEAR;
+  map[Toolkit::ImageVisual::Property::SYNCHRONOUS_LOADING] = true;
   imageView.SetProperty( Toolkit::ImageView::Property::IMAGE, map );
  
   return imageView;
@@ -77,7 +77,7 @@ public:
  
 // ---- Gradient for background
  
-    mGradientMap.Insert("rendererType",  "GRADIENT");
+    mGradientMap.Insert( Visual::Property::TYPE,  Visual::GRADIENT );
  
     Property::Array stopOffsets;
     stopOffsets.PushBack( 0.0f );
@@ -85,7 +85,7 @@ public:
     stopOffsets.PushBack( 0.6f );
     stopOffsets.PushBack( 0.8f );
     stopOffsets.PushBack( 1.0f );
-    mGradientMap.Insert("stopOffset", stopOffsets );
+    mGradientMap.Insert( GradientVisual::Property::STOP_OFFSET, stopOffsets );
  
     Property::Array stopColors;
     stopColors.PushBack( Vector4( 129.f, 198.f, 193.f, 255.f )/255.f );
@@ -93,7 +93,7 @@ public:
     stopColors.PushBack( Vector4( 214.f, 37.f, 139.f, 191.f )/255.f );
     stopColors.PushBack( Vector4( 129.f, 198.f, 193.f, 150.f )/255.f );
     stopColors.PushBack( Color::YELLOW );
-    mGradientMap.Insert("stopColor",   stopColors);
+    mGradientMap.Insert( GradientVisual::Property::STOP_COLOR, stopColors );
  
     OnChangeIconClicked( changeButton );
   }
@@ -106,30 +106,30 @@ public:
     {
       case 0: // linear gradient with units as objectBoundingBox
       {
-        gradientMap.Insert("startPosition",   Vector2( 0.5f, 0.5f ));
-        gradientMap.Insert("endPosition",    Vector2( -0.5f, -0.5f ));
+        gradientMap.Insert( GradientVisual::Property::START_POSITION,   Vector2(  0.5f,  0.5f ) );
+        gradientMap.Insert( GradientVisual::Property::END_POSITION,     Vector2( -0.5f, -0.5f ) );
         break;
       }
       case 1: // linear gradient with units as userSpaceOnUse
       {
         Vector2 halfStageSize = Stage::GetCurrent().GetSize()*0.5f;
-        gradientMap.Insert("startPosition",   halfStageSize);
-        gradientMap.Insert("endPosition",    -halfStageSize );
-        gradientMap.Insert("units",  "USER_SPACE");
+        gradientMap.Insert( GradientVisual::Property::START_POSITION,  halfStageSize );
+        gradientMap.Insert( GradientVisual::Property::END_POSITION,   -halfStageSize );
+        gradientMap.Insert( GradientVisual::Property::UNITS, GradientVisual::Units::USER_SPACE );
         break;
       }
       case 2: // radial gradient with units as objectBoundingBox
       {
-        gradientMap.Insert("center",  Vector2(0.5f, 0.5f));
-        gradientMap.Insert("radius",  1.414f);
+        gradientMap.Insert( GradientVisual::Property::CENTER, Vector2( 0.5f, 0.5f ) );
+        gradientMap.Insert( GradientVisual::Property::RADIUS, 1.414f );
         break;
       }
       default: // radial gradient with units as userSpaceOnUse
       {
         Vector2 stageSize = Stage::GetCurrent().GetSize();
-        gradientMap.Insert("center",  stageSize*0.5f);
-        gradientMap.Insert("radius",  stageSize.Length());
-        gradientMap.Insert("units",  "USER_SPACE");
+        gradientMap.Insert( GradientVisual::Property::CENTER, stageSize * 0.5f );
+        gradientMap.Insert( GradientVisual::Property::RADIUS, stageSize.Length());
+        gradientMap.Insert( GradientVisual::Property::UNITS,  GradientVisual::Units::USER_SPACE );
         break;
       }
     }
@@ -177,12 +177,12 @@ public:
  
     // Background image:
     Dali::Property::Map backgroundImage;
-    backgroundImage.Insert( "rendererType",  "IMAGE" );
-    backgroundImage.Insert( "url",  BACKGROUND_IMAGE );
-    backgroundImage.Insert( "desiredWidth",   stage.GetSize().width );
-    backgroundImage.Insert( "desiredHeight",   stage.GetSize().height );
-    backgroundImage.Insert( "fittingMode",   "SCALE_TO_FILL" );
-    backgroundImage.Insert( "samplingMode",   "BOX_THEN_NEAREST" );
+    backgroundImage.Insert( Toolkit::Visual::Property::TYPE,  Toolkit::Visual::IMAGE );
+    backgroundImage.Insert( Toolkit::ImageVisual::Property::URL,  BACKGROUND_IMAGE );
+    backgroundImage.Insert( Toolkit::ImageVisual::Property::DESIRED_WIDTH, stage.GetSize().width );
+    backgroundImage.Insert( Toolkit::ImageVisual::Property::DESIRED_HEIGHT, stage.GetSize().height );
+    backgroundImage.Insert( Toolkit::ImageVisual::Property::FITTING_MODE,   FittingMode::SCALE_TO_FILL );
+    backgroundImage.Insert( Toolkit::ImageVisual::Property::SAMPLING_MODE,   SamplingMode::BOX_THEN_NEAREST );
  
     Toolkit::ImageView background = Toolkit::ImageView::New();
     background.SetProperty( Toolkit::ImageView::Property::IMAGE, backgroundImage );
@@ -878,10 +878,10 @@ public: // From ItemFactory
     borderActor.SetColorMode( USE_PARENT_COLOR );
  
     Property::Map borderProperty;
-    borderProperty.Insert( "rendererType", "BORDER" );
-    borderProperty.Insert( "borderColor", Color::WHITE );
-    borderProperty.Insert( "borderSize", ITEM_BORDER_SIZE );
-    borderProperty.Insert( "antiAliasing", true );
+    borderProperty.Insert( Visual::Property::TYPE, Visual::BORDER );
+    borderProperty.Insert( BorderVisual::Property::COLOR, Color::WHITE );
+    borderProperty.Insert( BorderVisual::Property::SIZE, ITEM_BORDER_SIZE );
+    borderProperty.Insert( BorderVisual::Property::ANTI_ALIASING, true );
     borderActor.SetProperty( ImageView::Property::IMAGE, borderProperty );
  
     actor.Add(borderActor);
@@ -902,8 +902,8 @@ public: // From ItemFactory
     checkbox.SetZ( 0.1f );
  
     Property::Map solidColorProperty;
-    solidColorProperty.Insert( "rendererType", "COLOR" );
-    solidColorProperty.Insert( "mixColor", Vector4(0.f, 0.f, 0.f, 0.6f) );
+    solidColorProperty.Insert( Visual::Property::TYPE, Visual::COLOR );
+    solidColorProperty.Insert( ColorVisual::Property::MIX_COLOR, Vector4(0.f, 0.f, 0.f, 0.6f) );
     checkbox.SetProperty( ImageView::Property::IMAGE, solidColorProperty );
  
     if( MODE_REMOVE_MANY  != mMode &&
@@ -102,7 +102,7 @@ Geometry CreateGeometry()
   Geometry pentagonGeometry = Geometry::New();
   pentagonGeometry.AddVertexBuffer( pentagonVertices );
   pentagonGeometry.SetIndexBuffer( INDICES[0], INDICES_SIZE[0] );
-  pentagonGeometry.SetGeometryType( Geometry::LINES );
+  pentagonGeometry.SetType( Geometry::LINES );
   return pentagonGeometry;
 }
  
@@ -334,7 +334,7 @@ public:
     std::stringstream str;
     str << mCurrentIndexCount;
     mIndicesCountLabel.SetProperty( Toolkit::TextLabel::Property::TEXT, str.str() );
-    mGeometry.SetGeometryType( mPrimitiveType );
+    mGeometry.SetType( mPrimitiveType );
     mGeometry.SetIndexBuffer( INDICES[ indicesArray ], INDICES_SIZE[ indicesArray ] );
     mRenderer.SetIndexRange( 0, mCurrentIndexCount );
     return true;
@@ -373,7 +373,7 @@ private:
   Toolkit::PushButton   mMinusButton;
   Toolkit::PushButton   mPlusButton;
   Toolkit::TextLabel    mIndicesCountLabel;
-  Geometry::GeometryType mPrimitiveType;
+  Geometry::Type mPrimitiveType;
   int      mCurrentIndexCount;
   int      mMaxIndexCount;
 };
@@ -9,7 +9,7 @@ namespace
   //Keeps information about each model for access.
   struct Model
   {
-    Control control; // Control housing the mesh renderer of the model.
+    Control control; // Control housing the mesh visual of the model.
     Vector2 rotation; // Keeps track of rotation about x and y axis for manual rotation.
     Animation rotationAnimation; // Automatically rotates when left alone.
   };
@@ -31,12 +31,12 @@ namespace
  
   const char * const TEXTURES_PATH( DEMO_IMAGE_DIR "" );
  
-  //Possible shader options.
-  const char * const SHADER_TYPE[] =
+  //Possible shading modes.
+  MeshVisual::ShadingMode::Value SHADING_MODE_TABLE[] =
   {
-    "ALL_TEXTURES",
-    "DIFFUSE_TEXTURE",
-    "TEXTURELESS"
+    MeshVisual::ShadingMode::TEXTURED_WITH_DETAILED_SPECULAR_LIGHTING,
+    MeshVisual::ShadingMode::TEXTURED_WITH_SPECULAR_LIGHTING,
+    MeshVisual::ShadingMode::TEXTURELESS_WITH_DIFFUSE_LIGHTING
   };
  
   //Files for background and toolbar
@@ -47,23 +47,30 @@ namespace
   const float MODEL_SCALE = 0.75f;
   const int NUM_MESHES = 3;
  
+  //Used to identify actors.
+  const int MODEL_TAG = 0;
+  const int LIGHT_TAG = 1;
+  const int LAYER_TAG = 2;
+
 } //End namespace
  
-class MeshRendererController : public ConnectionTracker
+class MeshVisualController : public ConnectionTracker
 {
 public:
  
-  MeshRendererController( Application& application )
+  MeshVisualController( Application& application )
   : mApplication( application ),   //Store handle to the application.
     mModelIndex( 1 ),              //Start with metal robot.
-    mShaderIndex( 0 ),             //Start with all textures.
-    mSelectedModelIndex( 0 )       //Non-valid default, which will get set to a correct value when used.
+    mShadingModeIndex( 0 ),        //Start with textured with detailed specular lighting.
+    mTag( -1 ),                    //Non-valid default, which will get set to a correct value when used.
+    mSelectedModelIndex( -1 ),     //Non-valid default, which will get set to a correct value when used.
+    mPaused( false )               //Animations play by default.
   {
     // Connect to the Application's Init signal
-    mApplication.InitSignal().Connect( this, &MeshRendererController::Create );
+    mApplication.InitSignal().Connect( this, &MeshVisualController::Create );
   }
  
-  ~MeshRendererController()
+  ~MeshVisualController()
   {
   }
  
@@ -82,7 +89,7 @@ public:
     LoadScene();
  
     //Allow for exiting of the application via key presses.
-    stage.KeyEventSignal().Connect( this, &MeshRendererController::OnKeyEvent );
+    stage.KeyEventSignal().Connect( this, &MeshVisualController::OnKeyEvent );
   }
  
   //Sets up the on-screen elements.
@@ -90,25 +97,24 @@ public:
   {
     Stage stage = Stage::GetCurrent();
  
-    //Set up 3D layer to place objects on.
-    Layer layer = Layer::New();
-    layer.SetParentOrigin( ParentOrigin::CENTER );
-    layer.SetAnchorPoint( AnchorPoint::CENTER );
-    layer.SetResizePolicy( ResizePolicy::FILL_TO_PARENT, Dimension::ALL_DIMENSIONS );
-    layer.SetBehavior( Layer::LAYER_2D ); //We use a 2D layer as this is closer to UI work than full 3D scene creation.
-    layer.SetDepthTestDisabled( false ); //Enable depth testing, as otherwise the 2D layer would not do so.
-    stage.Add( layer );
-
-    //Create gesture detector for panning of models.
-    mPanGestureDetector = PanGestureDetector::New();
-    mPanGestureDetector.DetectedSignal().Connect( this, &MeshRendererController::OnPan );
-
-    //Add containers to house each renderer-holding-actor.
+    //Set up layer to place objects on.
+    Layer baseLayer = Layer::New();
+    baseLayer.SetParentOrigin( ParentOrigin::CENTER );
+    baseLayer.SetAnchorPoint( AnchorPoint::CENTER );
+    baseLayer.SetResizePolicy( ResizePolicy::FILL_TO_PARENT, Dimension::ALL_DIMENSIONS );
+    baseLayer.SetBehavior( Layer::LAYER_2D ); //We use a 2D layer as this is closer to UI work than full 3D scene creation.
+    baseLayer.SetDepthTestDisabled( false ); //Enable depth testing, as otherwise the 2D layer would not do so.
+    baseLayer.RegisterProperty( "Tag", LAYER_TAG ); //Used to differentiate between different kinds of actor.
+    baseLayer.TouchedSignal().Connect( this, &MeshVisualController::OnTouch );
+    stage.Add( baseLayer );
+
+    //Add containers to house each visual-holding-actor.
     for( int i = 0; i < NUM_MESHES; i++ )
     {
       mContainers[i] = Actor::New();
       mContainers[i].SetResizePolicy( ResizePolicy::SIZE_RELATIVE_TO_PARENT, Dimension::ALL_DIMENSIONS );
-      mContainers[i].RegisterProperty( "Tag", Property::Value( i ) ); //Used to identify the actor and index into the model.
+      mContainers[i].RegisterProperty( "Tag", MODEL_TAG ); //Used to differentiate between different kinds of actor.
+      mContainers[i].RegisterProperty( "Model", Property::Value( i ) ); //Used to index into the model.
  
       //Position each container on screen
       if( i == 0 )
@@ -133,8 +139,8 @@ public:
         mContainers[i].SetAnchorPoint( AnchorPoint::TOP_RIGHT );
       }
  
-      mPanGestureDetector.Attach( mContainers[i] );
-      layer.Add( mContainers[i] );
+      mContainers[i].TouchedSignal().Connect( this, &MeshVisualController::OnTouch );
+      baseLayer.Add( mContainers[i] );
     }
  
     //Set up models
@@ -168,20 +174,66 @@ public:
     //Create button for model changing
     Toolkit::PushButton modelButton = Toolkit::PushButton::New();
     modelButton.SetResizePolicy( ResizePolicy::USE_NATURAL_SIZE, Dimension::ALL_DIMENSIONS );
-    modelButton.ClickedSignal().Connect( this, &MeshRendererController::OnChangeModelClicked );
-    modelButton.SetParentOrigin( Vector3( 0.1, 0.95, 0.5 ) ); //Offset from bottom left
+    modelButton.ClickedSignal().Connect( this, &MeshVisualController::OnChangeModelClicked );
+    modelButton.SetParentOrigin( Vector3( 0.05, 0.95, 0.5 ) ); //Offset from bottom left
     modelButton.SetAnchorPoint( AnchorPoint::BOTTOM_LEFT );
     modelButton.SetLabelText( "Change Model" );
-    layer.Add( modelButton );
+    baseLayer.Add( modelButton );
  
     //Create button for shader changing
     Toolkit::PushButton shaderButton = Toolkit::PushButton::New();
     shaderButton.SetResizePolicy( ResizePolicy::USE_NATURAL_SIZE, Dimension::ALL_DIMENSIONS );
-    shaderButton.ClickedSignal().Connect( this, &MeshRendererController::OnChangeShaderClicked );
-    shaderButton.SetParentOrigin( Vector3( 0.9, 0.95, 0.5 ) ); //Offset from bottom right
+    shaderButton.ClickedSignal().Connect( this, &MeshVisualController::OnChangeShaderClicked );
+    shaderButton.SetParentOrigin( Vector3( 0.95, 0.95, 0.5 ) ); //Offset from bottom right
     shaderButton.SetAnchorPoint( AnchorPoint::BOTTOM_RIGHT );
     shaderButton.SetLabelText( "Change Shader" );
-    layer.Add( shaderButton );
+    baseLayer.Add( shaderButton );
+
+    //Create button for pausing animations
+    Toolkit::PushButton pauseButton = Toolkit::PushButton::New();
+    pauseButton.SetResizePolicy( ResizePolicy::USE_NATURAL_SIZE, Dimension::ALL_DIMENSIONS );
+    pauseButton.ClickedSignal().Connect( this, &MeshVisualController::OnPauseClicked );
+    pauseButton.SetParentOrigin( Vector3( 0.5, 0.95, 0.5 ) ); //Offset from bottom center
+    pauseButton.SetAnchorPoint( AnchorPoint::BOTTOM_CENTER );
+    pauseButton.SetLabelText( " || " );
+    baseLayer.Add( pauseButton );
+
+    //Create control to act as light source of scene.
+    mLightSource = Control::New();
+    mLightSource.SetResizePolicy( ResizePolicy::FIT_TO_CHILDREN, Dimension::WIDTH );
+    mLightSource.SetResizePolicy( ResizePolicy::DIMENSION_DEPENDENCY, Dimension::HEIGHT );
+    mLightSource.RegisterProperty( "Tag", LIGHT_TAG );
+
+    //Set position relative to top left, as the light source property is also relative to the top left.
+    mLightSource.SetParentOrigin( ParentOrigin::TOP_LEFT );
+    mLightSource.SetAnchorPoint( AnchorPoint::CENTER );
+    mLightSource.SetPosition( Stage::GetCurrent().GetSize().x * 0.5f, Stage::GetCurrent().GetSize().y * 0.1f );
+
+    //Make white background.
+    Property::Map lightMap;
+    lightMap.Insert( Visual::Property::TYPE,  Visual::COLOR );
+    lightMap.Insert( ColorVisual::Property::MIX_COLOR, Color::WHITE );
+    mLightSource.SetProperty( Control::Property::BACKGROUND, Property::Value( lightMap ) );
+
+    //Label to show what this actor is for the user.
+    TextLabel lightLabel = TextLabel::New( "Light" );
+    lightLabel.SetResizePolicy( ResizePolicy::USE_NATURAL_SIZE, Dimension::ALL_DIMENSIONS );
+    lightLabel.SetParentOrigin( ParentOrigin::CENTER );
+    lightLabel.SetAnchorPoint( AnchorPoint::CENTER );
+    float padding = 5.0f;
+    lightLabel.SetPadding( Padding( padding, padding, padding, padding ) );
+    mLightSource.Add( lightLabel );
+
+    //Connect to touch signal for dragging.
+    mLightSource.TouchedSignal().Connect( this, &MeshVisualController::OnTouch );
+
+    //Place the light source on a layer above the base, so that it is rendered above everything else.
+    Layer upperLayer = Layer::New();
+    baseLayer.Add( upperLayer );
+    upperLayer.Add( mLightSource );
+
+    //Calling this sets the light position of each model to that of the light source control.
+    UpdateLight();
   }
  
   //Updates the displayed models to account for parameter changes.
@@ -189,11 +241,12 @@ public:
   {
     //Create mesh property map
     Property::Map map;
-    map.Insert( "rendererType", "MESH" );
-    map.Insert( "objectUrl", MODEL_FILE[mModelIndex] );
-    map.Insert( "materialUrl", MATERIAL_FILE[mModelIndex] );
-    map.Insert( "texturesPath", TEXTURES_PATH );
-    map.Insert( "shaderType", SHADER_TYPE[mShaderIndex] );
+    map.Insert( Visual::Property::TYPE,  Visual::MESH );
+    map.Insert( MeshVisual::Property::OBJECT_URL, MODEL_FILE[mModelIndex] );
+    map.Insert( MeshVisual::Property::MATERIAL_URL, MATERIAL_FILE[mModelIndex] );
+    map.Insert( MeshVisual::Property::TEXTURES_PATH, TEXTURES_PATH );
+    map.Insert( MeshVisual::Property::SHADING_MODE, SHADING_MODE_TABLE[mShadingModeIndex] );
+    map.Insert( MeshVisual::Property::USE_SOFT_NORMALS, false );
  
     //Set the two controls to use the mesh
     for( int i = 0; i < NUM_MESHES; i++ )
@@ -202,53 +255,101 @@ public:
     }
   }
  
-  //Rotates the panned model based on the gesture.
-  void OnPan( Actor actor, const PanGesture& gesture )
+  //Updates the light position for each model to account for changes in the source on screen.
+  void UpdateLight()
   {
-    switch( gesture.state )
+    //Set light position to the x and y of the light control, offset out of the screen.
+    Vector3 controlPosition = mLightSource.GetCurrentPosition();
+    Vector3 lightPosition = Vector3( controlPosition.x, controlPosition.y, Stage::GetCurrent().GetSize().x * 2.0f );
+
+    for( int i = 0; i < NUM_MESHES; ++i )
     {
-      case Gesture::Started:
-      {
-        //Find out which model has been selected
-        actor.GetProperty( actor.GetPropertyIndex( "Tag" ) ).Get( mSelectedModelIndex );
+      mModels[i].control.RegisterProperty( "lightPosition", lightPosition, Property::ANIMATABLE );
+    }
+  }
  
-        //Pause current animation, as the gesture will be used to manually rotate the model
-        mModels[mSelectedModelIndex].rotationAnimation.Pause();
+  //If the light source is touched, move it by dragging it.
+  //If a model is touched, rotate it by panning around.
+  bool OnTouch( Actor actor, const TouchEvent& event )
+  {
+    //Get primary touch point.
+    const Dali::TouchPoint& point = event.GetPoint( 0 );
  
-        break;
-      }
-      case Gesture::Continuing:
+    switch( point.state )
+    {
+      case TouchPoint::Down:
       {
-        //Rotate based off the gesture.
-        mModels[mSelectedModelIndex].rotation.x -= gesture.displacement.y / X_ROTATION_DISPLACEMENT_FACTOR; // Y displacement rotates around X axis
-        mModels[mSelectedModelIndex].rotation.y += gesture.displacement.x / Y_ROTATION_DISPLACEMENT_FACTOR; // X displacement rotates around Y axis
-        Quaternion rotation = Quaternion( Radian( mModels[mSelectedModelIndex].rotation.x ), Vector3::XAXIS) *
-                              Quaternion( Radian( mModels[mSelectedModelIndex].rotation.y ), Vector3::YAXIS);
+        //Determine what was touched.
+        actor.GetProperty( actor.GetPropertyIndex( "Tag" ) ).Get( mTag );
+
+        if( mTag == MODEL_TAG )
+        {
+          //Find out which model has been selected
+          actor.GetProperty( actor.GetPropertyIndex( "Model" ) ).Get( mSelectedModelIndex );
+
+          //Pause current animation, as the touch gesture will be used to manually rotate the model
+          mModels[mSelectedModelIndex].rotationAnimation.Pause();
  
-        mModels[mSelectedModelIndex].control.SetOrientation( rotation );
+          //Store start points.
+          mPanStart = point.screen;
+          mRotationStart = mModels[mSelectedModelIndex].rotation;
+        }
  
         break;
       }
-      case Gesture::Finished:
+      case TouchPoint::Motion:
       {
-        //Return to automatic animation
-        mModels[mSelectedModelIndex].rotationAnimation.Play();
+        //Switch on the kind of actor we're interacting with.
+        switch( mTag )
+        {
+          case MODEL_TAG: //Rotate model
+          {
+            //Calculate displacement and corresponding rotation.
+            Vector2 displacement = point.screen - mPanStart;
+            mModels[mSelectedModelIndex].rotation = Vector2( mRotationStart.x - displacement.y / Y_ROTATION_DISPLACEMENT_FACTOR,   // Y displacement rotates around X axis
+                                                             mRotationStart.y + displacement.x / X_ROTATION_DISPLACEMENT_FACTOR ); // X displacement rotates around Y axis
+            Quaternion rotation = Quaternion( Radian( mModels[mSelectedModelIndex].rotation.x ), Vector3::XAXIS) *
+                                  Quaternion( Radian( mModels[mSelectedModelIndex].rotation.y ), Vector3::YAXIS);
+
+            //Apply rotation.
+            mModels[mSelectedModelIndex].control.SetOrientation( rotation );
+
+            break;
+          }
+          case LIGHT_TAG: //Drag light
+          {
+            //Set light source to new position and update the models accordingly.
+            mLightSource.SetPosition( Vector3( point.screen ) );
+            UpdateLight();
+
+            break;
+          }
+        }
  
         break;
       }
-      case Gesture::Cancelled:
+      case TouchPoint::Interrupted: //Same as finished.
+      case TouchPoint::Finished:
       {
-        //Return to automatic animation
-        mModels[mSelectedModelIndex].rotationAnimation.Play();
+        if( mTag == MODEL_TAG )
+        {
+          //Return to automatic animation
+          if( !mPaused )
+          {
+            mModels[mSelectedModelIndex].rotationAnimation.Play();
+          }
+        }
  
         break;
       }
       default:
       {
-        //We can ignore other gestures and gesture states.
+        //Other touch states do nothing.
         break;
       }
     }
+
+    return true;
   }
  
   //Cycle through the list of models.
@@ -264,13 +365,43 @@ public:
   //Cycle through the list of shaders.
   bool OnChangeShaderClicked( Toolkit::Button button )
   {
-    ++mShaderIndex %= 3;
+    ++mShadingModeIndex %= 3;
  
     ReloadModel();
  
     return true;
   }
  
+  //Pause all animations, and keep them paused even after user panning.
+  //This button is a toggle, so pressing again will start the animations again.
+  bool OnPauseClicked( Toolkit::Button button )
+  {
+    //Toggle pause state.
+    mPaused = !mPaused;
+
+    //If we wish to pause animations, do so and keep them paused.
+    if( mPaused )
+    {
+      for( int i = 0; i < NUM_MESHES ; ++i )
+      {
+        mModels[i].rotationAnimation.Pause();
+      }
+
+      button.SetLabelText( " > " );
+    }
+    else //Unpause all animations again.
+    {
+      for( int i = 0; i < NUM_MESHES ; ++i )
+      {
+        mModels[i].rotationAnimation.Play();
+      }
+
+      button.SetLabelText( " || " );
+    }
+
+    return true;
+  }
+
   //If escape or the back button is pressed, quit the application (and return to the launcher)
   void OnKeyEvent( const KeyEvent& event )
   {
@@ -290,28 +421,26 @@ private:
   Model mModels[NUM_MESHES];
   Actor mContainers[NUM_MESHES];
  
+  //Acts as a global light source, which can be dragged around.
+  Control mLightSource;
+
   //Used to detect panning to rotate the selected model.
-  PanGestureDetector mPanGestureDetector;
+  Vector2 mPanStart;
+  Vector2 mRotationStart;
  
   int mModelIndex; //Index of model to load.
-  int mShaderIndex; //Index of shader type to use.
+  int mShadingModeIndex; //Index of shader type to use.
+  int mTag; //Identifies what kind of actor has been selected in OnTouch.
   int mSelectedModelIndex; //Index of model selected on screen.
+  bool mPaused; //If true, all animations are paused and should stay so.
 };
  
-void RunTest( Application& application )
-{
-  MeshRendererController test( application );
-
-  application.MainLoop();
-}
-
 // Entry point for Linux & Tizen applications
 //
 int main( int argc, char **argv )
 {
   Application application = Application::New( &argc, &argv );
-
-  RunTest( application );
-
+  MeshVisualController test( application );
+  application.MainLoop();
   return 0;
 }
@@ -198,8 +198,6 @@ public:
     mModelCounter = (mModelCounter + 1) % MODEL_NUMBER;
     mModel3dView.SetProperty(Model3dView::Property::GEOMETRY_URL, MODEL_FILE[mModelCounter]);
     mModel3dView.SetProperty(Model3dView::Property::MATERIAL_URL, MATERIAL_FILE[mModelCounter]);
-    mModel3dView.SetProperty(Model3dView::Property::IMAGES_URL, IMAGE_PATH);
-
     return true;
   }
  
@@ -103,13 +103,13 @@ const float ORIENTATION_DURATION = 0.5f;                  ///&lt; Time to rotate to
 void SetImageFittedInBox( ImageView& imageView, Property::Map& shaderEffect, const char * const imagePath, int maxWidth, int maxHeight )
 {
   Property::Map map;
-  map["rendererType"] = "IMAGE";
-  map["url"] = imagePath;
+  map[Visual::Property::TYPE] = Visual::IMAGE;
+  map[ImageVisual::Property::URL] = imagePath;
   // Load the image nicely scaled-down to fit within the specified max width and height:
-  map["desiredWidth"] = maxWidth;
-  map["desiredHeight"] = maxHeight;
-  map["fittingMode"] = "SHRINK_TO_FIT";
-  map["samplingMode"] = "BOX_THEN_LINEAR";
+  map[ImageVisual::Property::DESIRED_WIDTH] = maxWidth;
+  map[ImageVisual::Property::DESIRED_HEIGHT] = maxHeight;
+  map[ImageVisual::Property::FITTING_MODE] = FittingMode::SHRINK_TO_FIT;
+  map[ImageVisual::Property::SAMPLING_MODE] = SamplingMode::BOX_THEN_LINEAR;
   map.Merge( shaderEffect );
  
   imageView.SetProperty( ImageView::Property::IMAGE, map );
@@ -200,7 +200,9 @@ public:
  
     // create a offscreen renderer task to render content into the native image source
     Texture nativeTexture = Texture::New( *nativeImageSourcePtr );
-    FrameBuffer targetBuffer = FrameBuffer::New( nativeTexture.GetWidth(), nativeTexture.GetHeight(), FrameBuffer::COLOR );
+    // Create a FrameBuffer object with no default attachments.
+    FrameBuffer targetBuffer = FrameBuffer::New( nativeTexture.GetWidth(), nativeTexture.GetHeight(), FrameBuffer::Attachment::NONE );
+    // Add a color attachment to the FrameBuffer object.
     targetBuffer.AttachColorTexture( nativeTexture );
  
     CameraActor cameraActor = CameraActor::New(imageSize);
@@ -105,7 +105,7 @@ Geometry CreateGeometry()
   // Create the geometry object
   Geometry polyhedraGeometry = Geometry::New();
   polyhedraGeometry.AddVertexBuffer( polyhedraVertices );
-  polyhedraGeometry.SetGeometryType( Geometry::POINTS );
+  polyhedraGeometry.SetType( Geometry::POINTS );
  
   return polyhedraGeometry;
 }
@@ -19,15 +19,6 @@ namespace
     DEMO_IMAGE_DIR "octahedron-button.png"
   };
  
-  //Shape names
-  const char * const SHAPE_SPHERE = "SPHERE";
-  const char * const SHAPE_CONE = "CONE";
-  const char * const SHAPE_CONICAL_FRUSTRUM = "CONICAL_FRUSTRUM";
-  const char * const SHAPE_CYLINDER = "CYLINDER";
-  const char * const SHAPE_CUBE = "CUBE";
-  const char * const SHAPE_BEVELLED_CUBE = "BEVELLED_CUBE";
-  const char * const SHAPE_OCTAHEDRON = "OCTAHEDRON";
-
   //Shape property defaults
   const int DEFAULT_SLICES = 32;
   const int DEFAULT_STACKS = 32;
@@ -278,7 +269,7 @@ public:
   //
   void SetupModel( Layer layer )
   {
-    //Create a container to house the renderer-holding actor, to provide a constant hitbox.
+    //Create a container to house the visual-holding actor, to provide a constant hitbox.
     Actor container = Actor::New();
     container.SetResizePolicy( ResizePolicy::SIZE_RELATIVE_TO_PARENT, Dimension::ALL_DIMENSIONS );
     container.SetSizeModeFactor( Vector3( 0.9, 0.3, 0.0 ) );  //90% of width, 30% of height.
@@ -309,7 +300,7 @@ public:
     mPanGestureDetector.DetectedSignal().Connect( this, &PrimitiveShapesController::OnPan );
   }
  
-  //Clears all sliders and resets the primitive renderer property map.
+  //Clears all sliders and resets the primitive visual property map.
   void InitialiseSlidersAndModel()
   {
     //Sliders
@@ -321,10 +312,10 @@ public:
       mSliderLabels.at( i ).SetVisible( false );
     }
  
-    //Renderer map for model
-    mRendererMap.Clear();
-    mRendererMap[ "rendererType" ] = "PRIMITIVE";
-    mRendererMap[ "color"        ] = mColor;
+    //Visual map for model
+    mVisualMap.Clear();
+    mVisualMap[ Visual::Property::TYPE           ] = Visual::PRIMITIVE;
+    mVisualMap[ PrimitiveVisual::Property::COLOR ] = mColor;
   }
  
   //Sets the 3D model to a sphere and modifies the sliders appropriately.
@@ -332,19 +323,19 @@ public:
   {
     InitialiseSlidersAndModel();
  
-    //Set up specific renderer properties.
-    mRendererMap[ "shape"        ] = SHAPE_SPHERE;
-    mRendererMap[ "slices"       ] = DEFAULT_SLICES;
-    mRendererMap[ "stacks"       ] = DEFAULT_STACKS;
+    //Set up specific visual properties.
+    mVisualMap[ PrimitiveVisual::Property::SHAPE  ] = PrimitiveVisual::Shape::SPHERE;
+    mVisualMap[ PrimitiveVisual::Property::SLICES ] = DEFAULT_SLICES;
+    mVisualMap[ PrimitiveVisual::Property::STACKS ] = DEFAULT_STACKS;
  
     //Set up sliders.
-    SetupSlider( 0, SLICES_LOWER_BOUND, SLICES_UPPER_BOUND, DEFAULT_STACKS, "slices" );
+    SetupSlider( 0, SLICES_LOWER_BOUND, SLICES_UPPER_BOUND, DEFAULT_STACKS, PrimitiveVisual::Property::SLICES, "slices" );
     SetupMarks( mSliders.at( 0 ), SLICES_LOWER_BOUND, SLICES_UPPER_BOUND );
-    SetupSlider( 1, STACKS_LOWER_BOUND, STACKS_UPPER_BOUND, DEFAULT_STACKS, "stacks" );
+    SetupSlider( 1, STACKS_LOWER_BOUND, STACKS_UPPER_BOUND, DEFAULT_STACKS, PrimitiveVisual::Property::STACKS, "stacks" );
     SetupMarks( mSliders.at( 1 ), STACKS_LOWER_BOUND, STACKS_UPPER_BOUND );
  
     //Set model in control.
-    mModel.SetProperty( Control::Property::BACKGROUND, Property::Value( mRendererMap ) );
+    mModel.SetProperty( Control::Property::BACKGROUND, Property::Value( mVisualMap ) );
   }
  
   //Sets the 3D model to a cone and modifies the sliders appropriately.
@@ -352,20 +343,20 @@ public:
   {
     InitialiseSlidersAndModel();
  
-    //Set up specific renderer properties.
-    mRendererMap[ "shape"             ] = SHAPE_CONE;
-    mRendererMap[ "scaleHeight"       ] = DEFAULT_SCALE_HEIGHT;
-    mRendererMap[ "scaleBottomRadius" ] = DEFAULT_SCALE_BOTTOM_RADIUS;
-    mRendererMap[ "slices"            ] = DEFAULT_SLICES;
+    //Set up specific visual properties.
+    mVisualMap[ PrimitiveVisual::Property::SHAPE               ] = PrimitiveVisual::Shape::CONE;
+    mVisualMap[ PrimitiveVisual::Property::SCALE_HEIGHT        ] = DEFAULT_SCALE_HEIGHT;
+    mVisualMap[ PrimitiveVisual::Property::SCALE_BOTTOM_RADIUS ] = DEFAULT_SCALE_BOTTOM_RADIUS;
+    mVisualMap[ PrimitiveVisual::Property::SLICES              ] = DEFAULT_SLICES;
  
     //Set up sliders.
-    SetupSlider( 0, 1.0f, 32.0f, DEFAULT_SCALE_HEIGHT, "scaleHeight" );
-    SetupSlider( 1, 1.0f, 32.0f, DEFAULT_SCALE_BOTTOM_RADIUS, "scaleBottomRadius" );
-    SetupSlider( 2, SLICES_LOWER_BOUND, SLICES_UPPER_BOUND, DEFAULT_STACKS, "slices" );
+    SetupSlider( 0, 1.0f, 32.0f, DEFAULT_SCALE_HEIGHT, PrimitiveVisual::Property::SCALE_HEIGHT, "scaleHeight" );
+    SetupSlider( 1, 1.0f, 32.0f, DEFAULT_SCALE_BOTTOM_RADIUS, PrimitiveVisual::Property::SCALE_BOTTOM_RADIUS, "scaleBottomRadius" );
+    SetupSlider( 2, SLICES_LOWER_BOUND, SLICES_UPPER_BOUND, DEFAULT_STACKS, PrimitiveVisual::Property::SLICES, "slices" );
     SetupMarks( mSliders.at( 2 ), SLICES_LOWER_BOUND, SLICES_UPPER_BOUND );
  
     //Set model in control.
-    mModel.SetProperty( Control::Property::BACKGROUND, Property::Value( mRendererMap ) );
+    mModel.SetProperty( Control::Property::BACKGROUND, Property::Value( mVisualMap ) );
   }
  
   //Sets the 3D model to a conical frustrum and modifies the sliders appropriately.
@@ -373,20 +364,20 @@ public:
   {
     InitialiseSlidersAndModel();
  
-    //Set up specific renderer properties.
-    mRendererMap[ "shape"             ] = SHAPE_CONICAL_FRUSTRUM;
-    mRendererMap[ "scaleTopRadius"    ] = DEFAULT_SCALE_TOP_RADIUS;
-    mRendererMap[ "scaleBottomRadius" ] = DEFAULT_SCALE_BOTTOM_RADIUS;
-    mRendererMap[ "scaleHeight"       ] = DEFAULT_SCALE_HEIGHT;
-    mRendererMap[ "slices"            ] = DEFAULT_SLICES;
+    //Set up specific visual properties.
+    mVisualMap[ PrimitiveVisual::Property::SHAPE               ] = PrimitiveVisual::Shape::CONICAL_FRUSTRUM;
+    mVisualMap[ PrimitiveVisual::Property::SCALE_TOP_RADIUS    ] = DEFAULT_SCALE_TOP_RADIUS;
+    mVisualMap[ PrimitiveVisual::Property::SCALE_BOTTOM_RADIUS ] = DEFAULT_SCALE_BOTTOM_RADIUS;
+    mVisualMap[ PrimitiveVisual::Property::SCALE_HEIGHT        ] = DEFAULT_SCALE_HEIGHT;
+    mVisualMap[ PrimitiveVisual::Property::SLICES              ] = DEFAULT_SLICES;
  
     //Set up used sliders.
-    SetupSlider( 0, 1.0f, 32.0f, DEFAULT_SCALE_HEIGHT, "scaleHeight" );
-    SetupSlider( 1, 0.0f, 32.0f, DEFAULT_SCALE_BOTTOM_RADIUS, "scaleBottomRadius" );
-    SetupSlider( 2, 0.0f, 32.0f, DEFAULT_SCALE_TOP_RADIUS, "scaleTopRadius" );
+    SetupSlider( 0, 1.0f, 32.0f, DEFAULT_SCALE_HEIGHT, PrimitiveVisual::Property::SCALE_HEIGHT, "scaleHeight" );
+    SetupSlider( 1, 0.0f, 32.0f, DEFAULT_SCALE_BOTTOM_RADIUS, PrimitiveVisual::Property::SCALE_BOTTOM_RADIUS, "scaleBottomRadius" );
+    SetupSlider( 2, 0.0f, 32.0f, DEFAULT_SCALE_TOP_RADIUS, PrimitiveVisual::Property::SCALE_TOP_RADIUS, "scaleTopRadius" );
  
     //Set model in control.
-    mModel.SetProperty( Control::Property::BACKGROUND, Property::Value( mRendererMap ) );
+    mModel.SetProperty( Control::Property::BACKGROUND, Property::Value( mVisualMap ) );
   }
  
   //Sets the 3D model to a cylinder and modifies the sliders appropriately.
@@ -394,20 +385,20 @@ public:
   {
     InitialiseSlidersAndModel();
  
-    //Set up specific renderer properties.
-    mRendererMap[ "shape"        ] = SHAPE_CYLINDER;
-    mRendererMap[ "scaleHeight"  ] = DEFAULT_SCALE_HEIGHT;
-    mRendererMap[ "scaleRadius"  ] = DEFAULT_SCALE_RADIUS;
-    mRendererMap[ "slices"       ] = DEFAULT_SLICES;
+    //Set up specific visual properties.
+    mVisualMap[ PrimitiveVisual::Property::SHAPE        ] = PrimitiveVisual::Shape::CYLINDER;
+    mVisualMap[ PrimitiveVisual::Property::SCALE_HEIGHT ] = DEFAULT_SCALE_HEIGHT;
+    mVisualMap[ PrimitiveVisual::Property::SCALE_RADIUS ] = DEFAULT_SCALE_RADIUS;
+    mVisualMap[ PrimitiveVisual::Property::SLICES       ] = DEFAULT_SLICES;
  
     //Set up used sliders.
-    SetupSlider( 0, 1.0f, 32.0f, DEFAULT_SCALE_HEIGHT, "scaleHeight" );
-    SetupSlider( 1, 1.0f, 32.0f, DEFAULT_SCALE_RADIUS, "scaleRadius" );
-    SetupSlider( 2, SLICES_LOWER_BOUND, SLICES_UPPER_BOUND, DEFAULT_STACKS, "slices" );
+    SetupSlider( 0, 1.0f, 32.0f, DEFAULT_SCALE_HEIGHT, PrimitiveVisual::Property::SCALE_HEIGHT, "scaleHeight" );
+    SetupSlider( 1, 1.0f, 32.0f, DEFAULT_SCALE_RADIUS, PrimitiveVisual::Property::SCALE_RADIUS, "scaleRadius" );
+    SetupSlider( 2, SLICES_LOWER_BOUND, SLICES_UPPER_BOUND, DEFAULT_STACKS, PrimitiveVisual::Property::SLICES, "slices" );
     SetupMarks( mSliders.at( 2 ), SLICES_LOWER_BOUND, SLICES_UPPER_BOUND );
  
     //Set model in control.
-    mModel.SetProperty( Control::Property::BACKGROUND, Property::Value( mRendererMap ) );
+    mModel.SetProperty( Control::Property::BACKGROUND, Property::Value( mVisualMap ) );
   }
  
   //Sets the 3D model to a cube and modifies the sliders appropriately.
@@ -415,11 +406,11 @@ public:
   {
     InitialiseSlidersAndModel();
  
-    //Set up specific renderer properties.
-    mRendererMap[ "shape" ] = SHAPE_CUBE;
+    //Set up specific visual properties.
+    mVisualMap[ PrimitiveVisual::Property::SHAPE ] = PrimitiveVisual::Shape::CUBE;
  
     //Set model in control.
-    mModel.SetProperty( Control::Property::BACKGROUND, Property::Value( mRendererMap ) );
+    mModel.SetProperty( Control::Property::BACKGROUND, Property::Value( mVisualMap ) );
   }
  
   //Sets the 3D model to a bevelled cube and modifies the sliders appropriately.
@@ -427,17 +418,17 @@ public:
   {
     InitialiseSlidersAndModel();
  
-    //Set up specific renderer properties.
-    mRendererMap[ "shape"           ] = SHAPE_BEVELLED_CUBE;
-    mRendererMap[ "bevelPercentage" ] = DEFAULT_BEVEL_PERCENTAGE;
-    mRendererMap[ "bevelSmoothness" ] = DEFAULT_BEVEL_SMOOTHNESS;
+    //Set up specific visual properties.
+    mVisualMap[ PrimitiveVisual::Property::SHAPE            ] = PrimitiveVisual::Shape::BEVELLED_CUBE;
+    mVisualMap[ PrimitiveVisual::Property::BEVEL_PERCENTAGE ] = DEFAULT_BEVEL_PERCENTAGE;
+    mVisualMap[ PrimitiveVisual::Property::BEVEL_SMOOTHNESS ] = DEFAULT_BEVEL_SMOOTHNESS;
  
     //Set up used sliders.
-    SetupSlider( 0, 0.0f, 1.0f, DEFAULT_BEVEL_PERCENTAGE, "bevelPercentage" );
-    SetupSlider( 1, 0.0f, 1.0f, DEFAULT_BEVEL_SMOOTHNESS, "bevelSmoothness" );
+    SetupSlider( 0, 0.0f, 1.0f, DEFAULT_BEVEL_PERCENTAGE, PrimitiveVisual::Property::BEVEL_PERCENTAGE, "bevelPercentage" );
+    SetupSlider( 1, 0.0f, 1.0f, DEFAULT_BEVEL_SMOOTHNESS, PrimitiveVisual::Property::BEVEL_SMOOTHNESS, "bevelSmoothness" );
  
     //Set model in control.
-    mModel.SetProperty( Control::Property::BACKGROUND, Property::Value( mRendererMap ) );
+    mModel.SetProperty( Control::Property::BACKGROUND, Property::Value( mVisualMap ) );
   }
  
   //Sets the 3D model to an octahedron and modifies the sliders appropriately.
@@ -445,20 +436,20 @@ public:
   {
     InitialiseSlidersAndModel();
  
-    //Set up specific renderer properties.
-    mRendererMap[ "shape" ] = SHAPE_OCTAHEDRON;
+    //Set up specific visual properties.
+    mVisualMap[ PrimitiveVisual::Property::SHAPE ] = PrimitiveVisual::Shape::OCTAHEDRON;
  
     //Set model in control.
-    mModel.SetProperty( Control::Property::BACKGROUND, Property::Value( mRendererMap ) );
+    mModel.SetProperty( Control::Property::BACKGROUND, Property::Value( mVisualMap ) );
   }
  
   //Sets up the slider at the given index for the supplied property, and labels it appropriately.
-  // rendererPropertyLabel is the property that will be set by this slider.
+  // visualProperty is the property that will be set by this slider.
   void SetupSlider( int sliderIndex, float lowerBound, float upperBound, float startPoint,
-                    std::string rendererPropertyLabel )
+                    Property::Index visualProperty, std::string visualPropertyLabel )
   {
     //Set up the slider itself.
-    mSliders.at( sliderIndex ).RegisterProperty( "rendererProperty", Property::Value( rendererPropertyLabel ), Property::READ_WRITE );
+    mSliders.at( sliderIndex ).RegisterProperty( "visualProperty", Property::Value( visualProperty ), Property::READ_WRITE );
     mSliders.at( sliderIndex ).SetProperty( Slider::Property::LOWER_BOUND, Property::Value( lowerBound ) );
     mSliders.at( sliderIndex ).SetProperty( Slider::Property::UPPER_BOUND, Property::Value( upperBound ) );
     mSliders.at( sliderIndex ).SetProperty( Slider::Property::VALUE, Property::Value( startPoint ) );
@@ -468,7 +459,7 @@ public:
     //We reset the TextLabel to force a relayout of the table.
     mSliderTable.RemoveChildAt( TableView::CellPosition(sliderIndex, 0) );
  
-    TextLabel sliderLabel = TextLabel::New( rendererPropertyLabel );
+    TextLabel sliderLabel = TextLabel::New( visualPropertyLabel );
     sliderLabel.SetParentOrigin( ParentOrigin::CENTER );
     sliderLabel.SetAnchorPoint( AnchorPoint::CENTER );
     sliderLabel.SetResizePolicy( ResizePolicy::USE_NATURAL_SIZE, Dimension::ALL_DIMENSIONS );
@@ -547,13 +538,13 @@ public:
   //When the slider is adjusted, change the corresponding shape property accordingly.
   bool OnSliderValueChanged( Slider slider, float value )
   {
-    //Update property map to reflect the change to the specific renderer property.
-    std::string rendererPropertyLabel;
-    slider.GetProperty( slider.GetPropertyIndex( "rendererProperty" ) ).Get( rendererPropertyLabel );
-    mRendererMap[ rendererPropertyLabel ] = value;
+    //Update property map to reflect the change to the specific visual property.
+    int visualProperty;
+    slider.GetProperty( slider.GetPropertyIndex( "visualProperty" ) ).Get( visualProperty );
+    mVisualMap[ visualProperty ] = value;
  
     //Reload the model to display the change.
-    mModel.SetProperty( Control::Property::BACKGROUND, Property::Value( mRendererMap ) );
+    mModel.SetProperty( Control::Property::BACKGROUND, Property::Value( mVisualMap ) );
  
     return true;
   }
@@ -622,8 +613,8 @@ private:
   std::vector<TextLabel> mSliderLabels; ///< Holds the labels to each slider.
   TableView mSliderTable; ///< A table to layout the sliders next to their labels.
  
-  Property::Map mRendererMap; ///< Property map to create a primitive renderer.
-  Control mModel; ///< Control to house the primitive renderer.
+  Property::Map mVisualMap; ///< Property map to create a primitive visual.
+  Control mModel; ///< Control to house the primitive visual.
  
   PanGestureDetector mPanGestureDetector; ///< Detects pan gestures for rotation of the model.
   Animation mRotationAnimation; ///< Automatically rotates the model, unless it is being panned.
+/*
+ * Copyright (c) 2016 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.
+ *
+ */
+
+// EXTERNAL INCLUDES
+#include <dali-toolkit/dali-toolkit.h>
+#include <dali/devel-api/adaptor-framework/bitmap-loader.h>
+
+// INTERNAL INCLUDES
+#include "renderer-stencil-shaders.h"
+#include "shared/view.h"
+#include "shared/utility.h"
+
+using namespace Dali;
+
+namespace
+{
+
+// Constants:
+
+// Application constants:
+const char * const APPLICATION_TITLE( "Renderer Stencil API Demo" );
+const char * const TOOLBAR_IMAGE( DEMO_IMAGE_DIR "top-bar.png" );
+const char * const BACKGROUND_IMAGE( DEMO_IMAGE_DIR "background-gradient.jpg" );
+
+// Texture filenames:
+const char * const CUBE_TEXTURE( DEMO_IMAGE_DIR "people-medium-1.jpg" );
+const char * const FLOOR_TEXTURE( DEMO_IMAGE_DIR "wood.png" );
+
+// Scale dimensions: These values are relative to the stage size. EG. width = 0.32f * stageSize.
+const float   CUBE_WIDTH_SCALE( 0.32f );                   ///< The width (and height + depth) of the main and reflection cubes.
+const Vector2 FLOOR_DIMENSION_SCALE( 0.67f, 0.017f );      ///< The width and height of the floor object.
+
+// Configurable animation characteristics:
+const float ANIMATION_ROTATION_DURATION( 10.0f );          ///< Time in seconds to rotate the scene 360 degrees around Y.
+const float ANIMATION_BOUNCE_TOTAL_TIME( 1.6f );           ///< Time in seconds to perform 1 full bounce animation cycle.
+const float ANIMATION_BOUNCE_DEFORMATION_TIME( 0.4f );     ///< Time in seconds that the cube deformation animation will occur for (on contact with the floor).
+const float ANIMATION_BOUNCE_DEFORMATION_PERCENT( 20.0f ); ///< Percentage (of the cube's size) to deform the cube by (on contact with floor).
+const float ANIMATION_BOUNCE_HEIGHT_PERCENT( 40.0f );      ///< Percentage (of the cube's size) to bounce up in to the air by.
+
+// Base colors for the objects:
+const Vector4 CUBE_COLOR( 1.0f, 1.0f, 1.0f, 1.0f );        ///< White.
+const Vector4 FLOOR_COLOR( 1.0f, 1.0f, 1.0f, 1.0f );       ///< White.
+const Vector4 REFLECTION_COLOR( 0.6f, 0.6f, 0.6f, 0.6f );  ///< Note that alpha is not 1.0f, to make the blend more photo-realistic.
+
+// We need to control the draw order as we are controlling both the stencil and depth buffer per renderer.
+const int DEPTH_INDEX_GRANULARITY( 10000 );                ///< This value is the gap in depth-index in-between each renderer.
+
+} // Anonymous namespace
+
+/**
+ * @brief This example shows how to manipulate stencil and depth buffer properties within the Renderer API.
+ */
+class RendererStencilExample : public ConnectionTracker
+{
+public:
+
+  /**
+   * @brief Constructor.
+   * @param[in] application The DALi application object
+   */
+  RendererStencilExample( Application& application )
+  : mApplication( application )
+  {
+    // Connect to the Application's Init signal.
+    mApplication.InitSignal().Connect( this, &RendererStencilExample::Create );
+  }
+
+  /**
+   * @brief Destructor (non-virtual).
+   */
+  ~RendererStencilExample()
+  {
+  }
+
+private:
+
+  /**
+   * @brief Enum to facilitate more readable use of the cube array.
+   */
+  enum CubeType
+  {
+    MAIN_CUBE,      ///< The main cube that bounces above the floor object.
+    REFLECTION_CUBE ///< The reflected cube object.
+  };
+
+  /**
+   * @brief Struct to store the position, normal and texture coordinates of a single vertex.
+   */
+  struct TexturedVertex
+  {
+    Vector3 position;
+    Vector3 normal;
+    Vector2 textureCoord;
+  };
+
+  /**
+   * @brief This is the main scene setup method for this demo.
+   * This is called via the Init signal which is received once (only) during the Application lifetime.
+   * @param[in] application The DALi application object
+   */
+  void Create( Application& application )
+  {
+    Stage stage = Stage::GetCurrent();
+
+    // Creates a default view with a default tool-bar.
+    // The view is added to the stage.
+    Toolkit::ToolBar toolBar;
+    Layer toolBarLayer = DemoHelper::CreateView( application, mView, toolBar, BACKGROUND_IMAGE, TOOLBAR_IMAGE, APPLICATION_TITLE );
+    stage.Add( toolBarLayer );
+
+    // Layer to hold the 3D scene.
+    Layer layer = Layer::New();
+    layer.SetAnchorPoint( AnchorPoint::CENTER );
+    // Set the parent origin to a small percentage below the center (so the demo will scale for different resolutions).
+    layer.SetParentOrigin( Vector3( 0.5f, 0.58f, 0.5f ) );
+    layer.SetBehavior( Layer::LAYER_2D );
+    layer.SetDepthTestDisabled( false );
+    stage.Add( layer );
+
+    // Main cube:
+    // Make the demo scalable with different resolutions by basing
+    // the cube size on a percentage of the stage size.
+    float scaleSize( std::min( stage.GetSize().width, stage.GetSize().height ) );
+    float cubeWidth( scaleSize * CUBE_WIDTH_SCALE );
+    Vector3 cubeSize( cubeWidth, cubeWidth, cubeWidth );
+    // Create the geometry for the cube, and the texture.
+    Geometry cubeGeometry = CreateCubeVertices( Vector3::ONE, false );
+    TextureSet cubeTextureSet = CreateTextureSet( CUBE_TEXTURE );
+    // Create the cube object and add it.
+    // Note: The cube is anchored around its base for animation purposes, so the position can be zero.
+    mCubes[ MAIN_CUBE ] = CreateMainCubeObject( cubeGeometry, cubeSize, cubeTextureSet );
+    layer.Add( mCubes[ MAIN_CUBE ] );
+
+    // Floor:
+    float floorWidth( scaleSize * FLOOR_DIMENSION_SCALE.x );
+    Vector3 floorSize( floorWidth, scaleSize * FLOOR_DIMENSION_SCALE.y, floorWidth );
+    // Create the floor object using the cube geometry with a new size, and add it.
+    Actor floorObject( CreateFloorObject( cubeGeometry, floorSize ) );
+    layer.Add( floorObject );
+
+    // Stencil:
+    Vector3 planeSize( floorWidth, floorWidth, 0.0f );
+    // Create the stencil plane object, and add it.
+    Actor stencilPlaneObject( CreateStencilPlaneObject( planeSize ) );
+    layer.Add( stencilPlaneObject );
+
+    // Reflection cube:
+    // Create the reflection cube object and add it.
+    // Note: The cube is anchored around its base for animation purposes, so the position can be zero.
+    mCubes[ REFLECTION_CUBE ] = CreateReflectionCubeObject( cubeSize, cubeTextureSet );
+    layer.Add( mCubes[ REFLECTION_CUBE ] );
+
+    // Rotate the layer so we can see some of the top of the cube for a more 3D effect.
+    layer.SetProperty( Actor::Property::ORIENTATION, Quaternion( Degree( -24.0f ), Degree( 0.0f ), Degree( 0.0f ) ) );
+
+    // Set up the rotation on the Y axis.
+    mRotationAnimation = Animation::New( ANIMATION_ROTATION_DURATION );
+    float fullRotation = 360.0f;
+    mRotationAnimation.AnimateBy( Property( mCubes[ MAIN_CUBE ], Actor::Property::ORIENTATION ),
+                                 Quaternion( Degree( 0.0f ), Degree( fullRotation ), Degree( 0.0f ) ) );
+    mRotationAnimation.AnimateBy( Property( floorObject, Actor::Property::ORIENTATION ),
+                                 Quaternion( Degree( 0.0f ), Degree( fullRotation ), Degree( 0.0f ) ) );
+    // Note the stencil is pre-rotated by 90 degrees on X, so we rotate relatively on its Z axis for an equivalent Y rotation.
+    mRotationAnimation.AnimateBy( Property( stencilPlaneObject, Actor::Property::ORIENTATION ),
+                                 Quaternion( Degree( 0.0f ), Degree( 0.0f ), Degree( fullRotation ) ) );
+    mRotationAnimation.AnimateBy( Property( mCubes[ REFLECTION_CUBE ], Actor::Property::ORIENTATION ),
+                                 Quaternion( Degree( 0.0f ), Degree( fullRotation ), Degree( 0.0f ) ) );
+    mRotationAnimation.SetLooping( true );
+
+    // Set up the cube bouncing animation.
+    float totalTime = ANIMATION_BOUNCE_TOTAL_TIME;
+    float deformationTime = ANIMATION_BOUNCE_DEFORMATION_TIME;
+    // Percentage based amounts allows the bounce and deformation to scale for different resolution screens.
+    float deformationAmount = ANIMATION_BOUNCE_DEFORMATION_PERCENT / 100.0f;
+    float heightChange = ( cubeSize.y * ANIMATION_BOUNCE_HEIGHT_PERCENT ) / 100.0f;
+
+    // Animation pre-calculations:
+    float halfTime = totalTime / 2.0f;
+    float halfDeformationTime = deformationTime / 2.0f;
+
+    // First position the cubes at the top of the animation cycle.
+    mCubes[ MAIN_CUBE ].SetProperty(       Actor::Property::POSITION_Y, -heightChange );
+    mCubes[ REFLECTION_CUBE ].SetProperty( Actor::Property::POSITION_Y,  heightChange );
+
+    mBounceAnimation = Animation::New( totalTime );
+
+    // The animations for the main and reflected cubes are almost identical, so we combine the code to do both.
+    for( int cube = 0; cube < 2; ++cube )
+    {
+      // If iterating on the reflection cube, adjust the heightChange variable so the below code can be reused.
+      if( cube == 1 )
+      {
+        heightChange = -heightChange;
+      }
+
+      // 1st TimePeriod: Start moving down with increasing speed, until it is time to distort the cube due to impact.
+      mBounceAnimation.AnimateBy( Property( mCubes[ cube ], Actor::Property::POSITION_Y ),  heightChange, AlphaFunction::EASE_IN_SQUARE, TimePeriod( 0.0f, halfTime - halfDeformationTime ) );
+
+      // 2nd TimePeriod: The cube is touching the floor, start deforming it - then un-deform it again.
+      mBounceAnimation.AnimateBy( Property( mCubes[ cube ], Actor::Property::SCALE_X ),  deformationAmount, AlphaFunction::BOUNCE, TimePeriod( halfTime - halfDeformationTime, deformationTime ) );
+      mBounceAnimation.AnimateBy( Property( mCubes[ cube ], Actor::Property::SCALE_Z ),  deformationAmount, AlphaFunction::BOUNCE, TimePeriod( halfTime - halfDeformationTime, deformationTime ) );
+      mBounceAnimation.AnimateBy( Property( mCubes[ cube ], Actor::Property::SCALE_Y ), -deformationAmount, AlphaFunction::BOUNCE, TimePeriod( halfTime - halfDeformationTime, deformationTime ) );
+
+      // 3rd TimePeriod: Start moving up with decreasing speed, until at the apex of the animation.
+      mBounceAnimation.AnimateBy( Property( mCubes[ cube ], Actor::Property::POSITION_Y ), -heightChange, AlphaFunction::EASE_OUT_SQUARE, TimePeriod( halfTime + halfDeformationTime, halfTime - halfDeformationTime ) );
+    }
+
+    mBounceAnimation.SetLooping( true );
+
+    // Start the animations.
+    mRotationAnimation.Play();
+    mBounceAnimation.Play();
+
+    // Respond to a click anywhere on the stage
+    stage.GetRootLayer().TouchSignal().Connect( this, &RendererStencilExample::OnTouch );
+    // Connect signals to allow Back and Escape to exit.
+    stage.KeyEventSignal().Connect( this, &RendererStencilExample::OnKeyEvent );
+  }
+
+private:
+
+  // Methods to setup each component of the 3D scene:
+
+  /**
+   * @brief Creates the Main cube object.
+   * This creates the renderer from existing geometry (as the cubes geometry is shared).
+   * The texture is set and all relevant renderer properties are set-up.
+   * @param[in] geometry Pre-calculated cube geometry
+   * @param[in] size The desired cube size
+   * @param[in] textureSet A pre-existing TextureSet with a texture set up, to be applied to the cube
+   * @return An actor set-up containing the main cube object
+   */
+  Actor CreateMainCubeObject( Geometry& geometry, Vector3 size, TextureSet& textureSet )
+  {
+    Toolkit::Control container = Toolkit::Control::New();
+    container.SetAnchorPoint( AnchorPoint::BOTTOM_CENTER );
+    container.SetParentOrigin( ParentOrigin::BOTTOM_CENTER );
+    container.SetSize( size );
+    container.SetResizePolicy( ResizePolicy::FIXED, Dimension::ALL_DIMENSIONS );
+
+    // Create a renderer from the geometry and add the texture.
+    Renderer renderer = CreateRenderer( geometry, size, true, CUBE_COLOR );
+    renderer.SetTextures( textureSet );
+
+    // Setup the renderer properties:
+    // We are writing to the color buffer & culling back faces.
+    renderer.SetProperty( Renderer::Property::WRITE_TO_COLOR_BUFFER, true );
+    renderer.SetProperty( Renderer::Property::FACE_CULLING_MODE, FaceCullingMode::BACK );
+
+    // No stencil is used for the main cube.
+    renderer.SetProperty( Renderer::Property::STENCIL_MODE, StencilMode::OFF );
+
+    // We do need to write to the depth buffer as other objects need to appear underneath this cube.
+    renderer.SetProperty( Renderer::Property::DEPTH_WRITE_MODE, DepthWriteMode::ON );
+    // We do not need to test the depth buffer as we are culling the back faces.
+    renderer.SetProperty( Renderer::Property::DEPTH_TEST_MODE, DepthTestMode::OFF );
+
+    // This object must be rendered 1st.
+    renderer.SetProperty( Renderer::Property::DEPTH_INDEX, 0 * DEPTH_INDEX_GRANULARITY );
+
+    container.AddRenderer( renderer );
+    return container;
+  }
+
+  /**
+   * @brief Creates the Floor object.
+   * This creates the renderer from existing geometry (as the cube geometry can be re-used).
+   * The texture is created and set and all relevant renderer properties are set-up.
+   * @param[in] geometry Pre-calculated cube geometry
+   * @param[in] size The desired floor size
+   * @return An actor set-up containing the floor object
+   */
+  Actor CreateFloorObject( Geometry& geometry, Vector3 size )
+  {
+    Toolkit::Control container = Toolkit::Control::New();
+    container.SetAnchorPoint( AnchorPoint::TOP_CENTER );
+    container.SetParentOrigin( ParentOrigin::TOP_CENTER );
+    container.SetSize( size );
+    container.SetResizePolicy( ResizePolicy::FIXED, Dimension::ALL_DIMENSIONS );
+
+    // Create a renderer from the geometry and add the texture.
+    TextureSet planeTextureSet = CreateTextureSet( FLOOR_TEXTURE );
+    Renderer renderer = CreateRenderer( geometry, size, true, FLOOR_COLOR );
+    renderer.SetTextures( planeTextureSet );
+
+    // Setup the renderer properties:
+    // We are writing to the color buffer & culling back faces (as we are NOT doing depth write).
+    renderer.SetProperty( Renderer::Property::WRITE_TO_COLOR_BUFFER, true );
+    renderer.SetProperty( Renderer::Property::FACE_CULLING_MODE, FaceCullingMode::BACK );
+
+    // No stencil is used for the floor.
+    renderer.SetProperty( Renderer::Property::STENCIL_MODE, StencilMode::OFF );
+
+    // We do not write to the depth buffer as its not needed.
+    renderer.SetProperty( Renderer::Property::DEPTH_WRITE_MODE, DepthWriteMode::OFF );
+    // We do need to test the depth buffer as we need the floor to be underneath the cube.
+    renderer.SetProperty( Renderer::Property::DEPTH_TEST_MODE, DepthTestMode::ON );
+
+    // This object must be rendered 2nd.
+    renderer.SetProperty( Renderer::Property::DEPTH_INDEX, 1 * DEPTH_INDEX_GRANULARITY );
+
+    container.AddRenderer( renderer );
+    return container;
+  }
+
+  /**
+   * @brief Creates the Stencil-Plane object.
+   * This is places on the floor object to allow the reflection to be drawn on to the floor.
+   * This creates the geometry and renderer.
+   * All relevant renderer properties are set-up.
+   * @param[in] size The desired plane size
+   * @return An actor set-up containing the stencil-plane object
+   */
+  Actor CreateStencilPlaneObject( Vector3 size )
+  {
+    Toolkit::Control container = Toolkit::Control::New();
+    container.SetAnchorPoint( AnchorPoint::CENTER );
+    container.SetParentOrigin( ParentOrigin::CENTER );
+    container.SetSize( size );
+    container.SetResizePolicy( ResizePolicy::FIXED, Dimension::ALL_DIMENSIONS );
+
+    // We rotate the plane as the geometry is created flat in X & Y. We want it to span X & Z axis.
+    container.SetProperty( Actor::Property::ORIENTATION, Quaternion( Degree( -90.0f ), Degree( 0.0f ), Degree( 0.0f ) ) );
+
+    // Create geometry for a flat plane.
+    Geometry planeGeometry = CreatePlaneVertices( Vector2::ONE );
+    // Create a renderer from the geometry.
+    Renderer renderer = CreateRenderer( planeGeometry, size, false, Vector4::ONE );
+
+    // Setup the renderer properties:
+    // The stencil plane is only for stencilling, so disable writing to color buffer.
+    renderer.SetProperty( Renderer::Property::WRITE_TO_COLOR_BUFFER, false );
+
+    // Enable stencil. Draw to the stencil buffer (only).
+    renderer.SetProperty( Renderer::Property::STENCIL_MODE, StencilMode::ON );
+    renderer.SetProperty( Renderer::Property::STENCIL_FUNCTION, StencilFunction::ALWAYS );
+    renderer.SetProperty( Renderer::Property::STENCIL_FUNCTION_REFERENCE, 1 );
+    renderer.SetProperty( Renderer::Property::STENCIL_FUNCTION_MASK, 0xFF );
+    renderer.SetProperty( Renderer::Property::STENCIL_OPERATION_ON_FAIL, StencilOperation::KEEP );
+    renderer.SetProperty( Renderer::Property::STENCIL_OPERATION_ON_Z_FAIL, StencilOperation::KEEP );
+    renderer.SetProperty( Renderer::Property::STENCIL_OPERATION_ON_Z_PASS, StencilOperation::REPLACE );
+    renderer.SetProperty( Renderer::Property::STENCIL_MASK, 0xFF );
+
+    // We don't want to write to the depth buffer, as this would block the reflection being drawn.
+    renderer.SetProperty( Renderer::Property::DEPTH_WRITE_MODE, DepthWriteMode::OFF );
+    // We test the depth buffer as we want the stencil to only exist underneath the cube.
+    renderer.SetProperty( Renderer::Property::DEPTH_TEST_MODE, DepthTestMode::ON );
+
+    // This object must be rendered 3rd.
+    renderer.SetProperty( Renderer::Property::DEPTH_INDEX, 2 * DEPTH_INDEX_GRANULARITY );
+
+    container.AddRenderer( renderer );
+    return container;
+  }
+
+  /**
+   * @brief Creates the Reflection cube object.
+   * This creates new geometry (as the texture UVs are different to the main cube).
+   * The renderer is then created.
+   * The texture is set and all relevant renderer properties are set-up.
+   * @param[in] size The desired cube size
+   * @param[in] textureSet A pre-existing TextureSet with a texture set up, to be applied to the cube
+   * @return An actor set-up containing the reflection cube object
+   */
+  Actor CreateReflectionCubeObject( Vector3 size, TextureSet& textureSet )
+  {
+    Toolkit::Control container = Toolkit::Control::New();
+    container.SetAnchorPoint( AnchorPoint::TOP_CENTER );
+    container.SetParentOrigin( ParentOrigin::TOP_CENTER );
+    container.SetSize( size );
+    container.SetResizePolicy( ResizePolicy::FIXED, Dimension::ALL_DIMENSIONS );
+
+    // Create the cube geometry of unity size.
+    // The "true" specifies we want the texture UVs flipped vertically as this is the reflection cube.
+    Geometry reflectedCubeGeometry = CreateCubeVertices( Vector3::ONE, true );
+    // Create a renderer from the geometry and add the texture.
+    Renderer renderer = CreateRenderer( reflectedCubeGeometry, size, true, REFLECTION_COLOR );
+    renderer.SetTextures( textureSet );
+
+    // Setup the renderer properties:
+    // Write to color buffer so reflection is visible
+    renderer.SetProperty( Renderer::Property::WRITE_TO_COLOR_BUFFER, true );
+    // We cull to skip drawing the back faces.
+    renderer.SetProperty( Renderer::Property::FACE_CULLING_MODE, FaceCullingMode::BACK );
+
+    // We use blending to blend the reflection with the floor texture.
+    renderer.SetProperty( Renderer::Property::BLEND_MODE, BlendMode::ON );
+    renderer.SetProperty( Renderer::Property::BLEND_EQUATION_RGB, BlendEquation::ADD );
+    renderer.SetProperty( Renderer::Property::BLEND_EQUATION_ALPHA, BlendEquation::ADD );
+    renderer.SetProperty( Renderer::Property::BLEND_FACTOR_DEST_RGB, BlendFactor::ONE );
+
+    // Enable stencil. Here we only draw to areas within the stencil.
+    renderer.SetProperty( Renderer::Property::STENCIL_MODE, StencilMode::ON );
+    renderer.SetProperty( Renderer::Property::STENCIL_FUNCTION, StencilFunction::EQUAL );
+    renderer.SetProperty( Renderer::Property::STENCIL_FUNCTION_REFERENCE, 1 );
+    renderer.SetProperty( Renderer::Property::STENCIL_FUNCTION_MASK, 0xff );
+    // Don't write to the stencil.
+    renderer.SetProperty( Renderer::Property::STENCIL_MASK, 0x00 );
+
+    // We don't need to write to the depth buffer, as we are culling.
+    renderer.SetProperty( Renderer::Property::DEPTH_WRITE_MODE, DepthWriteMode::OFF );
+    // We need to test the depth buffer as we need the reflection to be underneath the cube.
+    renderer.SetProperty( Renderer::Property::DEPTH_TEST_MODE, DepthTestMode::ON );
+
+    // This object must be rendered last.
+    renderer.SetProperty( Renderer::Property::DEPTH_INDEX, 3 * DEPTH_INDEX_GRANULARITY );
+
+    container.AddRenderer( renderer );
+    return container;
+  }
+
+  // Methods:
+
+  /**
+   * @brief Creates a geometry object from vertices and indices.
+   * @param[in] vertices The object vertices
+   * @param[in] indices The object indices
+   * @return A geometry object
+   */
+  Geometry CreateTexturedGeometry( Vector<TexturedVertex>& vertices, Vector<unsigned short>& indices )
+  {
+    // Vertices
+    Property::Map vertexFormat;
+    vertexFormat[POSITION] = Property::VECTOR3;
+    vertexFormat[NORMAL] =   Property::VECTOR3;
+    vertexFormat[TEXTURE] =  Property::VECTOR2;
+
+    PropertyBuffer surfaceVertices = PropertyBuffer::New( vertexFormat );
+    surfaceVertices.SetData( &vertices[0u], vertices.Size() );
+
+    Geometry geometry = Geometry::New();
+    geometry.AddVertexBuffer( surfaceVertices );
+
+    // Indices for triangle formulation
+    geometry.SetIndexBuffer( &indices[0u], indices.Size() );
+    return geometry;
+  }
+
+  /**
+   * @brief Creates a renderer from a geometry object.
+   * @param[in] geometry The geometry to use
+   * @param[in] dimensions The dimensions (will be passed in to the shader)
+   * @param[in] textured Set to true to use the texture versions of the shaders
+   * @param[in] color The base color for the renderer
+   * @return A renderer object
+   */
+  Renderer CreateRenderer( Geometry geometry, Vector3 dimensions, bool textured, Vector4 color )
+  {
+    Stage stage = Stage::GetCurrent();
+    Shader shader;
+
+    if( textured )
+    {
+      shader = Shader::New( VERTEX_SHADER_TEXTURED, FRAGMENT_SHADER_TEXTURED );
+    }
+    else
+    {
+      shader = Shader::New( VERTEX_SHADER, FRAGMENT_SHADER );
+    }
+
+    // Here we modify the light position based on half the stage size as a pre-calculation step.
+    // This avoids the work having to be done in the shader.
+    shader.RegisterProperty( LIGHT_POSITION_UNIFORM_NAME, Vector3( -stage.GetSize().width / 2.0f, -stage.GetSize().width / 2.0f, 1000.0f ) );
+    shader.RegisterProperty( COLOR_UNIFORM_NAME, color );
+    shader.RegisterProperty( OBJECT_DIMENSIONS_UNIFORM_NAME, dimensions );
+
+    return Renderer::New( geometry, shader );
+  }
+
+  /**
+   * @brief Helper method to create a TextureSet from an image URL.
+   * @param[in] url An image URL
+   * @return A TextureSet object
+   */
+  TextureSet CreateTextureSet( const char* url )
+  {
+    TextureSet textureSet = TextureSet::New();
+
+    if( textureSet )
+    {
+      Texture texture = DemoHelper::LoadTexture( url );
+      if( texture )
+      {
+        textureSet.SetTexture( 0u, texture );
+      }
+    }
+
+    return textureSet;
+  }
+
+  // Geometry Creation:
+
+  /**
+   * @brief Creates a geometry object for a flat plane.
+   * The plane is oriented in X & Y axis (Z is 0).
+   * @param[in] dimensions The desired plane dimensions
+   * @return A Geometry object
+   */
+  Geometry CreatePlaneVertices( Vector2 dimensions )
+  {
+    Vector<TexturedVertex> vertices;
+    Vector<unsigned short> indices;
+    vertices.Resize( 4u );
+    indices.Resize( 6u );
+
+    float scaledX = 0.5f * dimensions.x;
+    float scaledY = 0.5f * dimensions.y;
+
+    vertices[0].position     = Vector3( -scaledX, -scaledY, 0.0f );
+    vertices[0].textureCoord = Vector2( 0.0, 0.0f );
+    vertices[1].position     = Vector3(  scaledX, -scaledY, 0.0f );
+    vertices[1].textureCoord = Vector2( 1.0, 0.0f );
+    vertices[2].position     = Vector3(  scaledX,  scaledY, 0.0f );
+    vertices[2].textureCoord = Vector2( 1.0, 1.0f );
+    vertices[3].position     = Vector3( -scaledX,  scaledY, 0.0f );
+    vertices[3].textureCoord = Vector2( 0.0, 1.0f );
+
+    // All vertices have the same normal.
+    for( int i = 0; i < 4; ++i )
+    {
+      vertices[i].normal = Vector3( 0.0f, 0.0f, -1.0f );
+    }
+
+    indices[0] = 0;
+    indices[1] = 1;
+    indices[2] = 2;
+    indices[3] = 2;
+    indices[4] = 3;
+    indices[5] = 0;
+
+    // Use the helper method to create the geometry object.
+    return CreateTexturedGeometry( vertices, indices );
+  }
+
+  /**
+   * @brief Creates a geometry object for a cube (or cuboid).
+   * @param[in] dimensions The desired cube dimensions
+   * @param[in] reflectVerticalUVs Set to True to force the UVs to be vertically flipped
+   * @return A Geometry object
+   */
+  Geometry CreateCubeVertices( Vector3 dimensions, bool reflectVerticalUVs )
+  {
+    Vector<TexturedVertex> vertices;
+    Vector<unsigned short> indices;
+    int vertexIndex = 0u; // Tracks progress through vertices.
+    float scaledX = 0.5f * dimensions.x;
+    float scaledY = 0.5f * dimensions.y;
+    float scaledZ = 0.5f * dimensions.z;
+    float verticalTextureCoord = reflectVerticalUVs ? 0.0f : 1.0f;
+
+    vertices.Resize( 4u * 6u ); // 4 vertices x 6 faces
+
+    Vector<Vector3> positions;  // Stores vertex positions, which are shared between vertexes at the same position but with a different normal.
+    positions.Resize( 8u );
+    Vector<Vector3> normals;    // Stores normals, which are shared between vertexes of the same face.
+    normals.Resize( 6u );
+
+    positions[0] = Vector3( -scaledX,  scaledY, -scaledZ );
+    positions[1] = Vector3(  scaledX,  scaledY, -scaledZ );
+    positions[2] = Vector3(  scaledX,  scaledY,  scaledZ );
+    positions[3] = Vector3( -scaledX,  scaledY,  scaledZ );
+    positions[4] = Vector3( -scaledX, -scaledY, -scaledZ );
+    positions[5] = Vector3(  scaledX, -scaledY, -scaledZ );
+    positions[6] = Vector3(  scaledX, -scaledY,  scaledZ );
+    positions[7] = Vector3( -scaledX, -scaledY,  scaledZ );
+
+    normals[0] = Vector3(  0,  1,  0 );
+    normals[1] = Vector3(  0,  0, -1 );
+    normals[2] = Vector3(  1,  0,  0 );
+    normals[3] = Vector3(  0,  0,  1 );
+    normals[4] = Vector3( -1,  0,  0 );
+    normals[5] = Vector3(  0, -1,  0 );
+
+    // Top face, upward normals.
+    for( int i = 0; i < 4; ++i, ++vertexIndex )
+    {
+      vertices[vertexIndex].position = positions[i];
+      vertices[vertexIndex].normal = normals[0];
+      // The below logic forms the correct U/V pairs for a quad when "i" goes from 0 to 3.
+      vertices[vertexIndex].textureCoord = Vector2( ( i == 1 || i == 2 ) ? 1.0f : 0.0f, ( i == 2 || i == 3 ) ? 1.0f : 0.0f );
+    }
+
+    // Top face, outward normals.
+    for( int i = 0; i < 4; ++i, vertexIndex += 2 )
+    {
+      vertices[vertexIndex].position = positions[i];
+      vertices[vertexIndex].normal = normals[i + 1];
+
+      if( i == 3 )
+      {
+        // End, so loop around.
+        vertices[vertexIndex + 1].position = positions[0];
+      }
+      else
+      {
+        vertices[vertexIndex + 1].position = positions[i + 1];
+      }
+      vertices[vertexIndex + 1].normal = normals[i + 1];
+
+      vertices[vertexIndex].textureCoord = Vector2( 0.0f, verticalTextureCoord );
+      vertices[vertexIndex+1].textureCoord = Vector2( 1.0f, verticalTextureCoord );
+    }
+
+    // Flip the vertical texture coord for the UV values of the bottom points.
+    verticalTextureCoord = 1.0f - verticalTextureCoord;
+
+    // Bottom face, outward normals.
+    for( int i = 0; i < 4; ++i, vertexIndex += 2 )
+    {
+      vertices[vertexIndex].position = positions[i + 4];
+      vertices[vertexIndex].normal = normals[i + 1];
+
+      if( i == 3 )
+      {
+        // End, so loop around.
+        vertices[vertexIndex + 1].position = positions[4];
+      }
+      else
+      {
+        vertices[vertexIndex + 1].position = positions[i + 5];
+      }
+      vertices[vertexIndex + 1].normal = normals[i + 1];
+
+      vertices[vertexIndex].textureCoord = Vector2( 0.0f, verticalTextureCoord );
+      vertices[vertexIndex+1].textureCoord = Vector2( 1.0f, verticalTextureCoord );
+    }
+
+    // Bottom face, downward normals.
+    for( int i = 0; i < 4; ++i, ++vertexIndex )
+    {
+      // Reverse positions for bottom face to keep triangles clockwise (for culling).
+      vertices[vertexIndex].position = positions[ 7 - i ];
+      vertices[vertexIndex].normal = normals[5];
+      // The below logic forms the correct U/V pairs for a quad when "i" goes from 0 to 3.
+      vertices[vertexIndex].textureCoord = Vector2( ( i == 1 || i == 2 ) ? 1.0f : 0.0f, ( i == 2 || i == 3 ) ? 1.0f : 0.0f );
+    }
+
+    // Create cube indices.
+    int triangleIndex = 0u;     //Track progress through indices.
+    indices.Resize( 3u * 12u ); // 3 points x 12 triangles.
+
+    // Top face.
+    indices[triangleIndex] =     0;
+    indices[triangleIndex + 1] = 1;
+    indices[triangleIndex + 2] = 2;
+    indices[triangleIndex + 3] = 2;
+    indices[triangleIndex + 4] = 3;
+    indices[triangleIndex + 5] = 0;
+    triangleIndex += 6;
+
+    int topFaceStart = 4u;
+    int bottomFaceStart = topFaceStart + 8u;
+
+    // Side faces.
+    for( int i = 0; i < 8; i += 2, triangleIndex += 6 )
+    {
+      indices[triangleIndex    ] = i + topFaceStart;
+      indices[triangleIndex + 1] = i + bottomFaceStart + 1;
+      indices[triangleIndex + 2] = i + topFaceStart + 1;
+      indices[triangleIndex + 3] = i + topFaceStart;
+      indices[triangleIndex + 4] = i + bottomFaceStart;
+      indices[triangleIndex + 5] = i + bottomFaceStart + 1;
+    }
+
+    // Bottom face.
+    indices[triangleIndex] =     20;
+    indices[triangleIndex + 1] = 21;
+    indices[triangleIndex + 2] = 22;
+    indices[triangleIndex + 3] = 22;
+    indices[triangleIndex + 4] = 23;
+    indices[triangleIndex + 5] = 20;
+
+    // Use the helper method to create the geometry object.
+    return CreateTexturedGeometry( vertices, indices );
+  }
+
+  // Signal handlers:
+
+  /**
+   * @brief OnTouch signal handler.
+   * @param[in] actor The actor that has been touched
+   * @param[in] touch The touch information
+   * @return True if the event has been handled
+   */
+  bool OnTouch( Actor actor, const TouchData& touch )
+  {
+    // Quit the application.
+    mApplication.Quit();
+    return true;
+  }
+
+  /**
+   * @brief OnKeyEvent signal handler.
+   * @param[in] event The key event information
+   */
+  void OnKeyEvent( const KeyEvent& event )
+  {
+    if( event.state == KeyEvent::Down )
+    {
+      if ( IsKey( event, Dali::DALI_KEY_ESCAPE ) || IsKey( event, Dali::DALI_KEY_BACK ) )
+      {
+        mApplication.Quit();
+      }
+    }
+  }
+
+private:
+
+  // Member variables:
+
+  Application&     mApplication;       ///< The DALi application object
+  Toolkit::Control mView;              ///< The view used to show the background
+
+  Animation        mRotationAnimation; ///< The animation to spin the cube & floor
+  Animation        mBounceAnimation;   ///< The animation to bounce the cube
+  Actor            mCubes[2];          ///< The cube object containers
+};
+
+
+/**
+ * @brief Creates an instance of the example object and runs it.
+ * @param[in] application The DALi application object
+ */
+void RunExample( Application& application )
+{
+  RendererStencilExample example( application );
+
+  application.MainLoop();
+}
+
+/**
+ * @brief Entry point for Linux & Tizen applications
+ * @param[in] argc The executables argument count
+ * @param[in] argv The executables argument vector
+ * @return The executables exit code (0)
+ */
+int DALI_EXPORT_API main( int argc, char **argv )
+{
+  Application application = Application::New( &argc, &argv );
+
+  RunExample( application );
+
+  return 0;
+}
+#ifndef DALI_DEMO_RENDERER_STENCIL_SHADERS_H
+#define DALI_DEMO_RENDERER_STENCIL_SHADERS_H
+
+/*
+ * Copyright (c) 2016 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.
+ */
+
+// EXTERNAL INCLUDES
+#include <dali/public-api/rendering/shader.h>
+
+// Shader uniforms:
+const char * const COLOR_UNIFORM_NAME( "uColor" );
+const char * const OBJECT_DIMENSIONS_UNIFORM_NAME( "uObjectDimensions" );
+const char * const STAGE_SIZE_UNIFORM_NAME( "uStageSize" );
+const char * const LIGHT_POSITION_UNIFORM_NAME = "uLightPosition";
+const char * const POSITION( "aPosition");
+const char * const NORMAL( "aNormal" );
+const char * const TEXTURE( "aTexCoord" );
+
+// Shader for todor (vertex):
+const char* VERTEX_SHADER = DALI_COMPOSE_SHADER(
+  attribute mediump vec3  aPosition;
+  attribute highp   vec3  aNormal;
+  attribute highp   vec2  aTexCoord;
+
+  varying   mediump vec2  vTexCoord;
+  uniform   mediump mat4  uMvpMatrix;
+  uniform   mediump vec3  uSize;
+  uniform   mediump vec3  uObjectDimensions;
+  varying   mediump vec3  vIllumination;
+  uniform   mediump mat4  uModelView;
+  uniform   mediump mat4  uViewMatrix;
+  uniform   mediump mat3  uNormalMatrix;
+  uniform   mediump vec3  uLightPosition;
+
+  void main()
+  {
+    mediump vec4 vertexPosition = vec4( aPosition * uObjectDimensions, 1.0 );
+    vertexPosition = uMvpMatrix * vertexPosition;
+
+    vec4 mvVertexPosition = uModelView * vertexPosition;
+
+    vec3 vectorToLight = normalize( mat3( uViewMatrix ) * uLightPosition - mvVertexPosition.xyz );
+
+    vec3 normal = uNormalMatrix * aNormal;
+    float lightDiffuse = max( dot( vectorToLight, normal ), 0.0 );
+    vIllumination = vec3( lightDiffuse * 0.5 + 0.5 );
+
+    gl_Position = vertexPosition;
+  }
+);
+
+const char* FRAGMENT_SHADER = DALI_COMPOSE_SHADER(
+  varying mediump vec2  vTexCoord;
+  varying mediump vec3  vIllumination;
+  uniform lowp    vec4  uColor;
+  uniform sampler2D     sTexture;
+
+  void main()
+  {
+    gl_FragColor = vec4( vIllumination.rgb * uColor.rgb, uColor.a );
+  }
+);
+
+const char* VERTEX_SHADER_TEXTURED = DALI_COMPOSE_SHADER(
+  attribute mediump vec3  aPosition;
+  attribute highp   vec3  aNormal;
+  attribute highp   vec2  aTexCoord;
+
+  varying   mediump vec2  vTexCoord;
+  uniform   mediump mat4  uMvpMatrix;
+  uniform   mediump vec3  uSize;
+  uniform   mediump vec3  uObjectDimensions;
+  varying   mediump vec3  vIllumination;
+  uniform   mediump mat4  uModelView;
+  uniform   mediump mat4  uViewMatrix;
+  uniform   mediump mat3  uNormalMatrix;
+  uniform   mediump vec3  uLightPosition;
+
+  void main()
+  {
+    mediump vec4 vertexPosition = vec4( aPosition * uObjectDimensions, 1.0 );
+    vertexPosition = uMvpMatrix * vertexPosition;
+
+    vec4 mvVertexPosition = uModelView * vertexPosition;
+
+    vec3 vectorToLight = normalize( mat3( uViewMatrix ) * uLightPosition - mvVertexPosition.xyz );
+
+    vec3 normal = uNormalMatrix * aNormal;
+    float lightDiffuse = max( dot( vectorToLight, normal ), 0.0 );
+    vIllumination = vec3( lightDiffuse * 0.5 + 0.5 );
+
+    vTexCoord = aTexCoord;
+    gl_Position = vertexPosition;
+  }
+);
+
+const char* FRAGMENT_SHADER_TEXTURED = DALI_COMPOSE_SHADER(
+  varying mediump vec2  vTexCoord;
+  varying mediump vec3  vIllumination;
+  uniform lowp    vec4  uColor;
+  uniform sampler2D     sTexture;
+
+  void main()
+  {
+    gl_FragColor = vec4( texture2D( sTexture, vTexCoord ).rgb * vIllumination.rgb * uColor.rgb, uColor.a );
+  }
+);
+
+#endif // DALI_DEMO_RENDERER_STENCIL_SHADERS_H
@@ -454,12 +454,12 @@ private:
   {
     ImageView actor = ImageView::New();
     Property::Map map;
-    map["rendererType"] = "IMAGE";
-    map["url"] = filename;
-    map["desiredWidth"] = width;
-    map["desiredHeight"] = height;
-    map["fittingMode"] = "SCALE_TO_FILL";
-    map["samplingMode"] = "BOX_THEN_LINEAR";
+    map[Visual::Property::TYPE] = Visual::IMAGE;
+    map[ImageVisual::Property::URL] = filename;
+    map[ImageVisual::Property::DESIRED_WIDTH] = width;
+    map[ImageVisual::Property::DESIRED_HEIGHT] = height;
+    map[ImageVisual::Property::FITTING_MODE] = FittingMode::SCALE_TO_FILL;
+    map[ImageVisual::Property::SAMPLING_MODE] = SamplingMode::BOX_THEN_LINEAR;
     actor.SetProperty( ImageView::Property::IMAGE, map );
  
     actor.SetName( filename );
@@ -77,9 +77,9 @@ public:
     parent.Add( box );
  
     Dali::Property::Map border;
-    border.Insert( "rendererType",  "BORDER" );
-    border.Insert( "borderColor",  Color::WHITE );
-    border.Insert( "borderSize",  1.f );
+    border.Insert( Visual::Property::TYPE,  Visual::BORDER );
+    border.Insert( BorderVisual::Property::COLOR,  Color::WHITE );
+    border.Insert( BorderVisual::Property::SIZE,  1.f );
     box.SetProperty( Control::Property::BACKGROUND, border );
   }
  
@@ -210,14 +210,14 @@ class VideoViewController: public ConnectionTracker
     Stage::GetCurrent().KeyEventSignal().Connect( this, &VideoViewController::OnKeyEvent );
  
     Property::Map customShader;
-    customShader.Insert( "fragmentShader", FRAGMENT_SHADER );
-    mCustomShader.Insert( "rendererType", "IMAGE" );
-    mCustomShader.Insert( "shader", customShader );
+    customShader.Insert( Visual::Shader::Property::FRAGMENT_SHADER, FRAGMENT_SHADER );
+    mCustomShader.Insert( Visual::Property::TYPE, Visual::IMAGE );
+    mCustomShader.Insert( Visual::Property::SHADER, customShader );
  
     Property::Map defaultShader;
-    customShader.Insert( "fragmentShader", DEFAULT_FRAGMENT_SHADER );
-    mDefaultShader.Insert( "rendererType", "IMAGE" );
-    mDefaultShader.Insert( "shader", defaultShader );
+    customShader.Insert( Visual::Shader::Property::FRAGMENT_SHADER, DEFAULT_FRAGMENT_SHADER );
+    mDefaultShader.Insert( Visual::Property::TYPE, Visual::IMAGE );
+    mDefaultShader.Insert( Visual::Property::SHADER, customShader );
  
     mWindowSurfaceTarget.Insert( "RENDERING_TARGET", "windowSurfaceTarget" );
     mNativeImageTarget.Insert( "RENDERING_TARGET", "nativeImageTarget" );
@@ -2,7 +2,7 @@
  
 Name:       com.samsung.dali-demo
 Summary:    The OpenGLES Canvas Core Demo
-Version:    1.1.44
+Version:    1.1.45
 Release:    1
 Group:      System/Libraries
 License:    Apache-2.0
@@ -39,22 +39,21 @@ of the capability of the toolkit.
 %prep
 %setup -q
  
-
 #Use TZ_PATH when tizen version is 3.x
+
 %if "%{tizen_version_major}" == "2"
 %define dali_app_ro_dir       /usr/apps/com.samsung.dali-demo/
 %define dali_xml_file_dir     /usr/share/packages/
 %define dali_icon_dir         /usr/share/icons/
-%endif
-
-%if "%{tizen_version_major}" == "3"
+%define smack_rule_dir        /etc/smack/accesses2.d/
+%else
 %define dali_app_ro_dir       %TZ_SYS_RO_APP/com.samsung.dali-demo/
 %define dali_xml_file_dir     %TZ_SYS_RO_PACKAGES
 %define dali_icon_dir         %TZ_SYS_RO_ICONS
+%define smack_rule_dir        %TZ_SYS_SMACK/accesses2.d/
 %endif
  
 %define dali_app_exe_dir      %{dali_app_ro_dir}/bin/
-%define smack_rule_dir        /etc/smack/accesses2.d/
 %define locale_dir            %{dali_app_ro_dir}/res/locale
 %define local_style_dir       ../../resources/style/mobile
  
@@ -42,7 +42,7 @@
           "heightResizePolicy":"FILL_TO_PARENT",
           "sizeAspectRatio": false,
           "background": {
-            "rendererType": "COLOR",
+            "visualType": "COLOR",
             "mixColor": [1,1,1,1]
           },
           "color": [
@@ -78,7 +78,7 @@
               "heightResizePolicy":"FILL_TO_PARENT",
               "sizeAspectRatio": false,
               "background": {
-                "rendererType": "COLOR",
+                "visualType": "COLOR",
                 "mixColor": [1,1,1,1]
               },
               "color": [
@@ -114,7 +114,7 @@
                   "heightResizePolicy":"FILL_TO_PARENT",
                   "sizeAspectRatio": false,
                   "background": {
-                    "rendererType": "COLOR",
+                    "visualType": "COLOR",
                     "mixColor": [1,1,1,1]
                   },
                   "color": [
@@ -146,7 +146,7 @@
               "heightResizePolicy":"FILL_TO_PARENT",
               "sizeAspectRatio": false,
               "background": {
-                "rendererType": "COLOR",
+                "visualType": "COLOR",
                 "mixColor": [1,1,1,1]
               },
               "color": [
@@ -182,7 +182,7 @@
                   "heightResizePolicy":"FILL_TO_PARENT",
                   "sizeAspectRatio": false,
                   "background": {
-                    "rendererType": "COLOR",
+                    "visualType": "COLOR",
                     "mixColor": [1,1,1,1]
                   },
                   "color": [
@@ -218,7 +218,7 @@
                       "heightResizePolicy":"FILL_TO_PARENT",
                       "sizeAspectRatio": false,
                       "background": {
-                        "rendererType": "COLOR",
+                        "visualType": "COLOR",
                         "mixColor": [1,1,1,1]
                       },
                       "color": [
@@ -250,7 +250,7 @@
                   "heightResizePolicy":"FILL_TO_PARENT",
                   "sizeAspectRatio": false,
                   "background": {
-                    "rendererType": "COLOR",
+                    "visualType": "COLOR",
                     "mixColor": [1,1,1,1]
                   },
                   "color": [
@@ -286,7 +286,7 @@
                       "heightResizePolicy":"FILL_TO_PARENT",
                       "sizeAspectRatio": false,
                       "background": {
-                        "rendererType": "COLOR",
+                        "visualType": "COLOR",
                         "mixColor": [1,1,1,1]
                       },
                       "color": [
@@ -322,7 +322,7 @@
                           "heightResizePolicy":"FILL_TO_PARENT",
                           "sizeAspectRatio": false,
                           "background": {
-                            "rendererType": "COLOR",
+                            "visualType": "COLOR",
                             "mixColor": [1,1,1,1]
                           },
                           "color": [
@@ -354,7 +354,7 @@
                       "heightResizePolicy":"FILL_TO_PARENT",
                       "sizeAspectRatio": false,
                       "background": {
-                        "rendererType": "COLOR",
+                        "visualType": "COLOR",
                         "mixColor": [1,1,1,1]
                       },
                       "color": [
@@ -386,7 +386,7 @@
                   "heightResizePolicy":"FILL_TO_PARENT",
                   "sizeAspectRatio": false,
                   "background": {
-                    "rendererType": "COLOR",
+                    "visualType": "COLOR",
                     "mixColor": [1,1,1,1]
                   },
                   "color": [
@@ -418,7 +418,7 @@
               "heightResizePolicy":"FILL_TO_PARENT",
               "sizeAspectRatio": false,
               "background": {
-                "rendererType": "COLOR",
+                "visualType": "COLOR",
                 "mixColor": [1,1,1,1]
               },
               "color": [
@@ -450,7 +450,7 @@
           "heightResizePolicy":"FILL_TO_PARENT",
           "sizeAspectRatio": false,
           "background": {
-            "rendererType": "COLOR",
+            "visualType": "COLOR",
             "mixColor": [1,1,1,1]
           },
           "color": [
@@ -486,7 +486,7 @@
               "heightResizePolicy":"FILL_TO_PARENT",
               "sizeAspectRatio": false,
               "background": {
-                "rendererType": "COLOR",
+                "visualType": "COLOR",
                 "mixColor": [1,1,1,1]
               },
               "color": [
@@ -518,7 +518,7 @@
           "heightResizePolicy":"FILL_TO_PARENT",
           "sizeAspectRatio": false,
           "background": {
-            "rendererType": "COLOR",
+            "visualType": "COLOR",
             "mixColor": [1,1,1,1]
           },
           "color": [
@@ -557,7 +557,7 @@
                   "heightResizePolicy":"FILL_TO_PARENT",
                   "sizeAspectRatio": false,
                   "background": {
-                    "rendererType": "COLOR",
+                    "visualType": "COLOR",
                     "mixColor": [1,1,1,1]
                   },
                   "color": [
@@ -589,7 +589,7 @@
               "heightResizePolicy":"FILL_TO_PARENT",
               "sizeAspectRatio": false,
               "background": {
-                "rendererType": "COLOR",
+                "visualType": "COLOR",
                 "mixColor": [1,1,1,1]
               },
               "color": [
@@ -622,7 +622,7 @@
               "heightResizePolicy":"FILL_TO_PARENT",
               "sizeAspectRatio": false,
               "background": {
-                "rendererType": "COLOR",
+                "visualType": "COLOR",
                 "mixColor": [1,1,1,1]
               },
               "color": [
@@ -661,7 +661,7 @@
                       "heightResizePolicy":"FILL_TO_PARENT",
                       "sizeAspectRatio": false,
                       "background": {
-                        "rendererType": "COLOR",
+                        "visualType": "COLOR",
                         "mixColor": [1,1,1,1]
                       },
                       "color": [
@@ -693,7 +693,7 @@
                   "heightResizePolicy":"FILL_TO_PARENT",
                   "sizeAspectRatio": false,
                   "background": {
-                    "rendererType": "COLOR",
+                    "visualType": "COLOR",
                     "mixColor": [1,1,1,1]
                   },
                   "color": [
@@ -726,7 +726,7 @@
                   "heightResizePolicy":"FILL_TO_PARENT",
                   "sizeAspectRatio": false,
                   "background": {
-                    "rendererType": "COLOR",
+                    "visualType": "COLOR",
                     "mixColor": [1,1,1,1]
                   },
                   "color": [
@@ -758,7 +758,7 @@
               "heightResizePolicy":"FILL_TO_PARENT",
               "sizeAspectRatio": false,
               "background": {
-                "rendererType": "COLOR",
+                "visualType": "COLOR",
                 "mixColor": [1,1,1,1]
               },
               "color": [
@@ -790,7 +790,7 @@
           "heightResizePolicy":"FILL_TO_PARENT",
           "sizeAspectRatio": false,
           "background": {
-            "rendererType": "COLOR",
+            "visualType": "COLOR",
             "mixColor": [1,1,1,1]
           },
           "color": [
@@ -823,7 +823,7 @@
       "sizeModeFactor": [0.25,0.166667,1],
       "sizeAspectRatio": false,
       "background": {
-        "rendererType": "COLOR",
+        "visualType": "COLOR",
         "mixColor": [1,1,1,1]
       },
       "color": [
@@ -30,7 +30,7 @@
       "heightResizePolicy":"SIZE_RELATIVE_TO_PARENT",
       "sizeModeFactor": [ 0.5, 0.333333333333, 1 ],
       "background":{
-        "rendererType": "COLOR",
+        "visualType": "COLOR",
         "mixColor": [ 0.8, 0, 0.2, 1 ]
        }
     },
@@ -45,7 +45,7 @@
       "heightResizePolicy":"SIZE_RELATIVE_TO_PARENT",
       "sizeModeFactor": [ 0.5, 0.333333333333, 1 ],
       "background": {
-        "rendererType": "IMAGE",
+        "visualType": "IMAGE",
         "url": "{DEMO_IMAGE_DIR}Kid1.svg"
       }
     },
@@ -60,7 +60,7 @@
       "heightResizePolicy":"SIZE_RELATIVE_TO_PARENT",
       "sizeModeFactor": [ 0.5, 0.333333333333, 1 ],
       "background": {
-        "rendererType" : "BORDER",
+        "visualType" : "BORDER",
         "borderColor" : [ 0.5, 0.5, 0.5, 1 ],
         "borderSize" : 15.0
       }
@@ -76,7 +76,7 @@
       "heightResizePolicy":"SIZE_RELATIVE_TO_PARENT",
       "sizeModeFactor": [ 0.5, 0.333333333333, 1 ],
       "background": {
-        "rendererType": "IMAGE",
+        "visualType": "IMAGE",
         "url": "{DEMO_IMAGE_DIR}gallery-large-9.jpg"
       }
     },
@@ -91,7 +91,7 @@
       "heightResizePolicy":"SIZE_RELATIVE_TO_PARENT",
       "sizeModeFactor": [ 0.5, 0.333333333333, 1 ],
       "background":{
-        "rendererType": "COLOR",
+        "visualType": "COLOR",
         "mixColor": [ 1, 1, 0, 1 ]
       }
     },
@@ -106,7 +106,7 @@
       "heightResizePolicy":"SIZE_RELATIVE_TO_PARENT",
       "sizeModeFactor": [ 0.5, 0.333333333333, 1 ],
       "background": {
-        "rendererType" : "GRADIENT",
+        "visualType" : "GRADIENT",
         "startPosition" : [ -0.5, -0.5 ],
         "endPosition": [ 0.5, 0.5 ],
         "stopColor" : [
@@ -8,7 +8,7 @@
       "parentOrigin": [0.5, 0.5, 0.5],
       "anchorPoint": [0.5, 1, 0.5],
       "background": {
-        "rendererType": "COLOR",
+        "visualType": "COLOR",
         "mixColor": [0.71, 0, 0, 1]
       },
       "selected": false,
@@ -27,7 +27,7 @@
       "parentOrigin": [0.5, 0.5, 0.5],
       "anchorPoint": [0.5, 1, 0.5],
       "background": {
-        "rendererType": "COLOR",
+        "visualType": "COLOR",
         "mixColor": [0, 0.14200000000000013, 0.71, 0.7]
       },
       "signals": [
@@ -45,7 +45,7 @@
       "parentOrigin": [0.5, 0.5, 0.5],
       "anchorPoint": [0.5, 1, 0.5],
       "background": {
-        "rendererType": "COLOR",
+        "visualType": "COLOR",
         "mixColor": [0.057450000000000064, 0.3, 0.0030000000000000027, 0.7]
       },
       "signals": [
@@ -43,7 +43,7 @@
       "name":"simpleTable",
       "type":"TableView",
       "background":{
-        "rendererType": "COLOR",
+        "visualType": "COLOR",
         "mixColor": [0.5,0.5,0,1]
         },
       "parentOrigin": "CENTER",
@@ -69,7 +69,7 @@
     {
       "background":
       {
-        "rendererType": "GRADIENT",
+        "visualType": "GRADIENT",
         "center": [240, 400],
         "radius": 932,
         "units": "USER_SPACE",
@@ -82,7 +82,7 @@
     {
       "background":
       {
-        "rendererType": "GRADIENT",
+        "visualType": "GRADIENT",
         "center": [360, 640],
         "radius": 1468,
         "units": "USER_SPACE",
 /*
- * Copyright (c) 2015 Samsung Electronics Co., Ltd.
+ * Copyright (c) 2016 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.
@@ -37,6 +37,7 @@ extern &quot;C&quot;
 #define DALI_DEMO_STR_TITLE_CUBE_TRANSITION dgettext(DALI_DEMO_DOMAIN_LOCAL, "DALI_DEMO_STR_TITLE_CUBE_TRANSITION")
 #define DALI_DEMO_STR_TITLE_DISSOLVE_TRANSITION dgettext(DALI_DEMO_DOMAIN_LOCAL, "DALI_DEMO_STR_TITLE_DISSOLVE_TRANSITION")
 #define DALI_DEMO_STR_TITLE_ITEM_VIEW dgettext(DALI_DEMO_DOMAIN_LOCAL, "DALI_DEMO_STR_TITLE_ITEM_VIEW")
+#define DALI_DEMO_STR_TITLE_RENDERER_STENCIL dgettext(DALI_DEMO_DOMAIN_LOCAL, "DALI_DEMO_STR_TITLE_RENDERER_STENCIL")
 #define DALI_DEMO_STR_TITLE_MAGNIFIER dgettext(DALI_DEMO_DOMAIN_LOCAL, "DALI_DEMO_STR_TITLE_MAGNIFIER")
 #define DALI_DEMO_STR_TITLE_MOTION_BLUR dgettext(DALI_DEMO_DOMAIN_LOCAL, "DALI_DEMO_STR_TITLE_MOTION_BLUR")
 #define DALI_DEMO_STR_TITLE_MOTION_STRETCH dgettext(DALI_DEMO_DOMAIN_LOCAL, "DALI_DEMO_STR_TITLE_MOTION_STRETCH")
@@ -71,6 +72,7 @@ extern &quot;C&quot;
 #define DALI_DEMO_STR_TITLE_CUBE_TRANSITION           "Cube Effect"
 #define DALI_DEMO_STR_TITLE_DISSOLVE_TRANSITION       "Dissolve Effect"
 #define DALI_DEMO_STR_TITLE_ITEM_VIEW                 "Item View"
+#define DALI_DEMO_STR_TITLE_RENDERER_STENCIL          "Renderer Stencils"
 #define DALI_DEMO_STR_TITLE_MAGNIFIER                 "Magnifier"
 #define DALI_DEMO_STR_TITLE_MODEL_3D_VIEWER           "Model 3D Viewer"
 #define DALI_DEMO_STR_TITLE_MOTION_BLUR               "Motion Blur"
@@ -107,7 +109,7 @@ extern &quot;C&quot;
 #define DALI_DEMO_STR_TITLE_SUPER_BLUR_BLOOM          "Super Blur and Bloom"
 #define DALI_DEMO_STR_TITLE_EFFECTS_VIEW              "Effects View"
 #define DALI_DEMO_STR_TITLE_NATIVE_IMAGE_SOURCE       "Native Image Source"
-#define DALI_DEMO_STR_TITLE_MESH_RENDERER             "Mesh Renderer"
+#define DALI_DEMO_STR_TITLE_MESH_VISUAL               "Mesh Visual"
 #define DALI_DEMO_STR_TITLE_PRIMITIVE_SHAPES          "Primitive Shapes"
  
 #endif
@@ -112,7 +112,7 @@ Dali::Geometry CreateTexturedQuad()
   //Create the geometry
   Dali::Geometry geometry = Dali::Geometry::New();
   geometry.AddVertexBuffer( vertexBuffer );
-  geometry.SetGeometryType(Dali::Geometry::TRIANGLE_STRIP );
+  geometry.SetType(Dali::Geometry::TRIANGLE_STRIP );
  
   return geometry;
 }
@@ -131,13 +131,13 @@ Dali::Layer CreateView( Dali::Application&amp; application,
   if ( !backgroundImagePath.empty() )
   {
     Dali::Property::Map map;
-    map["rendererType"] = "IMAGE";
-    map["url"] = backgroundImagePath;
-    map["desiredWidth"] = stage.GetSize().x;
-    map["desiredHeight"] = stage.GetSize().y;
-    map["fittingMode"] = "SCALE_TO_FILL";
-    map["samplingMode"] = "BOX_THEN_LINEAR";
-    map["synchronousLoading"] = true;
+    map[Dali::Toolkit::Visual::Property::TYPE] = Dali::Toolkit::Visual::IMAGE;
+    map[Dali::Toolkit::ImageVisual::Property::URL] = backgroundImagePath;
+    map[Dali::Toolkit::ImageVisual::Property::DESIRED_WIDTH] = stage.GetSize().x;
+    map[Dali::Toolkit::ImageVisual::Property::DESIRED_HEIGHT] = stage.GetSize().y;
+    map[Dali::Toolkit::ImageVisual::Property::FITTING_MODE] = Dali::FittingMode::SCALE_TO_FILL;
+    map[Dali::Toolkit::ImageVisual::Property::SAMPLING_MODE] = Dali::SamplingMode::BOX_THEN_LINEAR;
+    map[Dali::Toolkit::ImageVisual::Property::SYNCHRONOUS_LOADING] = true;
     view.SetProperty( Dali::Toolkit::Control::Property::BACKGROUND, map );
   }