X-Git-Url: http://review.tizen.org/git/?p=platform%2Fcore%2Fuifw%2Fdali-toolkit.git;a=blobdiff_plain;f=dali-toolkit%2Finternal%2Fcontrols%2Fbuttons%2Fbutton-impl.cpp;h=4548ac94b9e8ebbf78583bea9770657a76f2f991;hp=c0d52ca337cb689a47b9eea5bd08958c95362a36;hb=f3da11c2818c6d17706fbb2417f21b602b3190f5;hpb=511ab5d892c68a8bbbc3846e85fc5ec8f7323470

diff --git a/dali-toolkit/internal/controls/buttons/button-impl.cpp b/dali-toolkit/internal/controls/buttons/button-impl.cpp
index c0d52ca..4548ac9 100644
--- a/dali-toolkit/internal/controls/buttons/button-impl.cpp
+++ b/dali-toolkit/internal/controls/buttons/button-impl.cpp
@@ -21,18 +21,20 @@
 // EXTERNAL INCLUDES
 #include <cstring> // for strcmp
 #include <dali/public-api/events/touch-event.h>
+#include <dali/public-api/images/resource-image.h>
 #include <dali/public-api/object/type-registry.h>
 #include <dali/devel-api/object/type-registry-helper.h>
 #include <dali/public-api/actors/image-actor.h>
 #include <dali/devel-api/scripting/scripting.h>
 
 // INTERNAL INCLUDES
+#include <dali-toolkit/public-api/controls/default-controls/solid-color-actor.h>
 #include <dali-toolkit/public-api/controls/text-controls/text-label.h>
 
 /**
  * Button states and contents
  *                                         (3) mSelectedContent
- *  (2) mButtonContent                     (2) mSelectedBackgroundContent
+ *  (2) mUnselectedContent                 (2) mSelectedBackgroundContent
  *  (1) mBackgroundContent                 (1) mBackgroundContent
  * < unselected > ----------------------- < selected >
  *       |                OnSelect()            |
@@ -45,7 +47,7 @@
  * The drawing order of child actors is as follows.
  *
  *  Top      mLabel
- *   |       mButtonContent / mSelectedContent / mDisabledContent / mDisabledSelectedContent
+ *   |       mUnselectedContent / mSelectedContent / mDisabledContent / mDisabledSelectedContent
  *   |       mSelectedBackgroundContent
  * Bottom    mBackgroundContent / mDisabledBackgroundContent
  *
@@ -75,22 +77,29 @@ BaseHandle Create()
 DALI_TYPE_REGISTRATION_BEGIN( Toolkit::Button, Toolkit::Control, Create );
 
 DALI_PROPERTY_REGISTRATION( Toolkit, Button, "disabled",                     BOOLEAN, DISABLED                     )
-DALI_PROPERTY_REGISTRATION( Toolkit, Button, "auto-repeating",               BOOLEAN, AUTO_REPEATING               )
-DALI_PROPERTY_REGISTRATION( Toolkit, Button, "initial-auto-repeating-delay", FLOAT,   INITIAL_AUTO_REPEATING_DELAY )
-DALI_PROPERTY_REGISTRATION( Toolkit, Button, "next-auto-repeating-delay",    FLOAT,   NEXT_AUTO_REPEATING_DELAY    )
+DALI_PROPERTY_REGISTRATION( Toolkit, Button, "autoRepeating",                BOOLEAN, AUTO_REPEATING               )
+DALI_PROPERTY_REGISTRATION( Toolkit, Button, "initialAutoRepeatingDelay",    FLOAT,   INITIAL_AUTO_REPEATING_DELAY )
+DALI_PROPERTY_REGISTRATION( Toolkit, Button, "nextAutoRepeatingDelay",       FLOAT,   NEXT_AUTO_REPEATING_DELAY    )
 DALI_PROPERTY_REGISTRATION( Toolkit, Button, "togglable",                    BOOLEAN, TOGGLABLE                    )
 DALI_PROPERTY_REGISTRATION( Toolkit, Button, "selected",                     BOOLEAN, SELECTED                     )
-DALI_PROPERTY_REGISTRATION( Toolkit, Button, "normal-state-actor",           MAP,     NORMAL_STATE_ACTOR           )
-DALI_PROPERTY_REGISTRATION( Toolkit, Button, "selected-state-actor",         MAP,     SELECTED_STATE_ACTOR         )
-DALI_PROPERTY_REGISTRATION( Toolkit, Button, "disabled-state-actor",         MAP,     DISABLED_STATE_ACTOR         )
-DALI_PROPERTY_REGISTRATION( Toolkit, Button, "label-actor",                  MAP,     LABEL_ACTOR                  )
+DALI_PROPERTY_REGISTRATION( Toolkit, Button, "unselectedStateImage",         STRING,  UNSELECTED_STATE_IMAGE       )
+DALI_PROPERTY_REGISTRATION( Toolkit, Button, "selectedStateImage",           STRING,  SELECTED_STATE_IMAGE         )
+DALI_PROPERTY_REGISTRATION( Toolkit, Button, "disabledStateImage",           STRING,  DISABLED_STATE_IMAGE         )
+DALI_PROPERTY_REGISTRATION( Toolkit, Button, "unselectedColor",              VECTOR4, UNSELECTED_COLOR             )
+DALI_PROPERTY_REGISTRATION( Toolkit, Button, "selectedColor",                VECTOR4, SELECTED_COLOR               )
+DALI_PROPERTY_REGISTRATION( Toolkit, Button, "label",                        MAP,     LABEL                        )
 
+// Deprecated properties:
+DALI_PROPERTY_REGISTRATION( Toolkit, Button, "labelText",                    STRING,  LABEL_TEXT                   )
+
+// Signals:
 DALI_SIGNAL_REGISTRATION(   Toolkit, Button, "pressed",                               SIGNAL_PRESSED               )
 DALI_SIGNAL_REGISTRATION(   Toolkit, Button, "released",                              SIGNAL_RELEASED              )
 DALI_SIGNAL_REGISTRATION(   Toolkit, Button, "clicked",                               SIGNAL_CLICKED               )
-DALI_SIGNAL_REGISTRATION(   Toolkit, Button, "state-changed",                         SIGNAL_STATE_CHANGED         )
+DALI_SIGNAL_REGISTRATION(   Toolkit, Button, "stateChanged",                          SIGNAL_STATE_CHANGED         )
 
-DALI_ACTION_REGISTRATION(   Toolkit, Button, "button-click",                          ACTION_BUTTON_CLICK          )
+// Actions:
+DALI_ACTION_REGISTRATION(   Toolkit, Button, "buttonClick",                           ACTION_BUTTON_CLICK          )
 
 DALI_TYPE_REGISTRATION_END()
 
@@ -102,6 +111,8 @@ const unsigned int NEXT_AUTOREPEATING_DELAY( 0.05f );
 Button::Button()
 : Control( ControlBehaviour( REQUIRES_TOUCH_EVENTS | REQUIRES_STYLE_CHANGE_SIGNALS ) ),
   mAutoRepeatingTimer(),
+  mUnselectedColor( Color::WHITE ), // The natural colors of the specified images will be used by default.
+  mSelectedColor( Color::WHITE ),
   mDisabled( false ),
   mAutoRepeating( false ),
   mTogglableButton( false ),
@@ -117,252 +128,134 @@ Button::Button()
 
 Button::~Button()
 {
-  if( mAutoRepeatingTimer )
-  {
-    mAutoRepeatingTimer.Reset();
-  }
 }
 
 void Button::SetDisabled( bool disabled )
 {
-  if( disabled != mDisabled )
+  if( disabled == mDisabled )
   {
-    unsigned int backgroundIndex;
-    unsigned int buttonIndex;
-
-    bool animationStarted = false;
-
-    mDisabled = disabled;
-
-    switch( mPaintState )
-    {
-      case UnselectedState:
-      {
-        buttonIndex = FindChildIndex( mLabel );
-        InsertChild( buttonIndex, mDisabledContent );
-
-        if( mBackgroundContent )
-        {
-          backgroundIndex = 1;
-        }
-        else
-        {
-          backgroundIndex = 0;
-        }
-
-        InsertChild( backgroundIndex, mDisabledBackgroundContent );
-
-        animationStarted = OnDisabled();
-
-        if( animationStarted )
-        {
-          mPaintState = UnselectedDisabledTransition;
-        }
-        else
-        {
-          mPaintState = DisabledUnselectedState;
-        }
-        break;
-      }
-      case SelectedState:
-      {
-        buttonIndex = FindChildIndex( mLabel );
-        InsertChild( buttonIndex, mDisabledSelectedContent );
-
-        if( mBackgroundContent )
-        {
-          backgroundIndex = 1;
-        }
-        else
-        {
-          backgroundIndex = 0;
-        }
-
-        InsertChild( backgroundIndex, mDisabledBackgroundContent );
-
-        animationStarted = OnDisabled();
-
-        if( animationStarted )
-        {
-          mPaintState = SelectedDisabledTransition;
-        }
-        else
-        {
-          mPaintState = DisabledSelectedState;
-        }
-        break;
-      }
-      case DisabledUnselectedState:
-      {
-        buttonIndex = FindChildIndex( mLabel );
-        InsertChild( buttonIndex, mButtonContent );
-
-        if( mDisabledBackgroundContent )
-        {
-          backgroundIndex = 1;
-        }
-        else
-        {
-          backgroundIndex = 0;
-        }
-
-        InsertChild( backgroundIndex, mBackgroundContent );
-
-        animationStarted = OnDisabled();
-
-        if( animationStarted )
-        {
-          mPaintState = DisabledUnselectedTransition;
-        }
-        else
-        {
-          mPaintState = UnselectedState;
-        }
-        break;
-      }
-      case DisabledSelectedState:
-      {
-        buttonIndex = FindChildIndex( mLabel );
-        InsertChild( buttonIndex, mSelectedContent );
-
-        if( mDisabledBackgroundContent )
-        {
-          backgroundIndex = 1;
-        }
-        else
-        {
-          backgroundIndex = 0;
-        }
-
-        InsertChild( backgroundIndex, mSelectedBackgroundContent );
-        InsertChild( backgroundIndex, mBackgroundContent );
-
-        animationStarted = OnDisabled();
-
-        if( animationStarted )
-        {
-          mPaintState = DisabledSelectedTransition;
-        }
-        else
-        {
-          mPaintState = SelectedState;
-        }
-        break;
-      }
-      case UnselectedSelectedTransition:
-      {
-        buttonIndex = FindChildIndex( mLabel );
-        InsertChild( buttonIndex, mDisabledSelectedContent );
-
-        if( mBackgroundContent )
-        {
-          backgroundIndex = 1;
-        }
-        else
-        {
-          backgroundIndex = 0;
-        }
-
-        InsertChild( backgroundIndex, mDisabledBackgroundContent );
-
-        animationStarted = OnDisabled();
-
-        if( animationStarted )
-        {
-          mPaintState = SelectedDisabledTransition;
-        }
-        else
-        {
-          mPaintState = DisabledSelectedState;
-        }
-        break;
-      }
-      case SelectedUnselectedTransition:
-      {
-        buttonIndex = FindChildIndex( mLabel );
-        InsertChild( buttonIndex, mDisabledContent );
+    return;
+  }
 
-        if( mBackgroundContent )
-        {
-          backgroundIndex = 1;
-        }
-        else
-        {
-          backgroundIndex = 0;
-        }
+  StopTransitionAnimation();
 
-        InsertChild( backgroundIndex, mDisabledBackgroundContent );
+  mDisabled = disabled;
 
-        animationStarted = OnDisabled();
+  // Notifies the derived class the button has been disabled.
+  OnDisabled();
 
-        if( animationStarted )
-        {
-          mPaintState = UnselectedDisabledTransition;
-        }
-        else
-        {
-          mPaintState = DisabledUnselectedState;
-        }
-        break;
-      }
-      case UnselectedDisabledTransition:
-      {
-        animationStarted = OnDisabled();
+  switch( mPaintState )
+  {
+    case UnselectedState:
+    {
+      //Layer Order
+      //(3) mDisabledContent (Inserted)
+      //(4) mUnselectedContent
+      //(2) mDisabledBackgroundContent (Inserted)
+      //(1) mBackgroundContent
+
+      AddButtonImage( mBackgroundContent );
+      TransitionButtonImage( mDisabledBackgroundContent );
+      AddButtonImage( mUnselectedContent );
+      TransitionButtonImage( mDisabledContent );
+
+      AddButtonImage( mDecoration[ UNSELECTED_DECORATION ] );
+      ReAddLabel();
+
+      TransitionOut( mDecoration[ SELECTED_DECORATION ] );
+      TransitionOut( mUnselectedContent );
+      TransitionOut( mSelectedContent );
+      TransitionOut( mBackgroundContent );
+      TransitionOut( mSelectedBackgroundContent );
+      TransitionOut( mDisabledSelectedContent );
 
-        if( animationStarted )
-        {
-          mPaintState = DisabledUnselectedTransition;
-        }
-        else
-        {
-          mPaintState = UnselectedState;
-        }
-        break;
-      }
-      case DisabledUnselectedTransition:
-      {
-        animationStarted = OnDisabled();
+      mPaintState = DisabledUnselectedState;
+      break;
+    }
+    case SelectedState:
+    {
+      //Layer Order
+      //(5) mDisabledSelectedContent (Inserted)
+      //(4) mSelectedContent
+      //(3) mDisabledBackgroundContent (Inserted)
+      //(2) mSelectedBackgroundContent
+      //(1) mBackgroundContent
+
+      AddButtonImage( mBackgroundContent );
+      AddButtonImage( mSelectedBackgroundContent );
+      TransitionButtonImage( mDisabledBackgroundContent );
+      AddButtonImage( mSelectedContent );
+      TransitionButtonImage( mDisabledSelectedContent );
+
+      AddButtonImage( mDecoration[ SELECTED_DECORATION ] );
+      ReAddLabel();
+
+      TransitionOut( mDecoration[ UNSELECTED_DECORATION ] );
+      TransitionOut( mUnselectedContent );
+      TransitionOut( mSelectedContent );
+      TransitionOut( mBackgroundContent );
+      TransitionOut( mSelectedBackgroundContent );
+      TransitionOut( mDisabledContent );
 
-        if( animationStarted )
-        {
-          mPaintState = UnselectedDisabledTransition;
-        }
-        else
-        {
-          mPaintState = DisabledUnselectedState;
-        }
-        break;
-      }
-      case SelectedDisabledTransition:
-      {
-        animationStarted = OnDisabled();
+      mPaintState = DisabledSelectedState;
+      break;
+    }
+    case DisabledUnselectedState:
+    {
+      //Layer Order
+      //(3) mUnselectedContent (Inserted)
+      //(4) mDisabledContent
+      //(2) mBackgroundContent (Inserted)
+      //(1) mDisabledBackgroundContent
+
+      AddButtonImage( mDisabledBackgroundContent );
+      TransitionButtonImage( mBackgroundContent );
+      AddButtonImage( mDisabledContent );
+      TransitionButtonImage( mUnselectedContent );
+
+      AddButtonImage( mDecoration[ UNSELECTED_DECORATION ] );
+      ReAddLabel();
+
+      TransitionOut( mDecoration[ SELECTED_DECORATION ] );
+      TransitionOut( mSelectedContent );
+      TransitionOut( mSelectedBackgroundContent );
+      TransitionOut( mDisabledContent );
+      TransitionOut( mDisabledSelectedContent );
+      TransitionOut( mDisabledBackgroundContent );
 
-        if( animationStarted )
-        {
-          mPaintState = DisabledSelectedTransition;
-        }
-        else
-        {
-          mPaintState = SelectedState;
-        }
-        break;
-      }
-      case DisabledSelectedTransition:
-      {
-        animationStarted = OnDisabled();
+      mPaintState = UnselectedState;
+      break;
+    }
+    case DisabledSelectedState:
+    {
+      //Layer Order
+      //(4) mSelectedContent (Inserted)
+      //(5) mDisabledSelectedContent
+      //(3) mSelectedBackgroundContent (Inserted)
+      //(2) mBackgroundContent (Inserted)
+      //(1) mDisabledBackgroundContent
+
+      AddButtonImage( mDisabledBackgroundContent );
+      TransitionButtonImage( mBackgroundContent );
+      TransitionButtonImage( mSelectedBackgroundContent );
+      AddButtonImage( mDisabledSelectedContent );
+      TransitionButtonImage( mSelectedContent );
+
+      AddButtonImage( mDecoration[ SELECTED_DECORATION ] );
+      ReAddLabel();
+
+      TransitionOut( mDecoration[ UNSELECTED_DECORATION ] );
+      TransitionOut( mUnselectedContent );
+      TransitionOut( mDisabledContent );
+      TransitionOut( mDisabledSelectedContent );
+      TransitionOut( mDisabledBackgroundContent );
 
-        if( animationStarted )
-        {
-          mPaintState = SelectedDisabledTransition;
-        }
-        else
-        {
-          mPaintState = DisabledSelectedState;
-        }
-        break;
-      }
+      mPaintState = SelectedState;
+      break;
     }
   }
+
+  StartTransitionAnimation();
 }
 
 bool Button::IsDisabled() const
@@ -440,154 +333,76 @@ void Button::SetSelected( bool selected )
 
 void Button::SetSelected( bool selected, bool emitSignal )
 {
-  unsigned int buttonIndex, backgroundIndex;
-  bool animationStarted = false;
+  StopTransitionAnimation();
 
   mSelected = selected;
 
+  // Notifies the derived class the button has been selected.
+  OnSelected();
+
   switch( mPaintState )
   {
     case UnselectedState:
     {
-      buttonIndex = FindChildIndex( mLabel );
-      InsertChild( buttonIndex, mSelectedContent );
-
-      if( mBackgroundContent )
-      {
-        backgroundIndex = 1;
-      }
-      else
-      {
-        backgroundIndex = 0;
-      }
-
-      InsertChild( backgroundIndex, mSelectedBackgroundContent );
+      //Layer Order
+      //(3) mSelectedContent (Inserted)
+      //(4) mUnselectedContent
+      //(2) mSelectedBackgroundContent (Inserted)
+      //(1) mBackgroundContent
+
+      AddButtonImage( mBackgroundContent );
+      TransitionButtonImage( mSelectedBackgroundContent );
+      AddButtonImage( mUnselectedContent );
+      TransitionButtonImage( mSelectedContent );
+
+      AddButtonImage( mDecoration[ UNSELECTED_DECORATION ] );
+      TransitionButtonImage( mDecoration[ SELECTED_DECORATION ] );
+      ReAddLabel();
+
+      TransitionOut( mDecoration[ UNSELECTED_DECORATION ] );
+      TransitionOut( mUnselectedContent );
+      TransitionOut( mDisabledContent );
+      TransitionOut( mDisabledSelectedContent );
+      TransitionOut( mDisabledBackgroundContent );
 
-      // Notifies the derived class the button has been selected.
-      animationStarted = OnSelected();
-
-      if( animationStarted )
-      {
-        mPaintState = UnselectedSelectedTransition;
-      }
-      else
-      {
-        mPaintState = SelectedState;
-      }
+      mPaintState = SelectedState;
       break;
     }
     case SelectedState:
     {
-      buttonIndex = FindChildIndex( mLabel );
-      InsertChild( buttonIndex, mButtonContent );
-
-      // Notifies the derived class the button has been selected.
-      animationStarted = OnSelected();
-
-      if( animationStarted )
-      {
-        mPaintState = SelectedUnselectedTransition;
-      }
-      else
-      {
-        mPaintState = UnselectedState;
-      }
-      break;
-    }
-    case UnselectedSelectedTransition:
-    {
-      // Notifies the derived class the button has been selected.
-      animationStarted = OnSelected();
-
-      if( animationStarted )
-      {
-        mPaintState = SelectedUnselectedTransition;
-      }
-      else
-      {
-        mPaintState = UnselectedState;
-      }
-      break;
-    }
-    case SelectedUnselectedTransition:
-    {
-      // Notifies the derived class the button has been selected.
-      animationStarted = OnSelected();
-
-      if( animationStarted )
-      {
-        mPaintState = UnselectedSelectedTransition;
-      }
-      else
-      {
-        mPaintState = SelectedState;
-      }
-      break;
-    }
-    case DisabledUnselectedTransition:
-    {
-      buttonIndex = FindChildIndex( mLabel );
-      InsertChild( buttonIndex, mSelectedContent );
-
-      if( mDisabledBackgroundContent )
-      {
-        if(  mBackgroundContent )
-        {
-          backgroundIndex = 2;
-        }
-        else
-        {
-          backgroundIndex = 1;
-        }
-      }
-      else if( mBackgroundContent )
-      {
-        backgroundIndex = 1;
-      }
-      else
-      {
-        backgroundIndex = 0;
-      }
-
-      InsertChild( backgroundIndex, mSelectedBackgroundContent );
-
-      // Notifies the derived class the button has been selected.
-      animationStarted = OnSelected();
-
-      if( animationStarted )
-      {
-        mPaintState = UnselectedSelectedTransition;
-      }
-      else
-      {
-        mPaintState = SelectedState;
-      }
-      break;
-    }
-    case DisabledSelectedTransition:
-    {
-      buttonIndex = FindChildIndex( mLabel );
-      InsertChild( buttonIndex, mButtonContent );
-
-      // Notifies the derived class the button has been selected.
-      animationStarted = OnSelected();
+      //Layer Order
+      //(3) mUnselectedContent (Inserted)
+      //(2) mSelectedContent
+      //(1) mBackgroundContent
+
+      AddButtonImage( mBackgroundContent );
+      AddButtonImage( mSelectedContent );
+      TransitionButtonImage( mUnselectedContent );
+
+      AddButtonImage( mDecoration[ SELECTED_DECORATION ] );
+      TransitionButtonImage( mDecoration[ UNSELECTED_DECORATION ] );
+      ReAddLabel();
+
+      TransitionOut( mDecoration[ SELECTED_DECORATION ] );
+      TransitionOut( mSelectedContent );
+      TransitionOut( mSelectedBackgroundContent );
+      TransitionOut( mDisabledContent );
+      TransitionOut( mDisabledSelectedContent );
+      TransitionOut( mDisabledBackgroundContent );
 
-      if( animationStarted )
-      {
-        mPaintState = SelectedUnselectedTransition;
-      }
-      else
-      {
-        mPaintState = UnselectedState;
-      }
+      mPaintState = UnselectedState;
       break;
     }
-    default:
+    case DisabledUnselectedState:
+    case DisabledSelectedState:
     {
+      DALI_ASSERT_DEBUG( 0 && "Shouldn't be able to change paint state if the button is disabled." );
       break;
     }
   }
 
+  StartTransitionAnimation();
+
   if( emitSignal )
   {
     Toolkit::Button handle( GetOwner() );
@@ -614,222 +429,257 @@ float Button::GetAnimationTime() const
   return mAnimationTime;
 }
 
-void Button::SetLabel( const std::string& label )
+void Button::SetLabelText( const std::string& label )
 {
-  Toolkit::TextLabel textLabel = Toolkit::TextLabel::New( label );
-  SetLabel( textLabel );
+  Property::Map labelProperty;
+  labelProperty.Insert( "text", label );
+  ModifyLabel( labelProperty );
 }
 
-void Button::SetLabel( Actor label )
+std::string Button::GetLabelText() const
 {
-  if( mLabel != label )
+  Toolkit::TextLabel label = Dali::Toolkit::TextLabel::DownCast( mLabel );
+  if( label )
   {
-    if( mLabel && mLabel.GetParent() )
-    {
-      mLabel.GetParent().Remove( mLabel );
-    }
-
-    mLabel = label;
-    mLabel.SetPosition( 0.f, 0.f );
+    return label.GetProperty<std::string>( Dali::Toolkit::TextLabel::Property::TEXT );
+  }
+  return std::string();
+}
 
+void Button::ModifyLabel( const Property::Map& properties )
+{
+  // If we don't have a label yet, create one.
+  if( !mLabel )
+  {
+    // If we don't have a label, create one and set it up.
+    // Note: The label text is set from the passed in property map after creation.
+    mLabel = Toolkit::TextLabel::New();
+    mLabel.SetPosition( 0.0f, 0.0f );
     // label should be the top of the button
     Self().Add( mLabel );
+  }
 
-    OnLabelSet();
+  // Set any properties specified for the label by iterating through all property key-value pairs.
+  for( unsigned int i = 0, mapCount = properties.Count(); i < mapCount; ++i )
+  {
+    const StringValuePair& propertyPair( properties.GetPair( i ) );
 
-    RelayoutRequest();
+    // Convert the property string to a property index.
+    Property::Index setPropertyIndex = mLabel.GetPropertyIndex( propertyPair.first );
+    if( setPropertyIndex != Property::INVALID_INDEX )
+    {
+      // If the conversion worked, we have a valid property index,
+      // Set the property to the new value.
+      mLabel.SetProperty( setPropertyIndex, propertyPair.second );
+    }
   }
-}
 
-Actor Button::GetLabel() const
-{
-  return mLabel;
+  // Notify derived button classes of the change.
+  OnLabelSet( false );
+
+  RelayoutRequest();
 }
 
-Actor& Button::GetLabel()
+Actor& Button::GetLabelActor()
 {
   return mLabel;
 }
 
-void Button::SetButtonImage( Actor image )
+void Button::SetDecoration( DecorationState state, Actor actor )
 {
-  StopAllAnimations();
-
-  if( mButtonContent && mButtonContent.GetParent() )
-  {
-    Self().Remove( mButtonContent );
-  }
-
-  mButtonContent = image;
-
-  mButtonContent.SetAnchorPoint( AnchorPoint::TOP_LEFT );
-  mButtonContent.SetParentOrigin( ParentOrigin::TOP_LEFT );
-  mButtonContent.SetPosition( 0.f, 0.f );
-
-  if( mPaintState == UnselectedState )
+  if( mDecoration[ state ] && mDecoration[ state ].GetParent() )
   {
-    unsigned int index = FindChildIndex( mLabel );
-
-    Self().Insert( index, mButtonContent );
+    mDecoration[ state ].Unparent();
   }
 
-  OnButtonImageSet();
+  mDecoration[ state ] = actor;
+  mDecoration[ state ].SetColorMode( USE_OWN_COLOR );
 
+  ResetImageLayers();
   RelayoutRequest();
 }
 
-Actor Button::GetButtonImage() const
-{
-  return mButtonContent;
-}
-
-Actor& Button::GetButtonImage()
+Actor& Button::GetDecoration( DecorationState state )
 {
-  return mButtonContent;
+  return mDecoration[ state ];
 }
 
-void Button::SetSelectedImage( Actor image )
+void Button::SetupContent( Actor& actorToModify, Actor newActor )
 {
-  StopAllAnimations();
-
-  if( mSelectedContent && mSelectedContent.GetParent() )
+  if( newActor )
   {
-    Self().Remove( mSelectedContent );
-  }
-
-  mSelectedContent = image;
+    StopTransitionAnimation();
 
-  mSelectedContent.SetAnchorPoint( AnchorPoint::TOP_LEFT );
-  mSelectedContent.SetParentOrigin( ParentOrigin::TOP_LEFT );
-  mSelectedContent.SetPosition( 0.f, 0.f );
-
-  if( mPaintState == SelectedState )
-  {
-    unsigned int index = FindChildIndex( mLabel );
+    if( actorToModify && actorToModify.GetParent() )
+    {
+      actorToModify.Unparent();
+    }
 
-    Self().Insert( index, mSelectedContent );
-  }
+    actorToModify = newActor;
 
-  OnSelectedImageSet();
+    if( actorToModify )
+    {
+      actorToModify.SetAnchorPoint( AnchorPoint::TOP_LEFT );
+      actorToModify.SetParentOrigin( ParentOrigin::TOP_LEFT );
+      actorToModify.SetPosition( 0.f, 0.f );
+    }
 
-  RelayoutRequest();
+    ResetImageLayers();
+  }
 }
 
-Actor Button::GetSelectedImage() const
+void Button::SetUnselectedColor( const Vector4& color )
 {
-  return mSelectedContent;
+  mUnselectedColor = color;
+
+  if( mUnselectedContent && !GetUnselectedImageFilename().empty() )
+  {
+    // If there is existing unselected content, change the color on it directly.
+    mUnselectedContent.SetColor( mUnselectedColor );
+  }
+  else
+  {
+    // If there is no existing content, create a new actor to use for flat color.
+    SetupContent( mUnselectedContent, CreateSolidColorActor( mUnselectedColor ) );
+    mUnselectedContent.SetResizePolicy( ResizePolicy::FILL_TO_PARENT, Dimension::ALL_DIMENSIONS );
+  }
 }
 
-Actor& Button::GetSelectedImage()
+const Vector4 Button::GetUnselectedColor() const
 {
-  return mSelectedContent;
+  return mUnselectedColor;
 }
 
-void Button::SetBackgroundImage( Actor image )
+void Button::SetSelectedColor( const Vector4& color )
 {
-  StopAllAnimations();
+  mSelectedColor = color;
 
-  if( mBackgroundContent && mBackgroundContent.GetParent() )
+  if( mSelectedContent && !GetSelectedImageFilename().empty() )
   {
-    Self().Remove( mBackgroundContent );
+    // If there is existing unselected content, change the color on it directly.
+    mSelectedContent.SetColor( mSelectedColor );
   }
-
-  mBackgroundContent = image;
-
-  mBackgroundContent.SetAnchorPoint( AnchorPoint::TOP_LEFT );
-  mBackgroundContent.SetParentOrigin( ParentOrigin::TOP_LEFT );
-  mBackgroundContent.SetPosition( 0.f, 0.f );
-
-  if( mPaintState == UnselectedState || mPaintState == SelectedState )
+  else
   {
-    Self().Insert( 0, mBackgroundContent );
+    // If there is no existing content, create a new actor to use for flat color.
+    SetupContent( mSelectedContent, CreateSolidColorActor( mSelectedColor ) );
+    mSelectedContent.SetResizePolicy( ResizePolicy::FILL_TO_PARENT, Dimension::ALL_DIMENSIONS );
   }
-
-  OnBackgroundImageSet();
-
-  RelayoutRequest();
-}
-
-Actor Button::GetBackgroundImage() const
-{
-  return mBackgroundContent;
 }
 
-Actor& Button::GetBackgroundImage()
+const Vector4 Button::GetSelectedColor() const
 {
-  return mBackgroundContent;
+  return mSelectedColor;
 }
 
-void Button::SetSelectedBackgroundImage( Actor image )
+void Button::SetUnselectedImage( const std::string& filename )
 {
-  StopAllAnimations();
-
-  if( mSelectedBackgroundContent && mSelectedBackgroundContent.GetParent() )
+  ImageActor newContent;
+  if( !filename.empty() )
   {
-    Self().Remove( mSelectedBackgroundContent );
+    Image resourceimage = Dali::ResourceImage::New( filename );
+    if( resourceimage )
+    {
+      newContent = ImageActor::New( resourceimage );
+    }
+  }
+  else
+  {
+    newContent = ImageActor::New();
   }
 
-  mSelectedBackgroundContent = image;
+  if( newContent )
+  {
+    SetupContent( mUnselectedContent, newContent );
 
-  mSelectedBackgroundContent.SetAnchorPoint( AnchorPoint::TOP_LEFT );
-  mSelectedBackgroundContent.SetParentOrigin( ParentOrigin::TOP_LEFT );
-  mSelectedBackgroundContent.SetPosition( 0.f, 0.f );
+    mUnselectedContent.SetColor( mUnselectedColor );
 
-  if( mPaintState == SelectedState )
+    OnUnselectedImageSet();
+    RelayoutRequest();
+  }
+}
+
+Actor& Button::GetUnselectedImage()
+{
+  return mUnselectedContent;
+}
+
+void Button::SetSelectedImage( const std::string& filename )
+{
+  ImageActor newContent;
+  if( !filename.empty() )
   {
-    if( mBackgroundContent )
+    Image resourceimage = Dali::ResourceImage::New( filename );
+    if( resourceimage )
     {
-      Self().Insert( 1, mSelectedBackgroundContent );
-    }
-    else
-    {
-      Self().Insert( 0, mSelectedBackgroundContent );
+      newContent = ImageActor::New( resourceimage );
     }
   }
+  else
+  {
+    newContent = ImageActor::New();
+  }
 
-  OnSelectedBackgroundImageSet();
+  if( newContent )
+  {
+    SetupContent( mSelectedContent, newContent );
 
-  RelayoutRequest();
-}
+    mSelectedContent.SetColor( mSelectedColor );
 
-Actor Button::GetSelectedBackgroundImage() const
-{
-  return mSelectedBackgroundContent;
+    OnSelectedImageSet();
+    RelayoutRequest();
+  }
 }
 
-Actor& Button::GetSelectedBackgroundImage()
+Actor& Button::GetSelectedImage()
 {
-  return mSelectedBackgroundContent;
+  return mSelectedContent;
 }
 
-void Button::SetDisabledImage( Actor image )
+void Button::SetBackgroundImage( const std::string& filename )
 {
-  StopAllAnimations();
-
-  if( mDisabledContent && mDisabledContent.GetParent() )
+  Image resourceimage = Dali::ResourceImage::New( filename );
+  if( resourceimage )
   {
-    Self().Remove( mDisabledContent );
-  }
+    SetupContent( mBackgroundContent, ImageActor::New( resourceimage ) );
 
-  mDisabledContent = image;
+    OnBackgroundImageSet();
+    RelayoutRequest();
+  }
+}
 
-  mDisabledContent.SetAnchorPoint( AnchorPoint::TOP_LEFT );
-  mDisabledContent.SetParentOrigin( ParentOrigin::TOP_LEFT );
-  mDisabledContent.SetPosition( 0.f, 0.f );
+Actor& Button::GetBackgroundImage()
+{
+  return mBackgroundContent;
+}
 
-  if( mPaintState == DisabledUnselectedState || mPaintState == DisabledSelectedState )
+void Button::SetSelectedBackgroundImage( const std::string& filename )
+{
+  Image resourceimage = Dali::ResourceImage::New( filename );
+  if( resourceimage )
   {
-    unsigned int index = FindChildIndex( mLabel );
+    SetupContent( mSelectedBackgroundContent, ImageActor::New( resourceimage ) );
 
-    Self().Insert( index, mDisabledContent );
+    OnSelectedBackgroundImageSet();
+    RelayoutRequest();
   }
+}
 
-  OnDisabledImageSet();
+Actor& Button::GetSelectedBackgroundImage()
+{
+  return mSelectedBackgroundContent;
 }
 
-Actor Button::GetDisabledImage() const
+void Button::SetDisabledImage( const std::string& filename )
 {
-  return mDisabledContent;
+  Image resourceimage = Dali::ResourceImage::New( filename );
+  if( resourceimage )
+  {
+    SetupContent( mDisabledContent, ImageActor::New( resourceimage ) );
+
+    OnDisabledImageSet();
+    RelayoutRequest();
+  }
 }
 
 Actor& Button::GetDisabledImage()
@@ -837,75 +687,132 @@ Actor& Button::GetDisabledImage()
   return mDisabledContent;
 }
 
-void Button::SetDisabledSelectedImage( Actor image )
+void Button::SetDisabledSelectedImage( const std::string& filename )
 {
-  StopAllAnimations();
-
-  if( mDisabledSelectedContent && mDisabledSelectedContent.GetParent() )
+  Image resourceimage = Dali::ResourceImage::New( filename );
+  if( resourceimage )
   {
-    Self().Remove( mDisabledSelectedContent );
-  }
+    SetupContent( mDisabledSelectedContent, ImageActor::New( resourceimage ) );
 
-  mDisabledSelectedContent = image;
+    OnDisabledSelectedImageSet();
+    RelayoutRequest();
+  }
+}
 
-  mDisabledSelectedContent.SetAnchorPoint( AnchorPoint::TOP_LEFT );
-  mDisabledSelectedContent.SetParentOrigin( ParentOrigin::TOP_LEFT );
-  mDisabledSelectedContent.SetPosition( 0.f, 0.f );
+Actor& Button::GetDisabledSelectedImage()
+{
+  return mDisabledSelectedContent;
+}
 
-  if( mPaintState == DisabledSelectedState )
+void Button::SetDisabledBackgroundImage( const std::string& filename )
+{
+  Image resourceimage = Dali::ResourceImage::New( filename );
+  if( resourceimage )
   {
-    unsigned int index = FindChildIndex( mLabel );
+    SetupContent( mDisabledBackgroundContent, ImageActor::New( resourceimage ) );
 
-    Self().Insert( index, mDisabledSelectedContent );
+    OnDisabledBackgroundImageSet();
+    RelayoutRequest();
   }
-
-  OnDisabledSelectedImageSet();
 }
 
-Actor Button::GetDisabledSelectedImage() const
+Actor& Button::GetDisabledBackgroundImage()
 {
-  return mDisabledSelectedContent;
+  return mDisabledBackgroundContent;
 }
 
-Actor& Button::GetDisabledSelectedImage()
+std::string Button::GetUnselectedImageFilename() const
 {
-  return mDisabledSelectedContent;
+  if( mUnselectedContent )
+  {
+    ResourceImage image = ResourceImage::DownCast( mUnselectedContent );
+    if( image )
+    {
+      return image.GetUrl();
+    }
+  }
+  return std::string();
 }
 
-void Button::SetDisabledBackgroundImage( Actor image )
+std::string Button::GetSelectedImageFilename() const
 {
-  StopAllAnimations();
-
-  if( mDisabledBackgroundContent && mDisabledBackgroundContent.GetParent() )
+  if( mSelectedContent )
   {
-    Self().Remove( mDisabledBackgroundContent );
+    ResourceImage image = ResourceImage::DownCast( mSelectedContent );
+    if( image )
+    {
+      return image.GetUrl();
+    }
   }
+  return std::string();
+}
 
-  mDisabledBackgroundContent = image;
-
-  mDisabledBackgroundContent.SetAnchorPoint( AnchorPoint::TOP_LEFT );
-  mDisabledBackgroundContent.SetParentOrigin( ParentOrigin::TOP_LEFT );
-  mDisabledBackgroundContent.SetPosition( 0.f, 0.f );
+std::string Button::GetBackgroundImageFilename() const
+{
+  if( mBackgroundContent )
+  {
+    ResourceImage image = ResourceImage::DownCast( mBackgroundContent );
+    if( image )
+    {
+      return image.GetUrl();
+    }
+  }
+  return std::string();
+}
 
-  if( mPaintState == DisabledUnselectedState || mPaintState == DisabledSelectedState )
+std::string Button::GetSelectedBackgroundImageFilename() const
+{
+  if( mSelectedBackgroundContent )
   {
-    Self().Insert( 0, mDisabledBackgroundContent );
+    ResourceImage image = ResourceImage::DownCast( mSelectedBackgroundContent );
+    if( image )
+    {
+      return image.GetUrl();
+    }
   }
+  return std::string();
+}
 
-  OnDisabledBackgroundImageSet();
+std::string Button::GetDisabledImageFilename() const
+{
+  if( mDisabledContent )
+  {
+    ResourceImage image = ResourceImage::DownCast( mDisabledContent );
+    if( image )
+    {
+      return image.GetUrl();
+    }
+  }
+  return std::string();
 }
 
-Actor Button::GetDisabledBackgroundImage() const
+std::string Button::GetDisabledSelectedImageFilename() const
 {
-  return mDisabledBackgroundContent;
+  if( mDisabledSelectedContent )
+  {
+    ResourceImage image = ResourceImage::DownCast( mDisabledSelectedContent );
+    if( image )
+    {
+      return image.GetUrl();
+    }
+  }
+  return std::string();
 }
 
-Actor& Button::GetDisabledBackgroundImage()
+std::string Button::GetDisabledBackgroundImageFilename() const
 {
-  return mDisabledBackgroundContent;
+  if( mDisabledBackgroundContent )
+  {
+    ResourceImage image = ResourceImage::DownCast( mDisabledBackgroundContent );
+    if( image )
+    {
+      return image.GetUrl();
+    }
+  }
+  return std::string();
 }
 
-  bool Button::DoAction( BaseObject* object, const std::string& actionName, const Property::Map& attributes )
+bool Button::DoAction( BaseObject* object, const std::string& actionName, const Property::Map& attributes )
 {
   bool ret = false;
 
@@ -917,14 +824,13 @@ Actor& Button::GetDisabledBackgroundImage()
 
   if( 0 == strcmp( actionName.c_str(), ACTION_BUTTON_CLICK ) )
   {
-    GetImplementation( button ).DoClickAction( attributes );
-    ret = true;
+    ret = GetImplementation( button ).DoClickAction( attributes );
   }
 
   return ret;
 }
 
-  void Button::DoClickAction( const Property::Map& attributes )
+bool Button::DoClickAction( const Property::Map& attributes )
 {
   // Prevents the button signals from doing a recursive loop by sending an action
   // and re-emitting the signals.
@@ -935,60 +841,11 @@ Actor& Button::GetDisabledBackgroundImage()
     mState = ButtonDown;
     OnButtonUp();
     mClickActionPerforming = false;
-  }
-}
 
-void Button::UpdatePaintTransitionState()
-{
-  switch( mPaintState )
-  {
-    case UnselectedSelectedTransition:
-    {
-      RemoveChild( mButtonContent );
-      mPaintState = SelectedState;
-      break;
-    }
-    case SelectedUnselectedTransition:
-    {
-      RemoveChild( mSelectedBackgroundContent );
-      RemoveChild( mSelectedContent );
-      mPaintState = UnselectedState;
-      break;
-    }
-    case UnselectedDisabledTransition:
-    {
-      RemoveChild( mBackgroundContent );
-      RemoveChild( mButtonContent );
-      mPaintState = DisabledUnselectedState;
-      break;
-    }
-    case DisabledUnselectedTransition:
-    {
-      RemoveChild( mDisabledBackgroundContent );
-      RemoveChild( mDisabledContent );
-      mPaintState = UnselectedState;
-      break;
-    }
-    case SelectedDisabledTransition:
-    {
-      RemoveChild( mBackgroundContent );
-      RemoveChild( mSelectedBackgroundContent );
-      RemoveChild( mSelectedContent );
-      mPaintState = DisabledSelectedState;
-      break;
-    }
-    case DisabledSelectedTransition:
-    {
-      RemoveChild( mDisabledBackgroundContent );
-      RemoveChild( mDisabledSelectedContent );
-      mPaintState = SelectedState;
-      break;
-    }
-    default:
-    {
-      break;
-    }
+    return true;
   }
+
+  return false;
 }
 
 void Button::OnButtonStageDisconnection()
@@ -1011,18 +868,17 @@ void Button::OnButtonDown()
 {
   if( !mTogglableButton )
   {
-    Toolkit::Button handle( GetOwner() );
-
     Pressed();
 
     if( mAutoRepeating )
     {
       SetUpTimer( mInitialAutoRepeatingDelay );
     }
-
-    //Emit signal.
-    mPressedSignal.Emit( handle );
   }
+
+  // The pressed signal should be emitted regardless of toggle mode.
+  Toolkit::Button handle( GetOwner() );
+  mPressedSignal.Emit( handle );
 }
 
 void Button::OnButtonUp()
@@ -1041,13 +897,12 @@ void Button::OnButtonUp()
       {
         mAutoRepeatingTimer.Reset();
       }
-
-      Toolkit::Button handle( GetOwner() );
-
-      //Emit signal.
-      mReleasedSignal.Emit( handle );
-      mClickedSignal.Emit( handle );
     }
+
+    // The clicked and released signals should be emitted regardless of toggle mode.
+    Toolkit::Button handle( GetOwner() );
+    mReleasedSignal.Emit( handle );
+    mClickedSignal.Emit( handle );
   }
 }
 
@@ -1057,18 +912,17 @@ void Button::OnTouchPointLeave()
   {
     if( !mTogglableButton )
     {
-      Toolkit::Button handle( GetOwner() );
-
       Released();
 
       if( mAutoRepeating )
       {
         mAutoRepeatingTimer.Reset();
       }
-
-      //Emit signal.
-      mReleasedSignal.Emit( handle );
     }
+
+    // The released signal should be emitted regardless of toggle mode.
+    Toolkit::Button handle( GetOwner() );
+    mReleasedSignal.Emit( handle );
   }
 }
 
@@ -1203,15 +1057,21 @@ void Button::OnInitialize()
 
   OnButtonInitialize();
 
-  self.SetDrawMode( DrawMode::OVERLAY );
   self.SetKeyboardFocusable( true );
 }
 
-void Button::OnActivated()
+bool Button::OnAccessibilityActivated()
+{
+  return OnKeyboardEnter();
+}
+
+bool Button::OnKeyboardEnter()
 {
-  // When the button is activated, it performs the click action
+  // When the enter key is pressed, or button is activated, the click action is performed.
   Property::Map attributes;
-  DoClickAction( attributes );
+  bool ret = DoClickAction( attributes );
+
+  return ret;
 }
 
 void Button::OnControlStageDisconnection()
@@ -1255,162 +1115,72 @@ bool Button::AutoRepeatingSlot()
 
 void Button::Pressed()
 {
-  unsigned int buttonIndex, backgroundIndex;
-  bool animationStarted = false;
-
-  switch( mPaintState )
+  if( mPaintState == UnselectedState )
   {
-    case UnselectedState:
-    {
-      buttonIndex = FindChildIndex( mLabel );
-      InsertChild( buttonIndex, mSelectedContent );
+    StopTransitionAnimation();
 
-      if( mBackgroundContent )
-      {
-        backgroundIndex = 1;
-      }
-      else
-      {
-        backgroundIndex = 0;
-      }
+    // Notifies the derived class the button has been pressed.
+    OnPressed();
 
-      InsertChild( backgroundIndex, mSelectedBackgroundContent );
+    //Layer Order
+    //(4) mSelectedContent (Inserted)
+    //(3) mUnselectedContent
+    //(2) mSelectedBackgroundContent (Inserted)
+    //(1) mBackgroundContent
 
-      // Notifies the derived class the button has been pressed.
-      animationStarted = OnPressed();
+    AddButtonImage( mBackgroundContent );
+    TransitionButtonImage( mSelectedBackgroundContent );
+    AddButtonImage( mUnselectedContent );
+    TransitionButtonImage( mSelectedContent );
 
-      if( animationStarted )
-      {
-        mPaintState = UnselectedSelectedTransition;
-      }
-      else
-      {
-        mPaintState = SelectedState;
-      }
-      break;
-    }
-    case SelectedUnselectedTransition:
-    {
-      // Notifies the derived class the button has been pressed.
-      animationStarted = OnPressed();
+    AddButtonImage( mDecoration[ UNSELECTED_DECORATION ] );
+    TransitionButtonImage( mDecoration[ SELECTED_DECORATION ] );
+    ReAddLabel();
 
-      if( animationStarted )
-      {
-        mPaintState = UnselectedSelectedTransition;
-      }
-      else
-      {
-        mPaintState = SelectedState;
-      }
-      break;
-    }
-    case DisabledUnselectedTransition:
-    {
-      buttonIndex = FindChildIndex( mLabel );
-      InsertChild( buttonIndex, mSelectedContent );
+    TransitionOut( mDecoration[ UNSELECTED_DECORATION ] );
+    TransitionOut( mUnselectedContent );
+    TransitionOut( mDisabledContent );
+    TransitionOut( mDisabledSelectedContent );
+    TransitionOut( mDisabledBackgroundContent );
 
-      if( mDisabledBackgroundContent )
-      {
-        if(  mBackgroundContent )
-        {
-          backgroundIndex = 2;
-        }
-        else
-        {
-          backgroundIndex = 1;
-        }
-      }
-      else if( mBackgroundContent )
-      {
-        backgroundIndex = 1;
-      }
-      else
-      {
-        backgroundIndex = 0;
-      }
-
-      InsertChild( backgroundIndex, mSelectedBackgroundContent );
+    mPaintState = SelectedState;
 
-      // Notifies the derived class the button has been pressed.
-      animationStarted = OnPressed();
-
-      if( animationStarted )
-      {
-        mPaintState = UnselectedSelectedTransition;
-      }
-      else
-      {
-        mPaintState = SelectedState;
-      }
-      break;
-    }
-    default:
-      break;
+    StartTransitionAnimation();
   }
 }
 
 void Button::Released()
 {
-  unsigned int buttonIndex;
-  bool animationStarted = false;
-
-  switch( mPaintState )
+  if( mPaintState == SelectedState )
   {
-    case SelectedState:
-    {
-      buttonIndex = FindChildIndex( mLabel );
-      InsertChild( buttonIndex, mButtonContent );
+    StopTransitionAnimation();
 
-      // Notifies the derived class the button has been released.
-      animationStarted = OnReleased();
+    // Notifies the derived class the button has been released.
+    OnReleased();
 
-      if( animationStarted )
-      {
-        mPaintState = SelectedUnselectedTransition;
-      }
-      else
-      {
-        mPaintState = UnselectedState;
-      }
-      break;
-    }
-    case UnselectedSelectedTransition:
-    {
-      // Notifies the derived class the button has been released.
-      animationStarted = OnReleased();
+    //Layer Order
+    //(3) mUnselectedContent (Inserted)
+    //(2) mSelectedContent
+    //(1) mBackgroundContent
 
-      if( animationStarted )
-      {
-        mPaintState = SelectedUnselectedTransition;
-      }
-      else
-      {
-        mPaintState = UnselectedState;
-      }
-      break;
-    }
-    case DisabledSelectedTransition:
-    {
-      buttonIndex = FindChildIndex( mLabel );
-      InsertChild( buttonIndex, mButtonContent );
+    AddButtonImage( mBackgroundContent );
+    AddButtonImage( mSelectedContent );
+    TransitionButtonImage( mUnselectedContent );
 
-      // Notifies the derived class the button has been released.
-      animationStarted = OnReleased();
+    AddButtonImage( mDecoration[ SELECTED_DECORATION ] );
+    TransitionButtonImage( mDecoration[ UNSELECTED_DECORATION ] );
+    ReAddLabel();
 
-      if( animationStarted )
-      {
-        mPaintState = SelectedUnselectedTransition;
-      }
-      else
-      {
-        mPaintState = UnselectedState;
-      }
-      break;
-    }
-    default:
-    {
-      break;
-    }
+    TransitionOut( mDecoration[ SELECTED_DECORATION ] );
+    TransitionOut( mSelectedContent );
+    TransitionOut( mSelectedBackgroundContent );
+    TransitionOut( mDisabledContent );
+    TransitionOut( mDisabledSelectedContent );
+    TransitionOut( mDisabledBackgroundContent );
+
+    mPaintState = UnselectedState;
+
+    StartTransitionAnimation();
   }
 }
 
@@ -1424,19 +1194,56 @@ Button::PaintState Button::GetPaintState()
   return mPaintState;
 }
 
-void Button::InsertChild( unsigned int index, Actor& actor )
+void Button::PrepareAddButtonImage( Actor& actor )
+{
+  if( actor )
+  {
+    actor.Unparent();
+    Self().Add( actor );
+    PrepareForTranstionOut( actor );
+  }
+}
+
+void Button::TransitionButtonImage( Actor& actor )
 {
   if( actor )
   {
-    Self().Insert( index, actor);
+    if( !actor.GetParent() )
+    {
+      Self().Add( actor );
+    }
+
+    OnTransitionIn( actor );
   }
 }
 
-void Button::RemoveChild( Actor& actor )
+void Button::AddButtonImage( Actor& actor )
 {
-  if( actor && actor.GetParent() )
+  if( actor )
   {
-    Self().Remove( actor );
+    actor.Unparent();
+    Self().Add( actor );
+  }
+}
+
+void Button::ReAddLabel()
+{
+  if( mLabel )
+  {
+    mLabel.Unparent();
+    Self().Add( mLabel );
+  }
+}
+
+void Button::RemoveButtonImage( Actor& actor )
+{
+  if( actor )
+  {
+    if( actor.GetParent() )
+    {
+      Self().Remove( actor );
+    }
+    PrepareForTranstionIn( actor );
   }
 }
 
@@ -1457,6 +1264,150 @@ unsigned int Button::FindChildIndex( Actor& actor )
   return childrenNum;
 }
 
+void Button::TransitionOut( Actor actor )
+{
+  OnTransitionOut( actor );
+}
+
+void Button::ResetImageLayers()
+{
+  // Ensure that all layers are in the correct order and state according to the paint state
+
+  switch( mPaintState )
+  {
+    case UnselectedState:
+    {
+      //Layer Order
+      //(2) mUnselectedContent
+      //(1) mBackgroundContent
+
+      RemoveButtonImage( mDecoration[ SELECTED_DECORATION ] );
+      RemoveButtonImage( mSelectedContent );
+      RemoveButtonImage( mSelectedBackgroundContent );
+      RemoveButtonImage( mDisabledContent );
+      RemoveButtonImage( mDisabledSelectedContent );
+      RemoveButtonImage( mDisabledBackgroundContent );
+
+      PrepareAddButtonImage( mBackgroundContent );
+      PrepareAddButtonImage( mUnselectedContent );
+
+      PrepareAddButtonImage( mDecoration[ UNSELECTED_DECORATION ] );
+      ReAddLabel();
+      break;
+    }
+    case SelectedState:
+    {
+      //Layer Order
+      //(3) mSelectedContent
+      //(2) mSelectedBackgroundContent
+      //(1) mBackgroundContent
+
+      RemoveButtonImage( mDecoration[ UNSELECTED_DECORATION ] );
+      RemoveButtonImage( mUnselectedContent );
+      RemoveButtonImage( mDisabledContent );
+      RemoveButtonImage( mDisabledSelectedContent );
+      RemoveButtonImage( mDisabledBackgroundContent );
+
+      PrepareAddButtonImage( mBackgroundContent );
+      PrepareAddButtonImage( mSelectedBackgroundContent );
+      PrepareAddButtonImage( mSelectedContent );
+
+      PrepareAddButtonImage( mDecoration[ SELECTED_DECORATION ] );
+      ReAddLabel();
+      break;
+    }
+    case DisabledUnselectedState:
+    {
+      //Layer Order
+      //(2) mDisabledContent
+      //(1) mDisabledBackgroundContent
+
+      RemoveButtonImage( mDecoration[ UNSELECTED_DECORATION ] );
+      RemoveButtonImage( mUnselectedContent );
+      RemoveButtonImage( mBackgroundContent );
+      RemoveButtonImage( mDecoration[ SELECTED_DECORATION ] );
+      RemoveButtonImage( mSelectedContent );
+      RemoveButtonImage( mDisabledSelectedContent );
+      RemoveButtonImage( mSelectedBackgroundContent );
+
+      PrepareAddButtonImage( mDisabledBackgroundContent ? mDisabledBackgroundContent : mBackgroundContent );
+      PrepareAddButtonImage( mDisabledContent ? mDisabledContent : mUnselectedContent );
+
+      PrepareAddButtonImage( mDecoration[ UNSELECTED_DECORATION ] );
+      ReAddLabel();
+      break;
+    }
+    case DisabledSelectedState:
+    {
+      //Layer Order
+      // (2) mDisabledSelectedContent
+      // (1) mDisabledBackgroundContent
+
+      RemoveButtonImage( mDecoration[ UNSELECTED_DECORATION ] );
+      RemoveButtonImage( mUnselectedContent );
+      RemoveButtonImage( mDecoration[ SELECTED_DECORATION ] );
+      RemoveButtonImage( mSelectedContent );
+      RemoveButtonImage( mBackgroundContent );
+      RemoveButtonImage( mSelectedBackgroundContent );
+      RemoveButtonImage( mDisabledContent );
+
+      if( mDisabledBackgroundContent )
+      {
+        PrepareAddButtonImage( mDisabledBackgroundContent );
+      }
+      else
+      {
+        PrepareAddButtonImage( mBackgroundContent );
+        PrepareAddButtonImage( mSelectedBackgroundContent );
+      }
+
+      PrepareAddButtonImage( mDisabledSelectedContent ? mDisabledSelectedContent : mSelectedContent );
+
+      PrepareAddButtonImage( mDecoration[ SELECTED_DECORATION ] );
+      ReAddLabel();
+      break;
+    }
+  }
+}
+
+void Button::StartTransitionAnimation()
+{
+  if( mTransitionAnimation )
+  {
+    mTransitionAnimation.Play();
+  }
+  else
+  {
+    ResetImageLayers();
+  }
+}
+
+void Button::StopTransitionAnimation()
+{
+  if( mTransitionAnimation )
+  {
+    mTransitionAnimation.Clear();
+    mTransitionAnimation.Reset();
+  }
+}
+
+Dali::Animation Button::GetTransitionAnimation()
+{
+  if( !mTransitionAnimation )
+  {
+    mTransitionAnimation = Dali::Animation::New( GetAnimationTime() );
+    mTransitionAnimation.FinishedSignal().Connect( this, &Button::TransitionAnimationFinished );
+  }
+
+  return mTransitionAnimation;
+}
+
+void Button::TransitionAnimationFinished( Dali::Animation& source )
+{
+  StopTransitionAnimation();
+  ResetImageLayers();
+}
+
 void Button::SetProperty( BaseObject* object, Property::Index index, const Property::Value& value )
 {
   Toolkit::Button button = Toolkit::Button::DownCast( Dali::BaseHandle( object ) );
@@ -1467,7 +1418,7 @@ void Button::SetProperty( BaseObject* object, Property::Index index, const Prope
     {
       case Toolkit::Button::Property::DISABLED:
       {
-        GetImplementation( button ).SetDisabled( value.Get<bool>() );
+        GetImplementation( button ).SetDisabled( value.Get< bool >() );
         break;
       }
 
@@ -1501,29 +1452,52 @@ void Button::SetProperty( BaseObject* object, Property::Index index, const Prope
         break;
       }
 
-      case Toolkit::Button::Property::NORMAL_STATE_ACTOR:
+      case Toolkit::Button::Property::UNSELECTED_STATE_IMAGE:
       {
-        GetImplementation( button ).SetButtonImage( Scripting::NewActor( value.Get< Property::Map >() ) );
+        GetImplementation( button ).SetUnselectedImage( value.Get< std::string >() );
         break;
       }
 
-      case Toolkit::Button::Property::SELECTED_STATE_ACTOR:
+      case Toolkit::Button::Property::SELECTED_STATE_IMAGE:
       {
-        GetImplementation( button ).SetSelectedImage( Scripting::NewActor( value.Get< Property::Map >() ) );
+        GetImplementation( button ).SetSelectedImage( value.Get< std::string >() );
         break;
       }
 
-      case Toolkit::Button::Property::DISABLED_STATE_ACTOR:
+      case Toolkit::Button::Property::DISABLED_STATE_IMAGE:
       {
-        GetImplementation( button ).SetDisabledImage( Scripting::NewActor( value.Get< Property::Map >() ) );
+        GetImplementation( button ).SetDisabledImage( value.Get< std::string >() );
         break;
       }
 
-      case Toolkit::Button::Property::LABEL_ACTOR:
+      case Toolkit::Button::Property::UNSELECTED_COLOR:
       {
-        GetImplementation( button ).SetLabel( Scripting::NewActor( value.Get< Property::Map >() ) );
+        GetImplementation( button ).SetUnselectedColor( value.Get< Vector4 >() );
         break;
       }
+
+      case Toolkit::Button::Property::SELECTED_COLOR:
+      {
+        GetImplementation( button ).SetSelectedColor( value.Get< Vector4 >() );
+        break;
+      }
+
+      case Toolkit::Button::Property::LABEL_TEXT:
+      {
+        GetImplementation( button ).SetLabelText( value.Get< std::string >() );
+        break;
+      }
+
+      case Toolkit::Button::Property::LABEL:
+      {
+        // Get a Property::Map from the property if possible.
+        Property::Map setPropertyMap;
+        if( value.Get( setPropertyMap ) )
+        {
+          GetImplementation( button ).ModifyLabel( setPropertyMap );
+        }
+      }
+      break;
     }
   }
 }
@@ -1574,35 +1548,46 @@ Property::Value Button::GetProperty( BaseObject* object, Property::Index propert
         break;
       }
 
-      case Toolkit::Button::Property::NORMAL_STATE_ACTOR:
+      case Toolkit::Button::Property::UNSELECTED_STATE_IMAGE:
+      {
+        value = GetImplementation( button ).GetUnselectedImageFilename();
+        break;
+      }
+
+      case Toolkit::Button::Property::SELECTED_STATE_IMAGE:
+      {
+        value = GetImplementation( button ).GetSelectedImageFilename();
+        break;
+      }
+
+      case Toolkit::Button::Property::DISABLED_STATE_IMAGE:
       {
-        Property::Map map;
-        Scripting::CreatePropertyMap( GetImplementation( button ).mButtonContent, map );
-        value = map;
+        value = GetImplementation( button ).GetDisabledImageFilename();
         break;
       }
 
-      case Toolkit::Button::Property::SELECTED_STATE_ACTOR:
+      case Toolkit::Button::Property::UNSELECTED_COLOR:
       {
-        Property::Map map;
-        Scripting::CreatePropertyMap( GetImplementation( button ).mSelectedContent, map );
-        value = map;
+        value = GetImplementation( button ).GetUnselectedColor();
         break;
       }
 
-      case Toolkit::Button::Property::DISABLED_STATE_ACTOR:
+      case Toolkit::Button::Property::SELECTED_COLOR:
       {
-        Property::Map map;
-        Scripting::CreatePropertyMap( GetImplementation( button ).mDisabledContent, map );
-        value = map;
+        value = GetImplementation( button ).GetSelectedColor();
         break;
       }
 
-      case Toolkit::Button::Property::LABEL_ACTOR:
+      case Toolkit::Button::Property::LABEL_TEXT:
       {
-        Property::Map map;
-        Scripting::CreatePropertyMap( GetImplementation( button ).mLabel, map );
-        value = map;
+        value = GetImplementation( button ).GetLabelText();
+        break;
+      }
+
+      case Toolkit::Button::Property::LABEL:
+      {
+        Property::Map emptyMap;
+        value = emptyMap;
         break;
       }
     }
@@ -1611,6 +1596,132 @@ Property::Value Button::GetProperty( BaseObject* object, Property::Index propert
   return value;
 }
 
+// Deprecated API
+
+void Button::SetLabel( Actor label )
+{
+  if( mLabel != label )
+  {
+    if( mLabel && mLabel.GetParent() )
+    {
+      mLabel.GetParent().Remove( mLabel );
+    }
+
+    mLabel = label;
+    mLabel.SetPosition( 0.0f, 0.0f );
+
+    // label should be the top of the button
+    Self().Add( mLabel );
+
+    ResetImageLayers();
+    OnLabelSet( true );
+
+    RelayoutRequest();
+  }
+}
+
+void Button::SetButtonImage( Actor image )
+{
+  if( image )
+  {
+    StopTransitionAnimation();
+
+    SetupContent( mUnselectedContent, image );
+
+    OnUnselectedImageSet();
+    RelayoutRequest();
+  }
+}
+
+void Button::SetSelectedImage( Actor image )
+{
+  if( image )
+  {
+    StopTransitionAnimation();
+
+    SetupContent( mSelectedContent, image );
+
+    OnSelectedImageSet();
+    RelayoutRequest();
+  }
+}
+
+void Button::SetBackgroundImage( Actor image )
+{
+  if( image )
+  {
+    StopTransitionAnimation();
+
+    SetupContent( mBackgroundContent, image );
+
+    OnBackgroundImageSet();
+    RelayoutRequest();
+  }
+}
+
+void Button::SetSelectedBackgroundImage( Actor image )
+{
+  if( image )
+  {
+    StopTransitionAnimation();
+
+    SetupContent( mSelectedBackgroundContent, image );
+
+    OnSelectedBackgroundImageSet();
+    RelayoutRequest();
+  }
+}
+
+void Button::SetDisabledImage( Actor image )
+{
+  if( image )
+  {
+    StopTransitionAnimation();
+
+    SetupContent( mDisabledContent, image );
+
+    OnDisabledImageSet();
+    RelayoutRequest();
+  }
+}
+
+void Button::SetDisabledSelectedImage( Actor image )
+{
+  if( image )
+  {
+    StopTransitionAnimation();
+
+    SetupContent( mDisabledSelectedContent, image );
+
+    OnDisabledSelectedImageSet();
+    RelayoutRequest();
+  }
+}
+
+void Button::SetDisabledBackgroundImage( Actor image )
+{
+  if( image )
+  {
+    StopTransitionAnimation();
+
+    SetupContent( mDisabledBackgroundContent, image );
+
+    OnDisabledBackgroundImageSet();
+    RelayoutRequest();
+  }
+}
+
+Actor Button::GetButtonImage() const
+{
+  return mUnselectedContent;
+}
+
+Actor Button::GetSelectedImage() const
+{
+  return mSelectedContent;
+}
+
+
 } // namespace Internal
 
 } // namespace Toolkit