Peter M. Groen / dali-demo

Commit 23128b3c70d064a3fb27d0e2031025ea8297aa1e

Authored by JunsuChoi
1 parent 8169c455

Implements CanvasView Example 

This is an example of Dali::Toolkit::CanvasView.
This example create a CanvasView control, create a Dali::CanvasRenderer::Shape
and add it.
Basic Primitves (rect, circle, arc) can draw and
various shapes can draw using path command.

Change-Id: I6f8c1dd262051d856c24cb51bb7dfacb4763d34b
Inline Side-by-side
Showing 6 changed files with 213 additions and 0 deletions
com.samsung.dali-demo.xml
  View file @23128b3
... ... @@ -55,6 +55,9 @@
55 55 <ui-application appid="buttons.example" exec="/usr/apps/com.samsung.dali-demo/bin/buttons.example" nodisplay="true" multiple="false" type="c++app" taskmanage="true">
56 56 <label>Buttons</label>
57 57 </ui-application>
  58 + <ui-application appid="canvas-view.example" exec="/usr/apps/com.samsung.dali-demo/bin/canvas-view.example" nodisplay="true" multiple="false" type="c++app" taskmanage="true">
  59 + <label>Canvas View</label>
  60 + </ui-application>
58 61 <ui-application appid="clipping-draw-order.example" exec="/usr/apps/com.samsung.dali-demo/bin/clipping-draw-order.example" nodisplay="true" multiple="false" type="c++app" taskmanage="true">
59 62 <label>Clipping Draw Order</label>
60 63 </ui-application>
... ...
examples-reel/dali-examples-reel.cpp
  View file @23128b3
... ... @@ -45,6 +45,7 @@ int DALI_EXPORT_API main(int argc, char** argv)
45 45 demo.AddExample(Example("bloom-view.example", DALI_DEMO_STR_TITLE_BLOOM_VIEW));
46 46 demo.AddExample(Example("builder.example", DALI_DEMO_STR_TITLE_SCRIPT_BASED_UI));
47 47 demo.AddExample(Example("buttons.example", DALI_DEMO_STR_TITLE_BUTTONS));
  48 + demo.AddExample(Example("canvas-view.example", DALI_DEMO_STR_TITLE_CANVAS_VIEW));
48 49 demo.AddExample(Example("clipping.example", DALI_DEMO_STR_TITLE_CLIPPING));
49 50 demo.AddExample(Example("clipping-draw-order.example", DALI_DEMO_STR_TITLE_CLIPPING_DRAW_ORDER));
50 51 demo.AddExample(Example("color-transition.example", DALI_DEMO_STR_TITLE_COLOR_TRANSITION));
... ...
examples/canvas-view/canvas-view-example.cpp 0 → 100644
  View file @23128b3
  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-shape.h>
  21 +
  22 +using namespace Dali;
  23 +
  24 +/**
  25 + * @brief This demonstrates how to display and control vector primitives using CanvasView.
  26 + *
  27 + * - It displays various types of shapes. Rectangle, circle, path, etc.
  28 + * - Each shape can be set to fill color, stroke color, width, etc
  29 + * and can change the transfomation(rotate, scale, translate)
  30 + */
  31 +class CanvasViewController : public ConnectionTracker
  32 +{
  33 +public:
  34 + /**
  35 + * @brief Constructor.
  36 + * @param[in] application A reference to the Application class
  37 + */
  38 + CanvasViewController(Application& application)
  39 + : mApplication(application),
  40 + mRoundedRect(),
  41 + mArc(),
  42 + mStar(),
  43 + mTimer(),
  44 + mCount(0)
  45 + {
  46 + // Connect to the Application's Init signal
  47 + mApplication.InitSignal().Connect(this, &CanvasViewController::Create);
  48 + }
  49 +
  50 + ~CanvasViewController() = default;
  51 +
  52 + void Create(Application& application)
  53 + {
  54 + // The Init signal is received once (only) during the Application lifetime
  55 + Window window = application.GetWindow();
  56 + Vector2 windowSize = window.GetSize();
  57 + window.KeyEventSignal().Connect(this, &CanvasViewController::OnKeyEvent);
  58 +
  59 + Toolkit::CanvasView mCanvasView = Toolkit::CanvasView::New(windowSize);
  60 + mCanvasView.SetProperty(Actor::Property::PARENT_ORIGIN, ParentOrigin::CENTER);
  61 + mCanvasView.SetProperty(Actor::Property::ANCHOR_POINT, AnchorPoint::CENTER);
  62 + mCanvasView.SetProperty(Actor::Property::SIZE, windowSize);
  63 +
  64 + Dali::CanvasRenderer::Shape canvasBackground = Dali::CanvasRenderer::Shape::New();
  65 + canvasBackground.AddRect(Rect<float>(0.0f, 0.0f, windowSize.width, windowSize.height), Vector2::ZERO);
  66 + canvasBackground.SetFillColor(Vector4(1.0f, 1.0f, 1.0f, 1.0f));
  67 + mCanvasView.AddDrawable(canvasBackground);
  68 +
  69 + Dali::CanvasRenderer::Shape shape1 = Dali::CanvasRenderer::Shape::New();
  70 + shape1.AddRect(Rect<float>(-50.0f, -50.0f, 100.0f, 100.0f), Vector2::ZERO);
  71 + shape1.SetFillColor(Vector4(0.0f, 0.5f, 0.0f, 0.5f));
  72 + shape1.SetStrokeColor(Vector4(0.5f, 0.0f, 0.0f, 0.5f));
  73 + shape1.SetStrokeWidth(10.0f);
  74 + shape1.Scale(1.2f);
  75 + shape1.Rotate(Degree(45.0f));
  76 + shape1.Translate(Vector2(100.0f, 100.0f));
  77 +
  78 + mCanvasView.AddDrawable(shape1);
  79 +
  80 + mRoundedRect = Dali::CanvasRenderer::Shape::New();
  81 + mRoundedRect.AddRect(Rect<float>(10.0f, 350.0f, 200.0f, 140.0f), Vector2(40.0f, 40.0f));
  82 + mRoundedRect.SetFillColor(Vector4(0.0f, 0.0f, 1.0f, 1.0f));
  83 + mRoundedRect.SetOpacity(0.5f);
  84 + mRoundedRect.SetStrokeColor(Vector4(1.0f, 1.0f, 0.0f, 1.0f));
  85 + mRoundedRect.SetStrokeWidth(10.0f);
  86 + mRoundedRect.SetStrokeJoin(Dali::CanvasRenderer::Shape::StrokeJoin::MITER);
  87 + Dali::Vector<float> dashPattern;
  88 + dashPattern.PushBack(15.0f);
  89 + dashPattern.PushBack(30.0f);
  90 + mRoundedRect.SetStrokeDash(dashPattern);
  91 + mCanvasView.AddDrawable(mRoundedRect);
  92 +
  93 + Dali::CanvasRenderer::Shape shape2 = Dali::CanvasRenderer::Shape::New();
  94 + shape2.AddMoveTo(Vector2(535.0f, 135.0f));
  95 + shape2.AddLineTo(Vector2(660.0f, 455.0f));
  96 + shape2.AddLineTo(Vector2(355.0f, 250.0f));
  97 + shape2.AddLineTo(Vector2(715.0f, 250.0f));
  98 + shape2.AddLineTo(Vector2(410.0f, 455.0f));
  99 + shape2.Close();
  100 + shape2.SetFillRule(Dali::CanvasRenderer::Shape::FillRule::EVEN_ODD);
  101 + shape2.SetFillColor(Vector4(1.0f, 0.0f, 0.0f, 1.0f));
  102 + shape2.SetOpacity(0.5f);
  103 + shape2.SetStrokeColor(Vector4(1.0f, 0.0f, 1.0f, 1.0f));
  104 + shape2.SetStrokeWidth(20.0f);
  105 + shape2.SetStrokeJoin(Dali::CanvasRenderer::Shape::StrokeJoin::ROUND);
  106 + shape2.Transform(Matrix3(0.6f, 0.0f, 20.0f, 0.0f, 0.6f, -50.0f, 0.0f, 0.0f, 1.0f));
  107 + mCanvasView.AddDrawable(shape2);
  108 +
  109 + mArc = Dali::CanvasRenderer::Shape::New();
  110 + mArc.AddArc(Vector2(100.0f, 650.0f), 80.0f, 10.0f, 0.0f, true);
  111 + mArc.AddArc(Vector2(100.0f, 650.0f), 80.0f, 10.0f, 0.0f, true);
  112 + mArc.SetOpacity(0.5f);
  113 + mArc.SetStrokeColor(Vector4(0.0f, 1.0f, 0.0f, 1.0f));
  114 + mArc.SetStrokeWidth(10.0f);
  115 + mArc.SetStrokeCap(Dali::CanvasRenderer::Shape::StrokeCap::ROUND);
  116 + mCanvasView.AddDrawable(mArc);
  117 +
  118 + mStar = Dali::CanvasRenderer::Shape::New();
  119 + mStar.AddMoveTo(Vector2(-1.0f, -165.0f));
  120 + mStar.AddLineTo(Vector2(53.0f, -56.0f));
  121 + mStar.AddLineTo(Vector2(174.0f, -39.0f));
  122 + mStar.AddLineTo(Vector2(87.0f, 45.0f));
  123 + mStar.AddLineTo(Vector2(107.0f, 166.0f));
  124 + mStar.AddLineTo(Vector2(-1.0f, 110.0f));
  125 + mStar.AddLineTo(Vector2(-103.0f, 166.0f));
  126 + mStar.AddLineTo(Vector2(-88.0f, 46.0f));
  127 + mStar.AddLineTo(Vector2(-174.0f, -38.0f));
  128 + mStar.AddLineTo(Vector2(-54.0f, -56.0f));
  129 +
  130 + mStar.Close();
  131 +
  132 + mStar.SetFillColor(Vector4(0.0f, 1.0f, 1.0f, 1.0f));
  133 + mStar.SetStrokeColor(Vector4(0.5f, 1.0f, 0.5f, 1.0f));
  134 + mStar.SetStrokeWidth(30.0f);
  135 + mStar.SetStrokeCap(Dali::CanvasRenderer::Shape::StrokeCap::ROUND);
  136 + mStar.Scale(0.6f);
  137 + mStar.Translate(Vector2(350.0f, 450.0f));
  138 + mStar.SetOpacity(0.5f);
  139 +
  140 + mCanvasView.AddDrawable(mStar);
  141 +
  142 + mTimer = Timer::New(1000.0f / 32.0f);
  143 + mTimer.TickSignal().Connect(this, &CanvasViewController::tick);
  144 + mTimer.Start();
  145 +
  146 + window.Add(mCanvasView);
  147 + }
  148 +
  149 + /**
  150 + * @brief Called when set time.
  151 + *
  152 + * Change transformation every call to make it look like vector animation.
  153 + */
  154 + bool tick()
  155 + {
  156 + mRoundedRect.ResetPath();
  157 + mRoundedRect.AddRect(Rect<float>(10.0f, 350.0f, 200.0f, 140.0f), Vector2(float(mCount % 80), float(mCount % 80)));
  158 +
  159 + mArc.ResetPath();
  160 + mArc.AddArc(Vector2(100.0f, 650.0f), 80.0f, 10.0f, float(mCount % 180), true);
  161 + mArc.AddArc(Vector2(100.0f, 650.0f), 80.0f, 10.0f + float(mCount % 180), float(mCount % 180) / 2.0f, true);
  162 +
  163 + mStar.Rotate(Degree(mCount * 2.0f));
  164 + mStar.Scale(float(mCount % 100) * 0.01f + 0.6f);
  165 + mCount++;
  166 + return true;
  167 + }
  168 +
  169 + /**
  170 + * @brief Called when any key event is received.
  171 + *
  172 + * Will use this to quit the application if Back or the Escape key is received
  173 + * @param[in] event The key event information
  174 + */
  175 + void OnKeyEvent(const KeyEvent& event)
  176 + {
  177 + if(event.GetState() == KeyEvent::DOWN)
  178 + {
  179 + if(IsKey(event, Dali::DALI_KEY_ESCAPE) || IsKey(event, Dali::DALI_KEY_BACK))
  180 + {
  181 + mApplication.Quit();
  182 + }
  183 + }
  184 + }
  185 +
  186 +private:
  187 + Application& mApplication;
  188 + Dali::CanvasRenderer::Shape mRoundedRect;
  189 + Dali::CanvasRenderer::Shape mArc;
  190 + Dali::CanvasRenderer::Shape mStar;
  191 + Timer mTimer;
  192 + int mCount;
  193 +};
  194 +
  195 +int DALI_EXPORT_API main(int argc, char** argv)
  196 +{
  197 + Application application = Application::New(&argc, &argv);
  198 + CanvasViewController test(application);
  199 + application.MainLoop();
  200 + return 0;
  201 +}
... ...
resources/po/en_GB.po
  View file @23128b3
... ... @@ -28,6 +28,9 @@ msgstr &quot;Bubbles&quot;
28 28 msgid "DALI_DEMO_STR_TITLE_BUTTONS"
29 29 msgstr "Buttons"
30 30  
  31 +msgid "DALI_DEMO_STR_TITLE_CANVAS_VIEW"
  32 +msgstr "Canvas view"
  33 +
31 34 msgid "DALI_DEMO_STR_TITLE_CALL_ACTIVE"
32 35 msgstr "Call Active"
33 36  
... ...
resources/po/en_US.po
  View file @23128b3
... ... @@ -28,6 +28,9 @@ msgstr &quot;Bubbles&quot;
28 28 msgid "DALI_DEMO_STR_TITLE_BUTTONS"
29 29 msgstr "Buttons"
30 30  
  31 +msgid "DALI_DEMO_STR_TITLE_CANVAS_VIEW"
  32 +msgstr "Canvas view"
  33 +
31 34 msgid "DALI_DEMO_STR_TITLE_CALL_ACTIVE"
32 35 msgstr "Call Active"
33 36  
... ...
shared/dali-demo-strings.h
  View file @23128b3
... ... @@ -45,6 +45,7 @@ extern &quot;C&quot;
45 45 #define DALI_DEMO_STR_TITLE_BLOOM_VIEW dgettext(DALI_DEMO_DOMAIN_LOCAL, "DALI_DEMO_STR_TITLE_BLOOM_VIEW")
46 46 #define DALI_DEMO_STR_TITLE_BUBBLES dgettext(DALI_DEMO_DOMAIN_LOCAL, "DALI_DEMO_STR_TITLE_BUBBLES")
47 47 #define DALI_DEMO_STR_TITLE_BUTTONS dgettext(DALI_DEMO_DOMAIN_LOCAL, "DALI_DEMO_STR_TITLE_BUTTONS")
  48 +#define DALI_DEMO_STR_TITLE_CANVAS_VIEW dgettext(DALI_DEMO_DOMAIN_LOCAL, "DALI_DEMO_STR_TITLE_CANVAS_VIEW")
48 49 #define DALI_DEMO_STR_TITLE_CALL_ACTIVE dgettext(DALI_DEMO_DOMAIN_LOCAL, "DALI_DEMO_STR_TITLE_CALL_ACTIVE")
49 50 #define DALI_DEMO_STR_TITLE_CARD_ACTIVE dgettext(DALI_DEMO_DOMAIN_LOCAL, "DALI_DEMO_STR_TITLE_CARD_ACTIVE")
50 51 #define DALI_DEMO_STR_TITLE_CLIPPING dgettext(DALI_DEMO_DOMAIN_LOCAL, "DALI_DEMO_STR_TITLE_CLIPPING")
... ... @@ -150,6 +151,7 @@ extern &quot;C&quot;
150 151 #define DALI_DEMO_STR_TITLE_BLOOM_VIEW "Bloom"
151 152 #define DALI_DEMO_STR_TITLE_BUBBLES "Bubbles"
152 153 #define DALI_DEMO_STR_TITLE_BUTTONS "Buttons"
  154 +#define DALI_DEMO_STR_TITLE_CANVAS_VIEW "Canvas View"
153 155 #define DALI_DEMO_STR_TITLE_CALL_ACTIVE "Call Active"
154 156 #define DALI_DEMO_STR_TITLE_CARD_ACTIVE "Card Active"
155 157 #define DALI_DEMO_STR_TITLE_CLIPPING "Clipping"
... ...