examples/canvas-view/canvas-view-example.cpp

   1 /*
   2  * Copyright (c) 2021 Samsung Electronics Co., Ltd.
   3  *
   4  * Licensed under the Apache License, Version 2.0 (the "License");
   5  * you may not use this file except in compliance with the License.
   6  * You may obtain a copy of the License at
   7  *
   8  * http://www.apache.org/licenses/LICENSE-2.0
   9  *
  10  * Unless required by applicable law or agreed to in writing, software
  11  * distributed under the License is distributed on an "AS IS" BASIS,
  12  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  13  * See the License for the specific language governing permissions and
  14  * limitations under the License.
  15  *
  16  */
  17
  18 #include <dali-toolkit/dali-toolkit.h>
  19 #include <dali-toolkit/devel-api/controls/canvas-view/canvas-view.h>
  20 #include <dali/devel-api/adaptor-framework/canvas-renderer-drawable-group.h>
  21 #include <dali/devel-api/adaptor-framework/canvas-renderer-gradient.h>
  22 #include <dali/devel-api/adaptor-framework/canvas-renderer-linear-gradient.h>
  23 #include <dali/devel-api/adaptor-framework/canvas-renderer-picture.h>
  24 #include <dali/devel-api/adaptor-framework/canvas-renderer-radial-gradient.h>
  25 #include <dali/devel-api/adaptor-framework/canvas-renderer-shape.h>
  26
  27 using namespace Dali;
  28
  29 namespace
  30 {
  31 const char* VIEW_LABEL[] = {
  32   "BasicShapes",
  33   "ClipPath/Mask",
  34   "Gradient",
  35   "Picture"};
  36
  37 enum
  38 {
  39   BASIC_SHAPE_VIEW = 0,
  40   CLIP_PATH_VIEW,
  41   GRADIENT_VIEW,
  42   PICTURE_VIEW,
  43   NUMBER_OF_VIEWS
  44 };
  45
  46 const char* PREV_BUTTON_TEXT("Prev");
  47 const char* LEFT_BUTTON_TEXT("Next");
  48
  49 const char* IMAGES[] =
  50   {
  51     DEMO_IMAGE_DIR "Kid1.svg",
  52 };
  53
  54 const float COMMON_STROKE_DASH_PATTERN[] = {15.0f, 30.0f};
  55
  56 /**
  57  * @brief Create shape that have star path.
  58  */
  59 Dali::CanvasRenderer::Shape MakeStarShape()
  60 {
  61   Dali::CanvasRenderer::Shape star = Dali::CanvasRenderer::Shape::New();
  62   star.AddMoveTo(Vector2(-1.0f, -165.0f));
  63   star.AddLineTo(Vector2(53.0f, -56.0f));
  64   star.AddLineTo(Vector2(174.0f, -39.0f));
  65   star.AddLineTo(Vector2(87.0f, 45.0f));
  66   star.AddLineTo(Vector2(107.0f, 166.0f));
  67   star.AddLineTo(Vector2(-1.0f, 110.0f));
  68   star.AddLineTo(Vector2(-103.0f, 166.0f));
  69   star.AddLineTo(Vector2(-88.0f, 46.0f));
  70   star.AddLineTo(Vector2(-174.0f, -38.0f));
  71   star.AddLineTo(Vector2(-54.0f, -56.0f));
  72   star.Close();
  73   return star;
  74 }
  75
  76 /**
  77  * @brief Create shape that have star path.
  78  */
  79 Dali::CanvasRenderer::Shape MakeStar2Shape()
  80 {
  81   Dali::CanvasRenderer::Shape star = Dali::CanvasRenderer::Shape::New();
  82   star.AddMoveTo(Vector2(535.0f, 135.0f));
  83   star.AddLineTo(Vector2(660.0f, 455.0f));
  84   star.AddLineTo(Vector2(355.0f, 250.0f));
  85   star.AddLineTo(Vector2(715.0f, 250.0f));
  86   star.AddLineTo(Vector2(410.0f, 455.0f));
  87   star.Close();
  88   return star;
  89 }
  90
  91 } // namespace
  92 /**
  93  * @brief This demonstrates how to display and control vector primitives using CanvasView.
  94  *
  95  * - It displays various types of shapes. Rectangle, circle, path, etc.
  96  * - Each shape can be set to fill color, stroke color, width, etc
  97  *   and can change the transfomation(rotate, scale, translate)
  98  */
  99 class CanvasViewController : public ConnectionTracker
 100 {
 101 public:
 102   /**
 103    * @brief Constructor.
 104    * @param[in]  application  A reference to the Application class
 105    */
 106   CanvasViewController(Application& application)
 107   : mApplication(application),
 108     mCanvasView(),
 109     mRoundedRect(),
 110     mArc(),
 111     mStar(),
 112     mTimer(),
 113     mCount(0),
 114     mViewCount(BASIC_SHAPE_VIEW),
 115     mLinearGradient()
 116   {
 117     // Connect to the Application's Init signal
 118     mApplication.InitSignal().Connect(this, &CanvasViewController::Create);
 119   }
 120
 121   ~CanvasViewController() = default;
 122
 123   /**
 124    * @brief Create a view for basic shape example.
 125    */
 126   void CreateBasicShape()
 127   {
 128     Window  window     = mApplication.GetWindow();
 129     Vector2 windowSize = window.GetSize();
 130
 131     mTitle.SetProperty(Dali::Toolkit::TextLabel::Property::TEXT, VIEW_LABEL[BASIC_SHAPE_VIEW]);
 132
 133     Dali::CanvasRenderer::Shape canvasBackground = Dali::CanvasRenderer::Shape::New();
 134     canvasBackground.AddRect(Rect<float>(0.0f, 0.0f, windowSize.width, windowSize.height), Vector2::ZERO);
 135     canvasBackground.SetFillColor(Color::WHITE);
 136     mCanvasView.AddDrawable(canvasBackground);
 137
 138     Dali::CanvasRenderer::Shape shape1 = Dali::CanvasRenderer::Shape::New();
 139     shape1.AddRect(Rect<float>(-50.0f, -50.0f, 100.0f, 100.0f), Vector2::ZERO);
 140     shape1.SetFillColor(Vector4(0.0f, 0.5f, 0.0f, 0.5f));
 141     shape1.SetStrokeColor(Vector4(0.5f, 0.0f, 0.0f, 0.5f));
 142     shape1.SetStrokeWidth(10.0f);
 143     shape1.Scale(1.2f);
 144     shape1.Rotate(Degree(45.0f));
 145     shape1.Translate(Vector2(100.0f, 200.0f));
 146
 147     mRoundedRect = Dali::CanvasRenderer::Shape::New();
 148     mRoundedRect.AddRect(Rect<float>(10.0f, 350.0f, 200.0f, 140.0f), Vector2(40.0f, 40.0f));
 149     mRoundedRect.SetFillColor(Color::BLUE);
 150     mRoundedRect.SetStrokeColor(Color::YELLOW);
 151     mRoundedRect.SetStrokeWidth(10.0f);
 152     mRoundedRect.SetStrokeJoin(Dali::CanvasRenderer::Shape::StrokeJoin::MITER);
 153     mRoundedRect.SetOpacity(0.5f);
 154     Dali::Vector<float> dashPattern;
 155     for(auto& pattern : COMMON_STROKE_DASH_PATTERN)
 156     {
 157       dashPattern.PushBack(pattern);
 158     }
 159     mRoundedRect.SetStrokeDash(dashPattern);
 160
 161     Dali::CanvasRenderer::Shape shape2 = MakeStar2Shape();
 162     shape2.SetFillColor(Color::RED);
 163     shape2.SetOpacity(0.5f);
 164     shape2.SetStrokeColor(Color::MAGENTA);
 165     shape2.SetStrokeWidth(10.0f);
 166     shape2.SetFillRule(Dali::CanvasRenderer::Shape::FillRule::EVEN_ODD);
 167     shape2.SetStrokeJoin(Dali::CanvasRenderer::Shape::StrokeJoin::ROUND);
 168     shape2.Transform(Matrix3(0.6f, 0.0f, 20.0f, 0.0f, 0.6f, 50.0f, 0.0f, 0.0f, 1.0f));
 169
 170     mArc = Dali::CanvasRenderer::Shape::New();
 171     mArc.AddArc(Vector2(100.0f, 650.0f), 80.0f, 10.0f, 0.0f, true);
 172     mArc.AddArc(Vector2(100.0f, 650.0f), 80.0f, 10.0f, 0.0f, true);
 173     mArc.SetOpacity(0.5f);
 174     mArc.SetStrokeColor(Color::LIME);
 175     mArc.SetStrokeWidth(10.0f);
 176     mArc.SetStrokeCap(Dali::CanvasRenderer::Shape::StrokeCap::ROUND);
 177     mCanvasView.AddDrawable(mArc);
 178
 179     mStar = MakeStarShape();
 180     mStar.SetFillColor(Color::CYAN);
 181     mStar.SetStrokeColor(Color::DARK_GRAY);
 182     mStar.SetStrokeWidth(30.0f);
 183     mStar.Scale(0.6f);
 184     mStar.Translate(Vector2(350.0f, 500.0f));
 185
 186     mCanvasView.AddDrawable(mStar);
 187
 188     mGroup1 = Dali::CanvasRenderer::DrawableGroup::New();
 189
 190     mGroup1.AddDrawable(mRoundedRect);
 191     mGroup1.AddDrawable(shape1);
 192
 193     mGroup2 = Dali::CanvasRenderer::DrawableGroup::New();
 194
 195     mGroup2.AddDrawable(mGroup1);
 196     mGroup2.AddDrawable(shape2);
 197
 198     mCanvasView.AddDrawable(mGroup2);
 199
 200     mTimer.Start();
 201
 202     window.Add(mCanvasView);
 203   }
 204
 205   /**
 206    * @brief Create a view for clip-path and mask example.
 207    */
 208   void CreateClipPathAndMask()
 209   {
 210     Window  window     = mApplication.GetWindow();
 211     Vector2 windowSize = window.GetSize();
 212
 213     mTitle.SetProperty(Dali::Toolkit::TextLabel::Property::TEXT, VIEW_LABEL[CLIP_PATH_VIEW]);
 214
 215     Dali::CanvasRenderer::Shape canvasBackground = Dali::CanvasRenderer::Shape::New();
 216     canvasBackground.AddRect(Rect<float>(0.0f, 0.0f, windowSize.width, windowSize.height), Vector2::ZERO);
 217     canvasBackground.SetFillColor(Color::WHITE);
 218     mCanvasView.AddDrawable(canvasBackground);
 219
 220     Dali::CanvasRenderer::Shape shape1 = Dali::CanvasRenderer::Shape::New();
 221     shape1.AddRect(Rect<float>(-50.0f, -50.0f, 100.0f, 100.0f), Vector2::ZERO);
 222     shape1.SetFillColor(Vector4(0.0f, 0.5f, 0.0f, 0.5f));
 223     shape1.SetStrokeColor(Vector4(0.5f, 0.0f, 0.0f, 0.5f));
 224     shape1.SetStrokeWidth(10.0f);
 225     shape1.Scale(1.2f);
 226     shape1.Rotate(Degree(45.0f));
 227     shape1.Translate(Vector2(100.0f, 200.0f));
 228
 229     Dali::CanvasRenderer::Shape shape2 = MakeStar2Shape();
 230     shape2.SetFillRule(Dali::CanvasRenderer::Shape::FillRule::EVEN_ODD);
 231     shape2.SetFillColor(Color::RED);
 232     shape2.SetOpacity(0.5f);
 233     shape2.SetStrokeColor(Color::MAGENTA);
 234     shape2.SetStrokeWidth(10.0f);
 235     shape2.SetStrokeJoin(Dali::CanvasRenderer::Shape::StrokeJoin::ROUND);
 236     shape2.Transform(Matrix3(0.6f, 0.0f, 20.0f, 0.0f, 0.6f, 50.0f, 0.0f, 0.0f, 1.0f));
 237
 238     mStar = MakeStarShape();
 239     mStar.Scale(0.6f);
 240     mStar.SetFillColor(Color::CYAN);
 241     mStar.Translate(Vector2(240.0f, 240.0f));
 242
 243     Dali::CanvasRenderer::DrawableGroup group1;
 244     group1 = Dali::CanvasRenderer::DrawableGroup::New();
 245     group1.AddDrawable(shape1);
 246     group1.AddDrawable(shape2);
 247     group1.SetClipPath(mStar);
 248     mCanvasView.AddDrawable(group1);
 249
 250     Dali::CanvasRenderer::Shape shape3 = Dali::CanvasRenderer::Shape::New();
 251     shape3.AddRect(Rect<float>(140.0f, 500.0f, 200.0f, 140.0f), Vector2(40.0f, 40.0f));
 252     shape3.SetFillColor(Color::BLUE);
 253     shape3.SetOpacity(0.5f);
 254     shape3.SetStrokeColor(Color::YELLOW);
 255     shape3.SetStrokeWidth(10.0f);
 256     shape3.SetStrokeJoin(Dali::CanvasRenderer::Shape::StrokeJoin::MITER);
 257     Dali::Vector<float> dashPattern;
 258     for(auto& pattern : COMMON_STROKE_DASH_PATTERN)
 259     {
 260       dashPattern.PushBack(pattern);
 261     }
 262     shape3.SetStrokeDash(dashPattern);
 263
 264     mArc = Dali::CanvasRenderer::Shape::New();
 265     mArc.AddArc(Vector2(240.0f, 550.0f), 100.0f, 10.0f, 0.0f, true);
 266     mArc.AddArc(Vector2(240.0f, 550.0f), 100.0f, 10.0f, 0.0f, true);
 267     mArc.SetOpacity(0.5f);
 268     mArc.SetFillColor(Color::GREEN);
 269
 270     shape3.SetMask(mArc, Dali::CanvasRenderer::Drawable::MaskType::ALPHA);
 271     mCanvasView.AddDrawable(shape3);
 272
 273     mTimer.Start();
 274
 275     window.Add(mCanvasView);
 276   }
 277
 278   /**
 279    * @brief Create a view for gradient example.
 280    */
 281   void CreateGradient()
 282   {
 283     Window  window     = mApplication.GetWindow();
 284     Vector2 windowSize = window.GetSize();
 285     mTitle.SetProperty(Dali::Toolkit::TextLabel::Property::TEXT, VIEW_LABEL[GRADIENT_VIEW]);
 286
 287     Dali::CanvasRenderer::Shape canvasBackground = Dali::CanvasRenderer::Shape::New();
 288     canvasBackground.AddRect(Rect<float>(0.0f, 0.0f, windowSize.width, windowSize.height), Vector2::ZERO);
 289     canvasBackground.SetFillColor(Color::WHITE);
 290     mCanvasView.AddDrawable(canvasBackground);
 291
 292     Dali::Vector<float> dashPattern;
 293     for(auto& pattern : COMMON_STROKE_DASH_PATTERN)
 294     {
 295       dashPattern.PushBack(pattern);
 296     }
 297
 298     Dali::Vector<Dali::CanvasRenderer::Gradient::ColorStop> radialGradientStops;
 299     radialGradientStops.PushBack({0.0f, Color::LIGHT_SEA_GREEN});
 300     radialGradientStops.PushBack({1.0f, Color::BLUE_VIOLET});
 301
 302     Dali::CanvasRenderer::RadialGradient radialGradient = Dali::CanvasRenderer::RadialGradient::New();
 303     radialGradient.SetBounds(Vector2(240, 170), 70);
 304     radialGradient.SetColorStops(radialGradientStops);
 305     radialGradient.SetSpread(Dali::CanvasRenderer::Gradient::Spread::REFLECT);
 306
 307     Dali::CanvasRenderer::Shape roundedRect = Dali::CanvasRenderer::Shape::New();
 308     roundedRect.AddRect(Rect<float>(50.0f, 100.0f, 380.0f, 140.0f), Vector2(40.0f, 40.0f));
 309     roundedRect.SetStrokeColor(Color::YELLOW);
 310     roundedRect.SetStrokeWidth(10.0f);
 311     roundedRect.SetStrokeJoin(Dali::CanvasRenderer::Shape::StrokeJoin::MITER);
 312     roundedRect.SetStrokeDash(dashPattern);
 313     roundedRect.SetFillGradient(radialGradient);
 314     mCanvasView.AddDrawable(roundedRect);
 315
 316     Dali::CanvasRenderer::RadialGradient radialGradient2 = Dali::CanvasRenderer::RadialGradient::New();
 317     radialGradient2.SetBounds(Vector2(240, 320), 70);
 318     radialGradient2.SetColorStops(radialGradientStops);
 319     radialGradient2.SetSpread(Dali::CanvasRenderer::Gradient::Spread::REPEAT);
 320
 321     Dali::CanvasRenderer::Shape roundedRect2 = Dali::CanvasRenderer::Shape::New();
 322     roundedRect2.AddRect(Rect<float>(50.0f, 250.0f, 380.0f, 140.0f), Vector2(40.0f, 40.0f));
 323     roundedRect2.SetStrokeColor(Color::YELLOW);
 324     roundedRect2.SetStrokeWidth(10.0f);
 325     roundedRect2.SetStrokeJoin(Dali::CanvasRenderer::Shape::StrokeJoin::MITER);
 326     roundedRect2.SetStrokeDash(dashPattern);
 327     roundedRect2.SetFillGradient(radialGradient2);
 328     mCanvasView.AddDrawable(roundedRect2);
 329
 330     Dali::Vector<Dali::CanvasRenderer::Gradient::ColorStop> stops;
 331     stops.PushBack({0.0f, Color::RED});
 332     stops.PushBack({0.5f, Color::BLUE});
 333     stops.PushBack({1.0f, Color::GREEN});
 334
 335     mLinearGradient = Dali::CanvasRenderer::LinearGradient::New();
 336     mLinearGradient.SetBounds(Vector2(-100, -100), Vector2(100, 100));
 337     mLinearGradient.SetColorStops(stops);
 338
 339     Dali::Vector<Dali::CanvasRenderer::Gradient::ColorStop> strokeLinearGradientStops;
 340     strokeLinearGradientStops.PushBack({0.0f, Color::SLATE_BLUE});
 341     strokeLinearGradientStops.PushBack({1.0f, Color::MAROON});
 342
 343     Dali::CanvasRenderer::LinearGradient strokeLinearGradient = Dali::CanvasRenderer::LinearGradient::New();
 344     strokeLinearGradient.SetBounds(Vector2(-100, -100), Vector2(100, 100));
 345     strokeLinearGradient.SetColorStops(strokeLinearGradientStops);
 346
 347     Dali::CanvasRenderer::Shape star = MakeStarShape();
 348     star.SetStrokeWidth(30.0f);
 349     star.SetStrokeCap(Dali::CanvasRenderer::Shape::StrokeCap::ROUND);
 350     star.Translate(Vector2(240.0f, 600.0f));
 351     star.SetFillGradient(mLinearGradient);
 352     star.SetStrokeGradient(strokeLinearGradient);
 353     mCanvasView.AddDrawable(star);
 354
 355     window.Add(mCanvasView);
 356
 357     mTimer.Start();
 358   }
 359
 360   /**
 361    * @brief Create a view for picture example.
 362    */
 363   void CreatePicture()
 364   {
 365     Window  window     = mApplication.GetWindow();
 366     Vector2 windowSize = window.GetSize();
 367     mTitle.SetProperty(Dali::Toolkit::TextLabel::Property::TEXT, VIEW_LABEL[PICTURE_VIEW]);
 368
 369     Dali::CanvasRenderer::Shape canvasBackground = Dali::CanvasRenderer::Shape::New();
 370     canvasBackground.AddRect(Rect<float>(0.0f, 0.0f, windowSize.width, windowSize.height), Vector2::ZERO);
 371     canvasBackground.SetFillColor(Color::WHITE);
 372     mCanvasView.AddDrawable(canvasBackground);
 373
 374     Dali::CanvasRenderer::Picture picture = Dali::CanvasRenderer::Picture::New();
 375     picture.Load(IMAGES[0]);
 376     picture.Translate(Vector2(100, 100));
 377     picture.SetSize(Vector2(200, 200));
 378     mCanvasView.AddDrawable(picture);
 379
 380     window.Add(mCanvasView);
 381   }
 382
 383   /**
 384    * @brief Clean up the specified number of view.
 385    * @param[in] viewCnt The number of view.
 386    */
 387   void ResetView(int viewCnt)
 388   {
 389     Window window = mApplication.GetWindow();
 390     mCanvasView.RemoveAllDrawables();
 391     window.Remove(mCanvasView);
 392     mTimer.Stop();
 393   }
 394
 395   /**
 396    * @brief Change to the specified number of view.
 397    * @param[in] viewCnt The number of view.
 398    */
 399   void ChangeView(int viewCnt)
 400   {
 401     switch(viewCnt)
 402     {
 403       case BASIC_SHAPE_VIEW:
 404       {
 405         CreateBasicShape();
 406         break;
 407       }
 408       case CLIP_PATH_VIEW:
 409       {
 410         CreateClipPathAndMask();
 411         break;
 412       }
 413       case GRADIENT_VIEW:
 414       {
 415         CreateGradient();
 416         break;
 417       }
 418       case PICTURE_VIEW:
 419       {
 420         CreatePicture();
 421         break;
 422       }
 423     }
 424     mPrevButton.RaiseToTop();
 425     mNextButton.RaiseToTop();
 426     mTitle.RaiseToTop();
 427   }
 428
 429   /**
 430    * @brief Create a view and set up the button and timer, and title.
 431    */
 432   void Create(Application& application)
 433   {
 434     // The Init signal is received once (only) during the Application lifetime
 435     Window  window     = application.GetWindow();
 436     Vector2 windowSize = window.GetSize();
 437     window.KeyEventSignal().Connect(this, &CanvasViewController::OnKeyEvent);
 438
 439     mPrevButton = Toolkit::PushButton::New();
 440     mPrevButton.SetProperty(Toolkit::Button::Property::LABEL, PREV_BUTTON_TEXT);
 441     mPrevButton.SetProperty(Actor::Property::ANCHOR_POINT, AnchorPoint::TOP_LEFT);
 442     mPrevButton.SetProperty(Actor::Property::PARENT_ORIGIN, ParentOrigin::TOP_LEFT);
 443     window.Add(mPrevButton);
 444     mPrevButton.ClickedSignal().Connect(this, &CanvasViewController::OnPrevButtonClicked);
 445
 446     mNextButton = Toolkit::PushButton::New();
 447     mNextButton.SetProperty(Toolkit::Button::Property::LABEL, LEFT_BUTTON_TEXT);
 448     mNextButton.SetProperty(Actor::Property::ANCHOR_POINT, AnchorPoint::TOP_RIGHT);
 449     mNextButton.SetProperty(Actor::Property::PARENT_ORIGIN, ParentOrigin::TOP_RIGHT);
 450     window.Add(mNextButton);
 451     mNextButton.ClickedSignal().Connect(this, &CanvasViewController::OnNextButtonClicked);
 452
 453     mCanvasView = Toolkit::CanvasView::New();
 454     mCanvasView.SetProperty(Actor::Property::PARENT_ORIGIN, ParentOrigin::CENTER);
 455     mCanvasView.SetProperty(Actor::Property::ANCHOR_POINT, AnchorPoint::CENTER);
 456     mCanvasView.SetProperty(Actor::Property::SIZE, windowSize);
 457
 458     mTitle                                                     = Toolkit::TextLabel::New(VIEW_LABEL[BASIC_SHAPE_VIEW]);
 459     mTitle[Actor::Property::ANCHOR_POINT]                      = AnchorPoint::TOP_CENTER;
 460     mTitle[Actor::Property::PARENT_ORIGIN]                     = Vector3(0.5f, 0.0f, 0.5f);
 461     mTitle[Toolkit::TextLabel::Property::HORIZONTAL_ALIGNMENT] = "CENTER";
 462     mTitle[Toolkit::TextLabel::Property::VERTICAL_ALIGNMENT]   = "CENTER";
 463     mTitle[Toolkit::TextLabel::Property::TEXT_COLOR]           = Color::BLACK;
 464     window.Add(mTitle);
 465
 466     mTimer = Timer::New(1000.0f / 32.0f);
 467     mTimer.TickSignal().Connect(this, &CanvasViewController::tick);
 468
 469     ChangeView(mViewCount);
 470
 471     mPrevButton.RaiseToTop();
 472     mNextButton.RaiseToTop();
 473     mTitle.RaiseToTop();
 474   }
 475
 476   /**
 477    * @brief Called when prev button clicked.
 478    *
 479    * Change to previous view.
 480    */
 481   bool OnPrevButtonClicked(Toolkit::Button button)
 482   {
 483     ResetView(mViewCount);
 484     mViewCount--;
 485     if(mViewCount < BASIC_SHAPE_VIEW)
 486     {
 487       mViewCount = NUMBER_OF_VIEWS - 1;
 488     }
 489     ChangeView(mViewCount);
 490     return true;
 491   }
 492
 493   /**
 494    * @brief Called when prev button clicked.
 495    *
 496    * Change to next view.
 497    */
 498   bool OnNextButtonClicked(Toolkit::Button button)
 499   {
 500     ResetView(mViewCount);
 501     mViewCount++;
 502     if(mViewCount >= NUMBER_OF_VIEWS)
 503     {
 504       mViewCount = 0;
 505     }
 506     ChangeView(mViewCount);
 507     return true;
 508   }
 509
 510   /**
 511    * @brief Called when set time.
 512    *
 513    * Change transformation every call to make it look like vector animation.
 514    */
 515   bool tick()
 516   {
 517     if(mViewCount == BASIC_SHAPE_VIEW)
 518     {
 519       mRoundedRect.ResetPath();
 520       mRoundedRect.AddRect(Rect<float>(10.0f, 350.0f, 200.0f, 140.0f), Vector2(float(mCount % 80), float(mCount % 80)));
 521
 522       mArc.ResetPath();
 523       mArc.AddArc(Vector2(100.0f, 650.0f), 80.0f, 10.0f, float(mCount % 180), true);
 524       mArc.AddArc(Vector2(100.0f, 650.0f), 80.0f, 10.0f + float(mCount % 180), float(mCount % 180) / 2.0f, true);
 525
 526       mStar.Rotate(Degree(mCount * 2.0f));
 527       mStar.Scale(0.6f + (!((mCount / 100) & 0x1) ? float(mCount % 100) * 0.01f : 1 - (float(mCount % 100) * 0.01f)));
 528
 529       mGroup1.Scale(float(mCount % 50) * 0.005f + 0.8f);
 530
 531       mGroup2.SetOpacity(1.0f - float(mCount % 50) * 0.015f);
 532     }
 533     else if(mViewCount == CLIP_PATH_VIEW)
 534     {
 535       mArc.ResetPath();
 536       mArc.AddArc(Vector2(240.0f, 550.0f), 100.0f, 10.0f, float(mCount % 180), true);
 537       mArc.AddArc(Vector2(240.0f, 550.0f), 100.0f, 10.0f + float(mCount % 180), float(mCount % 180) / 2.0f, true);
 538
 539       mStar.Rotate(Degree(mCount * 2.0f));
 540       mStar.Scale(0.6f + (!((mCount / 100) & 0x1) ? float(mCount % 100) * 0.01f : 1 - (float(mCount % 100) * 0.01f)));
 541     }
 542     else if(mViewCount == GRADIENT_VIEW)
 543     {
 544       Dali::Vector<Dali::CanvasRenderer::Gradient::ColorStop> stops;
 545       stops.PushBack({0.0f, Vector4(1.0f, 0.0f, 0.0f, 1.0f)});
 546       stops.PushBack({!((mCount / 100) & 0x1) ? float(mCount % 100) / 100.0f : 1 - (float(mCount % 100) / 100.0f), Vector4(0.0f, 0.0f, 1.0f, 1.0f)});
 547       stops.PushBack({1.0f, Vector4(0.0f, 1.0f, 1.0f, 1.0f)});
 548
 549       mLinearGradient.SetColorStops(stops);
 550     }
 551     mCount++;
 552     return true;
 553   }
 554
 555   /**
 556    * @brief Called when any key event is received.
 557    *
 558    * @param[in] event The key event information
 559    */
 560   void OnKeyEvent(const KeyEvent& event)
 561   {
 562     if(event.GetState() == KeyEvent::DOWN)
 563     {
 564       if(IsKey(event, Dali::DALI_KEY_ESCAPE) || IsKey(event, Dali::DALI_KEY_BACK))
 565       {
 566         mApplication.Quit();
 567       }
 568       else if(IsKey(event, Dali::DALI_KEY_CURSOR_LEFT))
 569       {
 570         ResetView(mViewCount);
 571         mViewCount--;
 572         if(mViewCount < BASIC_SHAPE_VIEW)
 573         {
 574           mViewCount = NUMBER_OF_VIEWS - 1;
 575         }
 576         ChangeView(mViewCount);
 577       }
 578       else if(IsKey(event, Dali::DALI_KEY_CURSOR_RIGHT))
 579       {
 580         ResetView(mViewCount);
 581         mViewCount++;
 582         if(mViewCount >= NUMBER_OF_VIEWS)
 583         {
 584           mViewCount = BASIC_SHAPE_VIEW;
 585         }
 586         ChangeView(mViewCount);
 587       }
 588     }
 589   }
 590
 591 private:
 592   Application&                         mApplication;
 593   Toolkit::CanvasView                  mCanvasView;
 594   Dali::CanvasRenderer::Shape          mRoundedRect;
 595   Dali::CanvasRenderer::Shape          mArc;
 596   Dali::CanvasRenderer::Shape          mStar;
 597   Dali::CanvasRenderer::DrawableGroup  mGroup1;
 598   Dali::CanvasRenderer::DrawableGroup  mGroup2;
 599   Timer                                mTimer;
 600   int                                  mCount;
 601   int                                  mViewCount;
 602   Dali::CanvasRenderer::LinearGradient mLinearGradient;
 603   Toolkit::PushButton                  mPrevButton;
 604   Toolkit::PushButton                  mNextButton;
 605   Toolkit::TextLabel                   mTitle;
 606 };
 607
 608 int DALI_EXPORT_API main(int argc, char** argv)
 609 {
 610   Application          application = Application::New(&argc, &argv);
 611   CanvasViewController test(application);
 612   application.MainLoop();
 613   return 0;
 614 }