#include <dali-toolkit/devel-api/controls/control-devel.h>
#include <dali-toolkit/devel-api/layouting/linear-layout.h>
#include <dali-toolkit/devel-api/layouting/grid.h>
+#include <dali-toolkit/devel-api/focus-manager/keyinput-focus-manager.h>
#include <dali/integration-api/debug.h>
const unsigned int NUMBER_OF_RESOURCES = sizeof(IMAGE_PATH) / sizeof(char*);
-// Helper function to create ImageViews with given filename and size.
-void CreateChildImageView( ImageView& imageView, int index, Size size )
+// Helper function
+void CreateChild( ImageView& child, int index, Size size )
{
- imageView = ImageView::New();
+ child = ImageView::New();
Property::Map imagePropertyMap;
imagePropertyMap[ Toolkit::Visual::Property::TYPE ] = Toolkit::Visual::IMAGE;
imagePropertyMap[ Toolkit::ImageVisual::Property::URL ] = IMAGE_PATH[ index ];
imagePropertyMap[ ImageVisual::Property::DESIRED_WIDTH ] = size.width;
imagePropertyMap[ ImageVisual::Property::DESIRED_HEIGHT ] = size.height;
- imageView.SetProperty( Toolkit::ImageView::Property::IMAGE, imagePropertyMap );
+ child.SetProperty( Toolkit::ImageView::Property::IMAGE, imagePropertyMap );
std::string name = "ImageView";
name.append( 1, '0' + index );
- imageView.SetName( name );
- imageView.SetAnchorPoint( AnchorPoint::TOP_LEFT );
- imageView.SetResizePolicy( ResizePolicy::FIXED, Dimension::ALL_DIMENSIONS );
+ child.SetName( name );
+ child.SetAnchorPoint( AnchorPoint::TOP_LEFT );
}
-LayoutTransitionData CreateOnSetLayoutTransition( Control& parent, std::vector< Toolkit::ImageView >& children )
+// Create set layout transition. A parent opacity increases 'ease in out' from semi-transparent to fully opaque and children pulse in order
+LayoutTransitionData CreateOnSetLayoutTransition( Control& container )
{
auto layoutTransitionData = LayoutTransitionData::New();
Property::Map map;
map[ LayoutTransitionData::AnimatorKey::INITIAL_VALUE ] = 0.5f;
map[ LayoutTransitionData::AnimatorKey::TARGET_VALUE ] = 1.0f;
map[ LayoutTransitionData::AnimatorKey::ANIMATOR ] = Property::Map()
- .Add( LayoutTransitionData::AnimatorKey::ALPHA_FUNCTION, "EASE_IN_OUT" )
+ .Add( LayoutTransitionData::AnimatorKey::ALPHA_FUNCTION, AlphaFunction::EASE_IN_OUT )
.Add( LayoutTransitionData::AnimatorKey::TIME_PERIOD, Property::Map()
.Add( LayoutTransitionData::AnimatorKey::DELAY, 0.25f )
.Add( LayoutTransitionData::AnimatorKey::DURATION, 0.5f ) );
// Apply to parent only
- layoutTransitionData.AddPropertyAnimator( parent, map );
+ layoutTransitionData.AddPropertyAnimator( container, map );
- for( size_t i = 0; i < children.size(); i++ )
+ for( size_t i = 0; i < container.GetChildCount(); i++ )
{
Property::Map map;
map[ LayoutTransitionData::AnimatorKey::PROPERTY ] = Actor::Property::SIZE;
map[ LayoutTransitionData::AnimatorKey::TARGET_VALUE ] = Vector3( 100.0f * 1.2f, 100.0f * 1.2f, 0 );
map[ LayoutTransitionData::AnimatorKey::ANIMATOR ] = Property::Map()
- .Add( LayoutTransitionData::AnimatorKey::ALPHA_FUNCTION, "SIN" )
+ .Add( LayoutTransitionData::AnimatorKey::ALPHA_FUNCTION, AlphaFunction::SIN )
.Add( LayoutTransitionData::AnimatorKey::TIME_PERIOD, Property::Map()
.Add( LayoutTransitionData::AnimatorKey::DELAY, 0.5f + 0.1f * i)
.Add( LayoutTransitionData::AnimatorKey::DURATION, 0.25f ) );
- layoutTransitionData.AddPropertyAnimator( children[i], map );
+ layoutTransitionData.AddPropertyAnimator( container.GetChildAt( i ), map );
}
return layoutTransitionData;
}
-LayoutTransitionData CreateOnChildAddTransition( Control& parent, ImageView& child )
+// Create add child transition. An added child grows from (0, 0) to its full size and instantly appears in its position
+LayoutTransitionData CreateOnChildAddTransition( Control& parent )
{
auto layoutTransitionData = LayoutTransitionData::New();
Property::Map map;
map[ LayoutTransitionData::AnimatorKey::PROPERTY ] = Actor::Property::SIZE;
map[ LayoutTransitionData::AnimatorKey::ANIMATOR ] = Property::Map()
- .Add( LayoutTransitionData::AnimatorKey::ALPHA_FUNCTION, "LINEAR")
+ .Add( LayoutTransitionData::AnimatorKey::ALPHA_FUNCTION, AlphaFunction::LINEAR )
.Add( LayoutTransitionData::AnimatorKey::TIME_PERIOD, Property::Map()
.Add( LayoutTransitionData::AnimatorKey::DELAY, 0.0f )
.Add( LayoutTransitionData::AnimatorKey::DURATION, 0.0f ) );
// New child is growing
{
Property::Map map;
+ map[ LayoutTransitionData::AnimatorKey::CONDITION ] = LayoutTransitionData::Condition::ON_ADD;
map[ LayoutTransitionData::AnimatorKey::PROPERTY ] = Actor::Property::SIZE;
- map["initialValue"] = Vector3( 0.0f, 0.0f, 0 );
+ map[ LayoutTransitionData::AnimatorKey::INITIAL_VALUE ] = Vector3( 0.0f, 0.0f, 0 );
map[ LayoutTransitionData::AnimatorKey::TARGET_VALUE ] = Vector3( 100.0f, 100.0f, 0 );
map[ LayoutTransitionData::AnimatorKey::ANIMATOR ] = Property::Map()
- .Add( LayoutTransitionData::AnimatorKey::ALPHA_FUNCTION, "LINEAR")
+ .Add( LayoutTransitionData::AnimatorKey::ALPHA_FUNCTION, AlphaFunction::LINEAR )
.Add( LayoutTransitionData::AnimatorKey::TIME_PERIOD, Property::Map()
.Add( LayoutTransitionData::AnimatorKey::DELAY, 0.0f )
.Add( LayoutTransitionData::AnimatorKey::DURATION, 0.5f ) );
- layoutTransitionData.AddPropertyAnimator( child, map );
+ layoutTransitionData.AddPropertyAnimator( Actor(), map );
}
// Want new children instantly appear in their positions
{
Property::Map map;
- map[ LayoutTransitionData::AnimatorKey::PROPERTY] = Actor::Property::POSITION;
- map[ LayoutTransitionData::AnimatorKey::ANIMATOR] = Property::Map()
- .Add( LayoutTransitionData::AnimatorKey::ALPHA_FUNCTION, "LINEAR")
+ map[ LayoutTransitionData::AnimatorKey::CONDITION ] = LayoutTransitionData::Condition::ON_ADD;
+ map[ LayoutTransitionData::AnimatorKey::PROPERTY ] = Actor::Property::POSITION;
+ map[ LayoutTransitionData::AnimatorKey::ANIMATOR ] = Property::Map()
+ .Add( LayoutTransitionData::AnimatorKey::ALPHA_FUNCTION, AlphaFunction::LINEAR )
.Add( LayoutTransitionData::AnimatorKey::TIME_PERIOD, Property::Map()
.Add( LayoutTransitionData::AnimatorKey::DELAY, 0.0f )
.Add( LayoutTransitionData::AnimatorKey::DURATION, 0.0f ) );
- layoutTransitionData.AddPropertyAnimator( child, map );
+ layoutTransitionData.AddPropertyAnimator( Actor(), map );
}
return layoutTransitionData;
}
-LayoutTransitionData CreateOnChildRemoveTransition(std::vector< Toolkit::ImageView >& images)
+// Create remove child transition. Remaining children shake around their positions
+LayoutTransitionData CreateOnChildRemoveTransition( Control& container )
{
auto layoutTransitionData = LayoutTransitionData::New();
+
// Apply animation to remaining children
- for (unsigned int i = 0; i < images.size(); i++)
+ Property::Map map;
+ map[ LayoutTransitionData::AnimatorKey::PROPERTY ] = Actor::Property::POSITION;
+ map[ LayoutTransitionData::AnimatorKey::ANIMATOR ] = Property::Map()
+ .Add( LayoutTransitionData::AnimatorKey::ALPHA_FUNCTION, AlphaFunction::SIN )
+ .Add( LayoutTransitionData::AnimatorKey::TIME_PERIOD, Property::Map()
+ .Add( LayoutTransitionData::AnimatorKey::DELAY, 0.0f)
+ .Add( LayoutTransitionData::AnimatorKey::DURATION, 0.5f));
+ layoutTransitionData.AddPropertyAnimator( Actor(), map );
+
+ return layoutTransitionData;
+}
+
+// Create child focus transition. A focus gained child grows 115% and focus lost child gets its original size back
+LayoutTransitionData CreateOnChildFocusTransition( Control& parent )
+{
+ auto layoutTransitionData = LayoutTransitionData::New();
+
{
- {
- Property::Map map;
- map[ LayoutTransitionData::AnimatorKey::PROPERTY ] = "position";
- map[ LayoutTransitionData::AnimatorKey::ANIMATOR ] = Property::Map()
- .Add( LayoutTransitionData::AnimatorKey::ALPHA_FUNCTION, "SIN")
- .Add( LayoutTransitionData::AnimatorKey::TIME_PERIOD, Property::Map()
- .Add( LayoutTransitionData::AnimatorKey::DELAY, 0.0f)
- .Add( LayoutTransitionData::AnimatorKey::DURATION, 0.5f));
- layoutTransitionData.AddPropertyAnimator( images[i], map );
- }
+ Property::Map map;
+ map[ LayoutTransitionData::AnimatorKey::CONDITION ] = LayoutTransitionData::Condition::ON_FOCUS_GAINED;
+ map[ LayoutTransitionData::AnimatorKey::PROPERTY ] = Actor::Property::SIZE;
+ map[ LayoutTransitionData::AnimatorKey::TARGET_VALUE ] = Vector3( 115.0f, 115.0f, 0 );
+ map[ LayoutTransitionData::AnimatorKey::ANIMATOR ] = Property::Map()
+ .Add( LayoutTransitionData::AnimatorKey::TIME_PERIOD, Property::Map()
+ .Add( LayoutTransitionData::AnimatorKey::DELAY, 0.0f )
+ .Add( LayoutTransitionData::AnimatorKey::DURATION, 0.5f ) );
+ layoutTransitionData.AddPropertyAnimator( Actor(), map );
+ }
+
+ {
+ Property::Map map;
+ map[ LayoutTransitionData::AnimatorKey::CONDITION ] = LayoutTransitionData::Condition::ON_FOCUS_LOST;
+ map[ LayoutTransitionData::AnimatorKey::PROPERTY ] = Actor::Property::SIZE;
+ map[ LayoutTransitionData::AnimatorKey::TARGET_VALUE ] = Vector3( 100.0f, 100.0f, 0 );
+ map[ LayoutTransitionData::AnimatorKey::ANIMATOR ] = Property::Map()
+ .Add( LayoutTransitionData::AnimatorKey::TIME_PERIOD, Property::Map()
+ .Add( LayoutTransitionData::AnimatorKey::DELAY, 0.0f )
+ .Add( LayoutTransitionData::AnimatorKey::DURATION, 0.5f ) );
+ layoutTransitionData.AddPropertyAnimator( Actor(), map );
}
return layoutTransitionData;
}
-void CreateChildImageViewAndAdd( Control& container, int index, std::vector< Toolkit::ImageView >& images )
+// An example of custom default transition, ease in for position animation, ease out for size animation
+LayoutTransitionData CreateCustomDefaultTransition( Control& parent )
{
- Toolkit::ImageView imageView;
- CreateChildImageView( imageView, index, Size( 100.0f, 100.0f ) );
- auto layout = DevelControl::GetLayout( container );
- layout.SetTransitionData( LayoutTransitionData::ON_CHILD_ADD, CreateOnChildAddTransition( container, imageView ) );
+ auto layoutTransitionData = LayoutTransitionData::New();
+
+ {
+ Property::Map map;
+ map[ LayoutTransitionData::AnimatorKey::PROPERTY ] = Actor::Property::POSITION;
+ map[ LayoutTransitionData::AnimatorKey::ANIMATOR ] = Property::Map()
+ .Add( LayoutTransitionData::AnimatorKey::ALPHA_FUNCTION, AlphaFunction::EASE_IN )
+ .Add( LayoutTransitionData::AnimatorKey::TIME_PERIOD, Property::Map()
+ .Add( LayoutTransitionData::AnimatorKey::DELAY, 0.0f )
+ .Add( LayoutTransitionData::AnimatorKey::DURATION, 0.5f ) );
+ layoutTransitionData.AddPropertyAnimator( parent, map );
+ }
+ {
+ Property::Map map;
+ map[ LayoutTransitionData::AnimatorKey::PROPERTY ] = Actor::Property::SIZE;
+ map[ LayoutTransitionData::AnimatorKey::ANIMATOR ] = Property::Map()
+ .Add( LayoutTransitionData::AnimatorKey::ALPHA_FUNCTION, AlphaFunction::EASE_OUT )
+ .Add( LayoutTransitionData::AnimatorKey::TIME_PERIOD, Property::Map()
+ .Add( LayoutTransitionData::AnimatorKey::DELAY, 0.0f )
+ .Add( LayoutTransitionData::AnimatorKey::DURATION, 0.5f ) );
+ layoutTransitionData.AddPropertyAnimator( parent, map );
+ }
+
+ return layoutTransitionData;
+}
+
+bool OnImageTouchCallback( Actor actor, const TouchData& event )
+{
+ KeyInputFocusManager manager = KeyInputFocusManager::Get();
+ manager.SetFocus( Control::DownCast( actor ) );
+ return true;
+}
+
+void CreateChildAndAdd( Demo::AnimationExample& animationExample, Control& container )
+{
+ Toolkit::ImageView imageView;
+ CreateChild( imageView, container.GetChildCount(), Size( 100.0f, 100.0f ) );
+ imageView.TouchSignal().Connect( &animationExample, &OnImageTouchCallback );
container.Add( imageView );
- images.push_back( imageView );
+
+ DevelControl::GetLayout( imageView ).SetTransitionData( Toolkit::LayoutTransitionData::ON_LAYOUT_CHANGE, CreateCustomDefaultTransition( imageView ) );
}
} // namespace
mHorizontalLayout.SetOrientation( LinearLayout::Orientation::HORIZONTAL );
mHorizontalLayout.SetAlignment( LinearLayout::Alignment::CENTER_HORIZONTAL | LinearLayout::Alignment::CENTER_VERTICAL );
mHorizontalLayout.SetAnimateLayout(true);
+ mHorizontalLayout.SetTransitionData( LayoutTransitionData::ON_CHILD_FOCUS, CreateOnChildFocusTransition( mAnimationContainer ) );
+ mHorizontalLayout.SetTransitionData( LayoutTransitionData::ON_CHILD_REMOVE, CreateOnChildRemoveTransition( mAnimationContainer ) );
+ mHorizontalLayout.SetTransitionData( LayoutTransitionData::ON_CHILD_ADD, CreateOnChildAddTransition( mAnimationContainer ) );
+
DevelControl::SetLayout( mAnimationContainer, mHorizontalLayout );
mGridLayout = Grid::New();
mGridLayout.SetAnimateLayout(true);
mGridLayout.SetNumberOfColumns(2);
+ mGridLayout.SetTransitionData( LayoutTransitionData::ON_CHILD_FOCUS, CreateOnChildFocusTransition( mAnimationContainer ) );
+ mGridLayout.SetTransitionData( LayoutTransitionData::ON_CHILD_REMOVE, CreateOnChildRemoveTransition( mAnimationContainer ) );
+ mGridLayout.SetTransitionData( LayoutTransitionData::ON_CHILD_ADD, CreateOnChildAddTransition( mAnimationContainer ) );
- CreateChildImageViewAndAdd( mAnimationContainer, 0, mImages );
+ CreateChildAndAdd( *this, mAnimationContainer );
stage.Add( mAnimationContainer );
}
-// Remove controls added by this example from stage
+// Remove controls added by this example from stage mGridLayout.SetTransitionData( LayoutTransitionData::ON_CHILD_FOCUS, CreateOnChildFocusTransition( mAnimationContainer ) );
+
void AnimationExample::Remove()
{
if ( mAnimationContainer )
UnparentAndReset( mSelectGridButton );
UnparentAndReset( mShakeButton );
UnparentAndReset( mAnimationContainer);
- mImages.clear();
}
}
{
DALI_LOG_INFO( gLayoutFilter, Debug::Verbose, "AnimationExample::OnRemoveClicked\n");
- if (mImages.size() > 1)
+ if ( mAnimationContainer.GetChildCount() > 1 )
{
- auto layout = DevelControl::GetLayout( mAnimationContainer );
- layout.SetTransitionData(LayoutTransitionData::ON_CHILD_REMOVE, CreateOnChildRemoveTransition( mImages ) );
-
- ImageView imageView = mImages.back();
- mAnimationContainer.Remove( imageView );
- mImages.pop_back();
+ mAnimationContainer.Remove( mAnimationContainer.GetChildAt( mAnimationContainer.GetChildCount() - 1 ) );
}
return true;
}
if ( !mGridSet )
{
- mGridLayout.SetTransitionData( LayoutTransitionData::ON_OWNER_SET, CreateOnSetLayoutTransition( mAnimationContainer, mImages ) );
+ mGridLayout.SetTransitionData( LayoutTransitionData::ON_OWNER_SET, CreateOnSetLayoutTransition( mAnimationContainer ) );
DevelControl::SetLayout( mAnimationContainer, mGridLayout );
}
else
{
- mHorizontalLayout.SetTransitionData( LayoutTransitionData::ON_OWNER_SET, CreateOnSetLayoutTransition( mAnimationContainer, mImages ) );
+ mHorizontalLayout.SetTransitionData( LayoutTransitionData::ON_OWNER_SET, CreateOnSetLayoutTransition( mAnimationContainer ) );
DevelControl::SetLayout( mAnimationContainer, mHorizontalLayout );
}
bool AnimationExample::OnAddClicked( Button button )
{
- if (mImages.size() < 4)
+ if( mAnimationContainer.GetChildCount() < 4 )
{
- CreateChildImageViewAndAdd( mAnimationContainer, mImages.size(), mImages );
+ CreateChildAndAdd( *this, mAnimationContainer );
}
return true;
}