Add AnimatedVectorImageVisualRive example

Change-Id: I326a43cfaeb670507e4e8c4573975cfbdcd3c48a

Add AnimatedVectorImageVisualRive example
Change-Id: I326a43cfaeb670507e4e8c4573975cfbdcd3c48a
Taehyub Kim
1 parent 14041a85
Showing 8 changed files with 238 additions and 0 deletions
build/tizen/CMakeLists.txt
examples-reel/dali-examples-reel.cpp
examples/animated-vector-images-rive/animated-vector-images-rive-example.cpp
resources/images/juice.riv
resources/po/en_GB.po
resources/po/en_US.po
resources/po/ko.po
shared/dali-demo-strings.h
@@ -154,6 +154,7 @@ INSTALL_TREE_FILES(${LOCAL_IMAGES_DIR} &quot;${LOCAL_IMAGES_TREE}&quot; &quot;*.ktx&quot; ${IMAGES_D
 INSTALL_TREE_FILES(${LOCAL_IMAGES_DIR} "${LOCAL_IMAGES_TREE}" "*.astc" ${IMAGES_DIR})
 INSTALL_TREE_FILES(${LOCAL_IMAGES_DIR} "${LOCAL_IMAGES_TREE}" "*.svg" ${IMAGES_DIR})
 INSTALL_TREE_FILES(${LOCAL_IMAGES_DIR} "${LOCAL_IMAGES_TREE}" "*.json" ${IMAGES_DIR})
+INSTALL_TREE_FILES(${LOCAL_IMAGES_DIR} "${LOCAL_IMAGES_TREE}" "*.riv" ${IMAGES_DIR})
 FILE(GLOB LOCAL_VIDEOS_LIST RELATIVE "${LOCAL_VIDEOS_DIR}" "${LOCAL_VIDEOS_DIR}/*")
 FOREACH(flag ${LOCAL_VIDEOS_LIST})
@@ -41,6 +41,7 @@ int DALI_EXPORT_API main(int argc, char** argv)
   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("animated-vector-images.example", DALI_DEMO_STR_TITLE_ANIMATED_VECTOR_IMAGES));
+  demo.AddExample(Example("animated-vector-images-rive.example", DALI_DEMO_STR_TITLE_ANIMATED_VECTOR_IMAGES_RIVE));
   demo.AddExample(Example("arc-visual.example", DALI_DEMO_STR_TITLE_ARC_VISUAL));
   demo.AddExample(Example("bloom-view.example", DALI_DEMO_STR_TITLE_BLOOM_VIEW));
   demo.AddExample(Example("builder.example", DALI_DEMO_STR_TITLE_SCRIPT_BASED_UI));
+/*
+ * Copyright (c) 2021 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 <dali-toolkit/dali-toolkit.h>
+#include <dali-toolkit/devel-api/controls/control-devel.h>
+#include <dali-toolkit/devel-api/controls/table-view/table-view.h>
+#include <dali-toolkit/devel-api/visuals/animated-vector-image-visual-actions-devel.h>
+#include <dali-toolkit/devel-api/visuals/animated-vector-image-visual-signals-devel.h>
+#include <dali-toolkit/devel-api/visuals/image-visual-properties-devel.h>
+#include <dali/dali.h>
+#include <string>
+#include "shared/view.h"
+
+using namespace Dali;
+using namespace Dali::Toolkit;
+
+namespace
+{
+const char* BACKGROUND_IMAGE(DEMO_IMAGE_DIR "background-gradient.jpg");
+const char* TOOLBAR_IMAGE(DEMO_IMAGE_DIR "top-bar.png");
+const char* APPLICATION_TITLE("Animated Vector Images Rive");
+
+const char* IMAGE_PATH[] = {
+  DEMO_IMAGE_DIR "juice.riv",
+  };
+
+const unsigned int NUMBER_OF_IMAGES = 1;
+
+enum CellPlacement
+{
+  TOP_BUTTON,
+  LOWER_BUTTON,
+  IMAGE,
+  NUMBER_OF_ROWS
+};
+
+unsigned int GetControlIndex(Control control)
+{
+  std::string  controlName = control.GetProperty<std::string>(Dali::Actor::Property::NAME);
+  unsigned int index       = 0;
+
+  if(controlName != "")
+  {
+    index = std::stoul(controlName);
+  }
+
+  return index;
+}
+
+} // namespace
+
+// This example shows the usage of AnimatedVectorImageVisual(Rive).
+// It doesn't work on Ubuntu because the visual uses the external library to render frames.
+class AnimatedVectorImageViewController : public ConnectionTracker
+{
+public:
+  AnimatedVectorImageViewController(Application& application)
+  : mApplication(application)
+  {
+    // Connect to the Application's Init signal
+    mApplication.InitSignal().Connect(this, &AnimatedVectorImageViewController::Create);
+  }
+
+  void Create(Application& application)
+  {
+    // The Init signal is received once (only) during the Application lifetime
+
+    // Creates a default view with a default tool bar.
+    // The view is added to the window.
+    mContentLayer = DemoHelper::CreateView(application,
+                                           mView,
+                                           mToolBar,
+                                           BACKGROUND_IMAGE,
+                                           TOOLBAR_IMAGE,
+                                           APPLICATION_TITLE);
+
+    // Create a table view to show a pair of buttons above each image.
+    mTable = TableView::New(CellPlacement::NUMBER_OF_ROWS, NUMBER_OF_IMAGES);
+    mTable.SetProperty(Actor::Property::ANCHOR_POINT, AnchorPoint::CENTER);
+    mTable.SetProperty(Actor::Property::PARENT_ORIGIN, ParentOrigin::CENTER);
+    mTable.SetResizePolicy(ResizePolicy::SIZE_RELATIVE_TO_PARENT, Dimension::ALL_DIMENSIONS);
+    Vector3 offset(0.9f, 0.70f, 0.0f);
+    mTable.SetProperty(Actor::Property::SIZE_MODE_FACTOR, offset);
+    mTable.SetFitHeight(CellPlacement::TOP_BUTTON);
+    mTable.SetFitHeight(CellPlacement::LOWER_BUTTON);
+    mContentLayer.Add(mTable);
+
+    for(unsigned int x = 0; x < NUMBER_OF_IMAGES; x++)
+    {
+      mPlayButtons[x] = PushButton::New();
+      mPlayButtons[x].SetProperty(Button::Property::LABEL, "Play");
+      mPlayButtons[x].SetProperty(Actor::Property::PARENT_ORIGIN, ParentOrigin::TOP_CENTER);
+      mPlayButtons[x].SetProperty(Actor::Property::ANCHOR_POINT, AnchorPoint::TOP_CENTER);
+      mPlayButtons[x].ClickedSignal().Connect(this, &AnimatedVectorImageViewController::OnPlayButtonClicked);
+      mPlayButtons[x].SetResizePolicy(ResizePolicy::FILL_TO_PARENT, Dimension::WIDTH);
+      mPlayButtons[x].SetResizePolicy(ResizePolicy::USE_NATURAL_SIZE, Dimension::HEIGHT);
+      std::string s = std::to_string(x);
+      mPlayButtons[x].SetProperty(Dali::Actor::Property::NAME, s);
+      mTable.AddChild(mPlayButtons[x], TableView::CellPosition(CellPlacement::TOP_BUTTON, x));
+
+      mStopButtons[x] = PushButton::New();
+      mStopButtons[x].SetProperty(Button::Property::LABEL, "Stop");
+      mStopButtons[x].SetProperty(Actor::Property::PARENT_ORIGIN, ParentOrigin::BOTTOM_CENTER);
+      mStopButtons[x].SetProperty(Actor::Property::ANCHOR_POINT, AnchorPoint::BOTTOM_CENTER);
+      mStopButtons[x].ClickedSignal().Connect(this, &AnimatedVectorImageViewController::OnStopButtonClicked);
+      mStopButtons[x].SetResizePolicy(ResizePolicy::FILL_TO_PARENT, Dimension::WIDTH);
+      mStopButtons[x].SetResizePolicy(ResizePolicy::USE_NATURAL_SIZE, Dimension::HEIGHT);
+      mStopButtons[x].SetProperty(Dali::Actor::Property::NAME, s);
+      mTable.AddChild(mStopButtons[x], TableView::CellPosition(CellPlacement::LOWER_BUTTON, x));
+
+      mImageViews[x] = ImageView::New();
+      Property::Map imagePropertyMap;
+      imagePropertyMap.Insert(Visual::Property::TYPE, Visual::IMAGE);
+      imagePropertyMap.Insert(ImageVisual::Property::URL, IMAGE_PATH[x]);
+      imagePropertyMap.Insert(DevelImageVisual::Property::LOOP_COUNT, 3);
+      mImageViews[x].SetProperty(ImageView::Property::IMAGE, imagePropertyMap);
+
+      mImageViews[x].SetProperty(Actor::Property::PARENT_ORIGIN, ParentOrigin::CENTER);
+      mImageViews[x].SetProperty(Actor::Property::ANCHOR_POINT, AnchorPoint::CENTER);
+      mImageViews[x].SetResizePolicy(ResizePolicy::FILL_TO_PARENT, Dimension::ALL_DIMENSIONS);
+      mImageViews[x].SetProperty(Dali::Actor::Property::NAME, s);
+
+      DevelControl::VisualEventSignal(mImageViews[x]).Connect(this, &AnimatedVectorImageViewController::OnVisualEvent);
+
+      mTable.AddChild(mImageViews[x], TableView::CellPosition(CellPlacement::IMAGE, x));
+    }
+
+    application.GetWindow().KeyEventSignal().Connect(this, &AnimatedVectorImageViewController::OnKeyEvent);
+  }
+
+private:
+  bool OnPlayButtonClicked(Button button)
+  {
+    unsigned int controlIndex = GetControlIndex(button);
+
+    ImageView imageView = mImageViews[controlIndex];
+
+    Property::Map    map   = imageView.GetProperty<Property::Map>(ImageView::Property::IMAGE);
+    Property::Value* value = map.Find(DevelImageVisual::Property::PLAY_STATE);
+
+    if(value)
+    {
+      if(value->Get<int>() != static_cast<int>(DevelImageVisual::PlayState::PLAYING))
+      {
+        mPlayButtons[controlIndex].SetProperty(Button::Property::LABEL, "Pause");
+
+        DevelControl::DoAction(imageView, ImageView::Property::IMAGE, DevelAnimatedVectorImageVisual::Action::PLAY, Property::Value());
+      }
+      else
+      {
+        mPlayButtons[controlIndex].SetProperty(Button::Property::LABEL, "Play");
+
+        DevelControl::DoAction(imageView, ImageView::Property::IMAGE, DevelAnimatedVectorImageVisual::Action::PAUSE, Property::Value());
+      }
+    }
+
+    return true;
+  }
+
+  bool OnStopButtonClicked(Button button)
+  {
+    unsigned int controlIndex = GetControlIndex(button);
+    ImageView    imageView    = mImageViews[controlIndex];
+    DevelControl::DoAction(imageView, ImageView::Property::IMAGE, DevelAnimatedVectorImageVisual::Action::STOP, Property::Value());
+
+    return true;
+  }
+
+  void OnVisualEvent(Control control, Dali::Property::Index visualIndex, Dali::Property::Index signalId)
+  {
+    unsigned int controlIndex = GetControlIndex(control);
+
+    if(visualIndex == ImageView::Property::IMAGE && signalId == DevelAnimatedVectorImageVisual::Signal::ANIMATION_FINISHED)
+    {
+      mPlayButtons[controlIndex].SetProperty(Button::Property::LABEL, "Play");
+    }
+  }
+
+  /**
+   * Main key event handler
+   */
+  void OnKeyEvent(const KeyEvent& event)
+  {
+    if(event.GetState() == KeyEvent::DOWN)
+    {
+      if(IsKey(event, DALI_KEY_ESCAPE) || IsKey(event, DALI_KEY_BACK))
+      {
+        mApplication.Quit();
+      }
+    }
+  }
+
+private:
+  Application& mApplication;
+
+  Control    mView;         ///< The View instance.
+  ToolBar    mToolBar;      ///< The View's Toolbar.
+  Layer      mContentLayer; ///< Content layer
+  TableView  mTable;
+  ImageView  mImageViews[NUMBER_OF_IMAGES];
+  PushButton mPlayButtons[NUMBER_OF_IMAGES];
+  PushButton mStopButtons[NUMBER_OF_IMAGES];
+};
+
+int DALI_EXPORT_API main(int argc, char** argv)
+{
+  Application                       application = Application::New(&argc, &argv, DEMO_THEME_PATH);
+  AnimatedVectorImageViewController test(application);
+  application.MainLoop();
+  return 0;
+}
@@ -294,3 +294,6 @@ msgstr &quot;Web View&quot;
 msgid "DALI_DEMO_STR_TITLE_ANIMATED_VECTOR_IMAGES"
 msgstr "Animated Vector Images"
+
+msgid "DALI_DEMO_STR_TITLE_ANIMATED_VECTOR_IMAGES_RIVE"
+msgstr "Animated Vector Images Rive"
@@ -295,6 +295,9 @@ msgstr &quot;Web View&quot;
 msgid "DALI_DEMO_STR_TITLE_ANIMATED_VECTOR_IMAGES"
 msgstr "Animated Vector Images"
+msgid "DALI_DEMO_STR_TITLE_ANIMATED_VECTOR_IMAGES_RIVE"
+msgstr "Animated Vector Images Rive"
+
 msgid "DALI_DEMO_STR_TITLE_TEXT_RENDERER"
 msgstr "Text Renderer"
@@ -192,3 +192,6 @@ msgstr &quot;PBR&quot;
 msgid "DALI_DEMO_STR_TITLE_ANIMATED_VECTOR_IMAGES"
 msgstr "애니메이션 벡터 이미지"
+
+msgid "DALI_DEMO_STR_TITLE_ANIMATED_VECTOR_IMAGES_RIVE"
+msgstr "애니메이션 벡터 이미지 라이브"
@@ -37,6 +37,7 @@ extern &quot;C&quot;
 #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_ANIMATED_VECTOR_IMAGES dgettext(DALI_DEMO_DOMAIN_LOCAL, "DALI_DEMO_STR_TITLE_ANIMATED_VECTOR_IMAGES")
+#define DALI_DEMO_STR_TITLE_ANIMATED_VECTOR_IMAGES_RIVE dgettext(DALI_DEMO_DOMAIN_LOCAL, "DALI_DEMO_STR_TITLE_ANIMATED_VECTOR_IMAGES_RIVE")
 #define DALI_DEMO_STR_TITLE_ARC_VISUAL dgettext(DALI_DEMO_DOMAIN_LOCAL, "DALI_DEMO_STR_TITLE_ARC_VISUAL")
 #define DALI_DEMO_STR_TITLE_BASIC_LIGHT dgettext(DALI_DEMO_DOMAIN_LOCAL, "DALI_DEMO_STR_TITLE_BASIC_LIGHT")
 #define DALI_DEMO_STR_TITLE_BENCHMARK dgettext(DALI_DEMO_DOMAIN_LOCAL, "DALI_DEMO_STR_TITLE_BENCHMARK")
@@ -142,6 +143,7 @@ extern &quot;C&quot;
 #define DALI_DEMO_STR_TITLE_ANIMATED_IMAGES "Animated Images"
 #define DALI_DEMO_STR_TITLE_ANIMATED_SHAPES "Animated Shapes"
 #define DALI_DEMO_STR_TITLE_ANIMATED_VECTOR_IMAGES "Animated Vector Images"
+#define DALI_DEMO_STR_TITLE_ANIMATED_VECTOR_IMAGES_RIVE "Animated Vector Images Rive"
 #define DALI_DEMO_STR_TITLE_ARC_VISUAL "Arc Visual"
 #define DALI_DEMO_STR_TITLE_BASIC_LIGHT "Basic Light"
 #define DALI_DEMO_STR_TITLE_BENCHMARK "ImageView Benchmark"