From: Xiangyin Ma Date: Tue, 13 Dec 2016 18:09:30 +0000 (+0000) Subject: Added Animated Gif example X-Git-Tag: dali_1.2.20~3^2 X-Git-Url: http://review.tizen.org/git/?p=platform%2Fcore%2Fuifw%2Fdali-demo.git;a=commitdiff_plain;h=bec7666cee2534e16bf080b9b94ed0ccc9a5f6a5 Added Animated Gif example Change-Id: I609238663f1ecd1d7925d5388f25e43c7094a294 --- diff --git a/com.samsung.dali-demo.xml b/com.samsung.dali-demo.xml index bf0b01c..7fe738b 100644 --- a/com.samsung.dali-demo.xml +++ b/com.samsung.dali-demo.xml @@ -178,4 +178,7 @@ + + + diff --git a/demo/dali-demo.cpp b/demo/dali-demo.cpp index d3bde9f..bbf9b02 100644 --- a/demo/dali-demo.cpp +++ b/demo/dali-demo.cpp @@ -36,6 +36,7 @@ int DALI_EXPORT_API main(int argc, char **argv) // Create the demo launcher DaliTableView demo(app); + demo.AddExample(Example("animated-images.example", DALI_DEMO_STR_TITLE_ANIMATED_IMAGES)); demo.AddExample(Example("animated-shapes.example", DALI_DEMO_STR_TITLE_ANIMATED_SHAPES)); demo.AddExample(Example("bubble-effect.example", DALI_DEMO_STR_TITLE_BUBBLES)); demo.AddExample(Example("blocks.example", DALI_DEMO_STR_TITLE_BLOCKS)); diff --git a/examples/animated-images/animated-images-example.cpp b/examples/animated-images/animated-images-example.cpp new file mode 100644 index 0000000..b9ec308 --- /dev/null +++ b/examples/animated-images/animated-images-example.cpp @@ -0,0 +1,162 @@ +/* + * 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. + * + */ + +#include + +#include "shared/utility.h" + +using namespace Dali; +using namespace Dali::Toolkit; + +namespace +{ +const char * const PLAY_ICON( DEMO_IMAGE_DIR "icon-play.png" ); +const char * const PLAY_ICON_SELECTED( DEMO_IMAGE_DIR "icon-play-selected.png" ); + +const char* const STATIC_GIF_DOG( DEMO_IMAGE_DIR "dog-static.gif" ); +const char* const ANIMATE_GIF_DOG( DEMO_IMAGE_DIR "dog-anim.gif" ); + +const char* const STATIC_GIF_LOGO( DEMO_IMAGE_DIR "dali-logo-static.gif" ); +const char* const ANIMATE_GIF_LOGO( DEMO_IMAGE_DIR "dali-logo-anim.gif" ); + +const Vector4 DIM_COLOR( 0.85f, 0.85f, 0.85f, 0.85f ); +} + +/* This example shows how to display a GIF image. + * First a static GIF image is loaded and then when the user presses on the "Play" icon, + * the static image is replaced by an animated one + */ + +class AnimatedImageController : public ConnectionTracker +{ +public: + + AnimatedImageController( Application& application ) + : mApplication( application ) + { + // Connect to the Application's Init signal + mApplication.InitSignal().Connect( this, &AnimatedImageController::Create ); + } + + ~AnimatedImageController() + { + // Nothing to do here; + } + + // The Init signal is received once (only) during the Application lifetime + void Create( Application& application ) + { + // Get a handle to the stage + Stage stage = Stage::GetCurrent(); + stage.SetBackgroundColor( Color::WHITE ); + // Tie-in input event handlers: + stage.KeyEventSignal().Connect( this, &AnimatedImageController::OnKeyEvent ); + + mActorDog = CreateGifViewWithOverlayButton( STATIC_GIF_DOG ); + mActorDog.SetAnchorPoint( AnchorPoint::BOTTOM_CENTER ); + mActorDog.SetY( -100.f ); + stage.Add( mActorDog ); + + mActorLogo = CreateGifViewWithOverlayButton( STATIC_GIF_LOGO ); + mActorLogo.SetAnchorPoint( AnchorPoint::TOP_CENTER ); + mActorLogo.SetY( 100.f ); + stage.Add( mActorLogo ); + } + + /** + * Create the gif image view with an overlay play button. + */ + Toolkit::ImageView CreateGifViewWithOverlayButton( const std::string& gifUrl ) + { + Toolkit::ImageView imageView = Toolkit::ImageView::New( gifUrl ); + imageView.SetParentOrigin( ParentOrigin::CENTER ); + + // Create a push button, and add it as child of the image view + Toolkit::PushButton animateButton = Toolkit::PushButton::New(); + animateButton.SetUnselectedImage( PLAY_ICON ); + animateButton.SetSelectedImage( PLAY_ICON_SELECTED ); + animateButton.SetParentOrigin( ParentOrigin::CENTER ); + animateButton.SetAnchorPoint( AnchorPoint::CENTER ); + animateButton.ClickedSignal().Connect( this, &AnimatedImageController::OnPlayButtonClicked ); + imageView.Add( animateButton ); + + // Apply dim color on the gif view and the play button + imageView.SetColor( DIM_COLOR ); + + return imageView; + } + + bool OnPlayButtonClicked( Toolkit::Button button ) + { + Stage stage = Stage::GetCurrent(); + + // With play button clicked, the static gif is replaced with animated gif. + if( button.GetParent() == mActorDog ) + { + // remove the static gif view, the play button is also removed as its child. + stage.Remove( mActorDog ); + + mActorDog = Toolkit::ImageView::New( ANIMATE_GIF_DOG ); + mActorDog.SetParentOrigin( ParentOrigin::CENTER ); + mActorDog.SetAnchorPoint( AnchorPoint::BOTTOM_CENTER ); + mActorDog.SetY( -100.f ); + stage.Add( mActorDog ); + } + else // button.GetParent() == mActorLogo + { + // remove the static gif view, the play button is also removed as its child. + stage.Remove( mActorLogo ); + + mActorLogo = Toolkit::ImageView::New( ANIMATE_GIF_LOGO ); + mActorLogo.SetParentOrigin( ParentOrigin::CENTER ); + mActorLogo.SetAnchorPoint( AnchorPoint::TOP_CENTER ); + mActorLogo.SetY( 100.f ); + stage.Add( mActorLogo ); + } + return true; + } + + + 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: + Application& mApplication; + Toolkit::ImageView mActorDog; + Toolkit::ImageView mActorLogo; +}; + +// Entry point for Linux & Tizen applications +// +int DALI_EXPORT_API main( int argc, char **argv ) +{ + Application application = Application::New( &argc, &argv ); + + AnimatedImageController test( application ); + + application.MainLoop(); + + return 0; +} diff --git a/resources/images/dali-logo-anim.gif b/resources/images/dali-logo-anim.gif new file mode 100644 index 0000000..9a085ba Binary files /dev/null and b/resources/images/dali-logo-anim.gif differ diff --git a/resources/images/dali-logo-static.gif b/resources/images/dali-logo-static.gif new file mode 100644 index 0000000..5f032ed Binary files /dev/null and b/resources/images/dali-logo-static.gif differ diff --git a/resources/images/dog-anim.gif b/resources/images/dog-anim.gif new file mode 100644 index 0000000..ddc3312 Binary files /dev/null and b/resources/images/dog-anim.gif differ diff --git a/resources/images/dog-static.gif b/resources/images/dog-static.gif new file mode 100644 index 0000000..8fc537e Binary files /dev/null and b/resources/images/dog-static.gif differ diff --git a/resources/po/as.po b/resources/po/as.po index 4cb3c4b..7d01811 100755 --- a/resources/po/as.po +++ b/resources/po/as.po @@ -1,3 +1,6 @@ +msgid "DALI_DEMO_STR_TITLE_ANIMATED_IMAGES" +msgstr "অ্যানিমেটেড ইমেজ" + msgid "DALI_DEMO_STR_TITLE_ANIMATED_SHAPES" msgstr "অ্যানিমেটেড আকার" diff --git a/resources/po/de.po b/resources/po/de.po index b0d0821..a3af75f 100755 --- a/resources/po/de.po +++ b/resources/po/de.po @@ -1,3 +1,6 @@ +msgid "DALI_DEMO_STR_TITLE_ANIMATED_IMAGES" +msgstr "Animierte Bilder" + msgid "DALI_DEMO_STR_TITLE_ANIMATED_SHAPES" msgstr "Animierte Formen" diff --git a/resources/po/en_GB.po b/resources/po/en_GB.po index ce12daa..bee7ff6 100755 --- a/resources/po/en_GB.po +++ b/resources/po/en_GB.po @@ -1,3 +1,6 @@ +msgid "DALI_DEMO_STR_TITLE_ANIMATED_IMAGES" +msgstr "Animated Images" + msgid "DALI_DEMO_STR_TITLE_ANIMATED_SHAPES" msgstr "Animated Shapes" diff --git a/resources/po/en_US.po b/resources/po/en_US.po index 19ca05c..c853a3e 100755 --- a/resources/po/en_US.po +++ b/resources/po/en_US.po @@ -1,3 +1,6 @@ +msgid "DALI_DEMO_STR_TITLE_ANIMATED_IMAGES" +msgstr "Animated Images" + msgid "DALI_DEMO_STR_TITLE_ANIMATED_SHAPES" msgstr "Animated Shapes" diff --git a/resources/po/es.po b/resources/po/es.po index 42ff232..2acd762 100755 --- a/resources/po/es.po +++ b/resources/po/es.po @@ -1,3 +1,6 @@ +msgid "DALI_DEMO_STR_TITLE_ANIMATED_IMAGES" +msgstr "Imágenes animadas" + msgid "DALI_DEMO_STR_TITLE_ANIMATED_SHAPES" msgstr "Formas Animadas" diff --git a/resources/po/fi.po b/resources/po/fi.po index d27983b..180e491 100755 --- a/resources/po/fi.po +++ b/resources/po/fi.po @@ -1,3 +1,6 @@ +msgid "DALI_DEMO_STR_TITLE_ANIMATED_IMAGES" +msgstr "animoituja kuvia" + msgid "DALI_DEMO_STR_TITLE_ANIMATED_SHAPES" msgstr "Animoidut Muodot" diff --git a/resources/po/ko.po b/resources/po/ko.po index 6b21dc0..5c283e0 100755 --- a/resources/po/ko.po +++ b/resources/po/ko.po @@ -1,3 +1,7 @@ +msgid "DALI_DEMO_STR_TITLE_ANIMATED_IMAGES" +msgstr "애니메이션 이미지" + + msgid "DALI_DEMO_STR_TITLE_ANIMATED_SHAPES" msgstr "애니메이션 모양" diff --git a/resources/po/ml.po b/resources/po/ml.po index 1785e01..cbb9222 100755 --- a/resources/po/ml.po +++ b/resources/po/ml.po @@ -1,3 +1,6 @@ +msgid "DALI_DEMO_STR_TITLE_ANIMATED_IMAGES" +msgstr "അനിമേറ്റഡ് ചിത്രങ്ങൾ" + msgid "DALI_DEMO_STR_TITLE_ANIMATED_SHAPES" msgstr "ആനിമേഷൻ രൂപങ്ങൾ" diff --git a/resources/po/ur.po b/resources/po/ur.po index 4f4299e..4e67d88 100755 --- a/resources/po/ur.po +++ b/resources/po/ur.po @@ -1,3 +1,6 @@ +msgid "DALI_DEMO_STR_TITLE_ANIMATED_IMAGES" +msgstr "متحرک تصاویر" + msgid "DALI_DEMO_STR_TITLE_ANIMATED_SHAPES" msgstr "متحرک شکلیں" diff --git a/resources/po/zn_CH.po b/resources/po/zn_CH.po index 2cc1113..181a996 100755 --- a/resources/po/zn_CH.po +++ b/resources/po/zn_CH.po @@ -1,3 +1,6 @@ +msgid "DALI_DEMO_STR_TITLE_ANIMATED_IMAGES" +msgstr "动态图" + msgid "DALI_DEMO_STR_TITLE_ANIMATED_SHAPES" msgstr "动画造型" diff --git a/shared/dali-demo-strings.h b/shared/dali-demo-strings.h index 5370c17..9a35939 100644 --- a/shared/dali-demo-strings.h +++ b/shared/dali-demo-strings.h @@ -32,6 +32,7 @@ extern "C" #ifdef INTERNATIONALIZATION_ENABLED +#define DALI_DEMO_STR_TITLE_ANIMATED_IMAGES dgettext(DALI_DEMO_DOMAIN_LOCAL, "DALI_DEMO_STR_TITLE_ANIMATED_IMAGES") #define DALI_DEMO_STR_TITLE_ANIMATED_SHAPES dgettext(DALI_DEMO_DOMAIN_LOCAL, "DALI_DEMO_STR_TITLE_ANIMATED_SHAPES") #define DALI_DEMO_STR_TITLE_BLOCKS dgettext(DALI_DEMO_DOMAIN_LOCAL, "DALI_DEMO_STR_TITLE_BLOCKS") #define DALI_DEMO_STR_TITLE_BUBBLES dgettext(DALI_DEMO_DOMAIN_LOCAL, "DALI_DEMO_STR_TITLE_BUBBLES") @@ -86,6 +87,7 @@ extern "C" #else // !INTERNATIONALIZATION_ENABLED +#define DALI_DEMO_STR_TITLE_ANIMATED_IMAGES "Animated Images" #define DALI_DEMO_STR_TITLE_ANIMATED_SHAPES "Animated Shapes" #define DALI_DEMO_STR_TITLE_BLOCKS "Blocks" #define DALI_DEMO_STR_TITLE_BUBBLES "Bubbles"