examples/popup/popup-example.cpp

   1 /*
   2  * Copyright (c) 2020 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/popup/popup.h>
  20 #include <dali-toolkit/devel-api/controls/table-view/table-view.h>
  21 #include <dali/dali.h>
  22 #include "shared/view.h"
  23
  24 using namespace Dali;
  25
  26 using Dali::Toolkit::TextLabel;
  27
  28 struct ButtonItem
  29 {
  30   const char* name;
  31   const char* text;
  32 };
  33
  34 namespace
  35 {
  36 const char* const BACKGROUND_IMAGE = DEMO_IMAGE_DIR "background-gradient.jpg";
  37 const char* const TOOLBAR_IMAGE    = DEMO_IMAGE_DIR "top-bar.png";
  38
  39 const char* const TOOLBAR_TITLE = "Popup";
  40
  41 const char* CONTEXT_DISABLED_ICON_IMAGE = DEMO_IMAGE_DIR "icon-scroll-view-carousel.png";
  42 const char* CONTEXT_ENABLED_ICON_IMAGE  = DEMO_IMAGE_DIR "icon-scroll-view-spiral.png";
  43 const char* ANIMATION_FADE_ICON_IMAGE   = DEMO_IMAGE_DIR "icon-effects-off.png";
  44 const char* ANIMATION_ZOOM_ICON_IMAGE   = DEMO_IMAGE_DIR "icon-effects-on.png";
  45
  46 const char* const POPUP_BUTTON_TITLE_ID                       = "POPUP_BUTTON_TITLE";
  47 const char* const POPUP_BUTTON_BUTTONS_1_ID                   = "POPUP_BUTTON_BUTTONS_1";
  48 const char* const POPUP_BUTTON_BUTTONS_2_ID                   = "POPUP_BUTTON_BUTTONS_2";
  49 const char* const POPUP_BUTTON_TOAST_ID                       = "POPUP_BUTTON_TOAST";
  50 const char* const POPUP_BUTTON_TITLE_CONTENT_BUTTONS_ID       = "POPUP_BUTTON_TITLE_CONTENT_BUTTONS";
  51 const char* const POPUP_BUTTON_CONTENT_TEXT_ID                = "POPUP_BUTTON_CONTENT_TEXT";
  52 const char* const POPUP_BUTTON_CONTENT_IMAGE_ID               = "POPUP_BUTTON_CONTENT_IMAGE";
  53 const char* const POPUP_BUTTON_TITLE_CONTENT_TEXT_ID          = "POPUP_BUTTON_TITLE_CONTENT_TEXT";
  54 const char* const POPUP_BUTTON_TITLE_LARGE_CONTENT_BUTTONS_ID = "POPUP_BUTTON_TITLE_LARGE_CONTENT_BUTTONS";
  55 const char* const POPUP_BUTTON_FIXED_SIZE_ID                  = "POPUP_BUTTON_FIXED_SIZE_ID";
  56 const char* const POPUP_BUTTON_COMPLEX_ID                     = "POPUP_BUTTON_COMPLEX";
  57 const char* const POPUP_BUTTON_CUSTOM_STYLE                   = "POPUP_BUTTON_CUSTOM_STYLE";
  58
  59 // Names to give Popup PushButton controls.
  60 const char* const POPUP_CONTROL_OK_NAME     = "controlOk";
  61 const char* const POPUP_CONTROL_CANCEL_NAME = "controlCancel";
  62
  63 const char* const CONTENT_TEXT = "Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.";
  64 const char* const IMAGE1       = DEMO_IMAGE_DIR "gallery-medium-5.jpg";
  65 const char* const IMAGE2       = DEMO_IMAGE_DIR "background-magnifier.jpg";
  66
  67 // Control area image.
  68 const char* DEFAULT_CONTROL_AREA_IMAGE_PATH = DEMO_IMAGE_DIR "popup_button_background.9.png"; ///< Control area image for the popup.
  69
  70 const ButtonItem POPUP_BUTTON_ITEMS[] = {
  71   {POPUP_BUTTON_COMPLEX_ID, "Complex"},
  72   {POPUP_BUTTON_TOAST_ID, "Toast Popup"},
  73   {POPUP_BUTTON_TITLE_ID, "Title"},
  74   {POPUP_BUTTON_BUTTONS_1_ID, "1 Button"},
  75   {POPUP_BUTTON_BUTTONS_2_ID, "2 Buttons"},
  76   {POPUP_BUTTON_FIXED_SIZE_ID, "Fixed Size"},
  77   {POPUP_BUTTON_TITLE_CONTENT_BUTTONS_ID, "Title + Content + Buttons"},
  78   {POPUP_BUTTON_CONTENT_TEXT_ID, "Content Text"},
  79   {POPUP_BUTTON_CONTENT_IMAGE_ID, "Content Image"},
  80   {POPUP_BUTTON_TITLE_CONTENT_TEXT_ID, "Title + Content"},
  81   {POPUP_BUTTON_TITLE_LARGE_CONTENT_BUTTONS_ID, "Title + Large Content + Buttons"},
  82   {POPUP_BUTTON_CUSTOM_STYLE, "Custom Styled Popup"}};
  83
  84 const int POPUP_BUTTON_ITEMS_COUNT = sizeof(POPUP_BUTTON_ITEMS) / sizeof(POPUP_BUTTON_ITEMS[0]);
  85
  86 const char* const CUSTOM_POPUP_STYLE_NAME = "CustomPopupStyle"; ///< Custom popup style name
  87 } // anonymous namespace
  88
  89 /**
  90  * This example shows the usage of the Popup class.
  91  */
  92 class PopupExample : public ConnectionTracker, public Toolkit::ItemFactory
  93 {
  94 public:
  95   PopupExample(Application& application)
  96   : mApplication(application),
  97     mContextual(false),
  98     mAnimationFade(true)
  99   {
 100     // Connect to the Application's Init signal
 101     mApplication.InitSignal().Connect(this, &PopupExample::Create);
 102   }
 103
 104   ~PopupExample()
 105   {
 106     // Nothing to do here
 107   }
 108
 109   void Create(Application& application)
 110   {
 111     // The Init signal is received once (only) during the Application lifetime
 112     Window window = application.GetWindow();
 113
 114     // Respond to key events if not handled
 115     window.KeyEventSignal().Connect(this, &PopupExample::OnKeyEvent);
 116
 117     // Creates a default view with a default tool bar.
 118     // The view is added to the window.
 119     mContentLayer = DemoHelper::CreateView(application,
 120                                            mView,
 121                                            mToolBar,
 122                                            BACKGROUND_IMAGE,
 123                                            TOOLBAR_IMAGE,
 124                                            std::string(""));
 125
 126     mTitleActor = DemoHelper::CreateToolBarLabel("CUSTOM_TOOLBAR_TITLE");
 127     mTitleActor.SetProperty(Toolkit::TextLabel::Property::TEXT, TOOLBAR_TITLE);
 128
 129     // Add title to the tool bar.
 130     const float padding(DemoHelper::DEFAULT_VIEW_STYLE.mToolBarPadding);
 131     mToolBar.AddControl(mTitleActor, DemoHelper::DEFAULT_VIEW_STYLE.mToolBarTitlePercentage, Toolkit::Alignment::HORIZONTAL_CENTER, Toolkit::Alignment::Padding(padding, padding, padding, padding));
 132
 133     // Create animation button.
 134     mAnimationButton = Toolkit::PushButton::New();
 135     mAnimationButton.SetProperty(Toolkit::Button::Property::UNSELECTED_BACKGROUND_VISUAL, ANIMATION_FADE_ICON_IMAGE);
 136     mAnimationButton.SetProperty(Toolkit::Button::Property::SELECTED_BACKGROUND_VISUAL, ANIMATION_ZOOM_ICON_IMAGE);
 137     mAnimationButton.SetProperty(Toolkit::Button::Property::TOGGLABLE, true);
 138     mAnimationButton.ClickedSignal().Connect(this, &PopupExample::OnAnimationClicked);
 139     mToolBar.AddControl(mAnimationButton, DemoHelper::DEFAULT_VIEW_STYLE.mToolBarButtonPercentage, Toolkit::Alignment::HORIZONTAL_LEFT, DemoHelper::DEFAULT_MODE_SWITCH_PADDING);
 140
 141     // Create context button.
 142     mContextButton = Toolkit::PushButton::New();
 143     mContextButton.SetProperty(Toolkit::Button::Property::UNSELECTED_BACKGROUND_VISUAL, CONTEXT_DISABLED_ICON_IMAGE);
 144     mContextButton.SetProperty(Toolkit::Button::Property::SELECTED_BACKGROUND_VISUAL, CONTEXT_ENABLED_ICON_IMAGE);
 145     mContextButton.SetProperty(Toolkit::Button::Property::TOGGLABLE, true);
 146     mContextButton.ClickedSignal().Connect(this, &PopupExample::OnContextClicked);
 147     mToolBar.AddControl(mContextButton, DemoHelper::DEFAULT_VIEW_STYLE.mToolBarButtonPercentage, Toolkit::Alignment::HORIZONTAL_LEFT, DemoHelper::DEFAULT_MODE_SWITCH_PADDING);
 148
 149     // Add title to the tool bar.
 150     mItemView = Toolkit::ItemView::New(*this);
 151     mItemView.SetProperty(Actor::Property::PARENT_ORIGIN, ParentOrigin::CENTER);
 152     mItemView.SetProperty(Actor::Property::ANCHOR_POINT, AnchorPoint::CENTER);
 153     mItemView.SetResizePolicy(ResizePolicy::FILL_TO_PARENT, Dimension::ALL_DIMENSIONS);
 154
 155     // Use a grid layout for tests
 156     Vector2                windowSize = window.GetSize();
 157     Toolkit::ItemLayoutPtr gridLayout = Toolkit::DefaultItemLayout::New(Toolkit::DefaultItemLayout::LIST);
 158     Vector3                itemSize;
 159     gridLayout->GetItemSize(0, Vector3(windowSize), itemSize);
 160     itemSize.height = windowSize.y / 10;
 161     gridLayout->SetItemSize(itemSize);
 162     mItemView.AddLayout(*gridLayout);
 163
 164     mItemView.ActivateLayout(0, Vector3(windowSize.x, windowSize.y, windowSize.x), 0.0f);
 165
 166     mContentLayer.Add(mItemView);
 167   }
 168
 169   bool OnContextClicked(Toolkit::Button button)
 170   {
 171     mContextual = button.GetProperty(Toolkit::Button::Property::SELECTED).Get<bool>();
 172     return true;
 173   }
 174
 175   bool OnAnimationClicked(Toolkit::Button button)
 176   {
 177     mAnimationFade = !(button.GetProperty(Toolkit::Button::Property::SELECTED).Get<bool>());
 178     return true;
 179   }
 180
 181   /**
 182    * This function is designed as a shortcut to convert any resize policies set for a popup to
 183    * ones that will work for contextual mode (for demo purposes).
 184    * Note that in a real-use case example the policies would be set to something appropriate
 185    * manually, but in the case of this demo, the popup is parented from the popup-opening buttons
 186    * and (incorrectly) have their policies as "SIZE_RELATIVE_TO_PARENT". This would create a tiny
 187    * popup that would not be able to contain it's contents, so to illustrate contextual behaviour
 188    * this function converts the old policies and size to new ones that would give the popup the
 189    * same visual appearance.
 190    * @param[in] popup The popup whose policies should be modified.
 191    */
 192   void SetupContextualResizePolicy(Toolkit::Popup& popup)
 193   {
 194     Vector2 windowSize = mApplication.GetWindow().GetSize();
 195     // Some defaults when creating a new fixed size.
 196     // This is NOT a Vector2 so we can modify each dimension in a for-loop.
 197     float newSize[Dimension::DIMENSION_COUNT] = {windowSize.x * 0.75f, windowSize.y * 0.75f};
 198     bool  modifySize                          = false;
 199
 200     // Loop through each of two dimensions to process them.
 201     for(unsigned int dimension = 0; dimension < 2; ++dimension)
 202     {
 203       float           windowDimensionSize, sizeModeFactor;
 204       Dimension::Type policyDimension = dimension == 0 ? Dimension::WIDTH : Dimension::HEIGHT;
 205
 206       // Setup information related to the current dimension we are processing.
 207       if(policyDimension == Dimension::WIDTH)
 208       {
 209         windowDimensionSize = windowSize.x;
 210         sizeModeFactor      = popup.GetProperty<Vector3>(Actor::Property::SIZE_MODE_FACTOR).x;
 211       }
 212       else
 213       {
 214         windowDimensionSize = windowSize.y;
 215         sizeModeFactor      = popup.GetProperty<Vector3>(Actor::Property::SIZE_MODE_FACTOR).y;
 216       }
 217
 218       bool               modifyPolicy = false;
 219       ResizePolicy::Type policy       = popup.GetResizePolicy(policyDimension);
 220       ResizePolicy::Type newPolicy(policy);
 221
 222       // Switch on each policy type to determine the new behaviour.
 223       switch(policy)
 224       {
 225         case ResizePolicy::FIXED:
 226         case ResizePolicy::USE_ASSIGNED_SIZE:
 227         {
 228           break;
 229         }
 230
 231         case ResizePolicy::USE_NATURAL_SIZE:
 232         case ResizePolicy::FIT_TO_CHILDREN:
 233         case ResizePolicy::DIMENSION_DEPENDENCY:
 234         {
 235           // Set size to 0 so the policy determines size.
 236           // If a non-zero size is set, policy is converted to fixed.
 237           newSize[dimension] = 0.0f;
 238           modifySize         = true;
 239           break;
 240         }
 241
 242         // The following cases emulate the three size-mode related resize policies.
 243         case ResizePolicy::FILL_TO_PARENT:
 244         {
 245           newPolicy          = ResizePolicy::FIXED;
 246           newSize[dimension] = windowDimensionSize;
 247           modifyPolicy       = true;
 248           break;
 249         }
 250
 251         case ResizePolicy::SIZE_RELATIVE_TO_PARENT:
 252         {
 253           newPolicy          = ResizePolicy::FIXED;
 254           newSize[dimension] = windowDimensionSize * sizeModeFactor;
 255           modifyPolicy       = true;
 256           break;
 257         }
 258
 259         case ResizePolicy::SIZE_FIXED_OFFSET_FROM_PARENT:
 260         {
 261           newPolicy          = ResizePolicy::FIXED;
 262           newSize[dimension] = windowDimensionSize + sizeModeFactor;
 263           modifyPolicy       = true;
 264           break;
 265         }
 266       }
 267
 268       if(modifyPolicy)
 269       {
 270         // Set the new policy for this dimension, if it has been modified.
 271         popup.SetResizePolicy(newPolicy, policyDimension);
 272         modifySize = true;
 273       }
 274     }
 275
 276     if(modifySize)
 277     {
 278       // The size is set once at the end.
 279       popup.SetProperty(Actor::Property::SIZE, Vector2(newSize[0], newSize[1]));
 280     }
 281   }
 282
 283   void SetupPopup(Toolkit::Popup popup, Actor parent)
 284   {
 285     if(mAnimationFade)
 286     {
 287       popup.SetProperty(Toolkit::Popup::Property::ANIMATION_MODE, "FADE");
 288     }
 289     else
 290     {
 291       popup.SetProperty(Toolkit::Popup::Property::ANIMATION_MODE, "ZOOM");
 292     }
 293
 294     if(mContextual)
 295     {
 296       popup.SetProperty(Toolkit::Popup::Property::CONTEXTUAL_MODE, "BELOW");
 297
 298       // Modify the preset demo resize policies (and size) to contextual ones.
 299       SetupContextualResizePolicy(popup);
 300
 301       parent.Add(popup);
 302     }
 303     else
 304     {
 305       mApplication.GetWindow().Add(popup);
 306     }
 307
 308     mPopup.SetDisplayState(Toolkit::Popup::SHOWN);
 309   }
 310
 311   void HidePopup()
 312   {
 313     if(mPopup)
 314     {
 315       mPopup.SetDisplayState(Toolkit::Popup::HIDDEN);
 316     }
 317   }
 318
 319   void PopupHidden()
 320   {
 321     if(mPopup)
 322     {
 323       mPopup.Unparent();
 324       mPopup.Reset();
 325     }
 326   }
 327
 328   Toolkit::Popup CreatePopup()
 329   {
 330     Window      window         = mApplication.GetWindow();
 331     const float POPUP_WIDTH_DP = window.GetSize().GetWidth() * 0.75f;
 332
 333     Toolkit::Popup popup = Toolkit::Popup::New();
 334     popup.SetProperty(Dali::Actor::Property::NAME, "popup");
 335     popup.SetProperty(Actor::Property::PARENT_ORIGIN, ParentOrigin::CENTER);
 336     popup.SetProperty(Actor::Property::ANCHOR_POINT, AnchorPoint::CENTER);
 337     popup.SetProperty(Actor::Property::SIZE, Vector2(POPUP_WIDTH_DP, 0.0f));
 338     popup.SetProperty(Toolkit::Popup::Property::TAIL_VISIBILITY, false);
 339
 340     popup.OutsideTouchedSignal().Connect(this, &PopupExample::HidePopup);
 341     popup.HiddenSignal().Connect(this, &PopupExample::PopupHidden);
 342
 343     return popup;
 344   }
 345
 346   Toolkit::Popup CreateConfirmationPopup(int numberOfButtons)
 347   {
 348     Toolkit::Popup confirmationPopup = Toolkit::Popup::New();
 349     confirmationPopup.SetProperty(Dali::Actor::Property::NAME, "MAIN-POPUP-SELF");
 350
 351     if(numberOfButtons > 0)
 352     {
 353       // Start with a control area image.
 354       Toolkit::ImageView footer = Toolkit::ImageView::New(DEFAULT_CONTROL_AREA_IMAGE_PATH);
 355       footer.SetProperty(Dali::Actor::Property::NAME, "controlAreaImage");
 356       // Set up the container's layout.
 357       footer.SetResizePolicy(ResizePolicy::FILL_TO_PARENT, Dimension::WIDTH);
 358       footer.SetResizePolicy(ResizePolicy::FIXED, Dimension::HEIGHT);
 359       footer.SetProperty(Actor::Property::SIZE, Vector2(0.0f, 130.0f));
 360       footer.SetProperty(Actor::Property::ANCHOR_POINT, AnchorPoint::CENTER);
 361       footer.SetProperty(Actor::Property::PARENT_ORIGIN, ParentOrigin::CENTER);
 362
 363       Actor okButton = CreateOKButton();
 364       okButton.SetProperty(Actor::Property::PARENT_ORIGIN, ParentOrigin::CENTER);
 365       okButton.SetProperty(Actor::Property::ANCHOR_POINT, AnchorPoint::CENTER);
 366       okButton.SetResizePolicy(ResizePolicy::SIZE_FIXED_OFFSET_FROM_PARENT, Dimension::ALL_DIMENSIONS);
 367       okButton.SetProperty(Actor::Property::SIZE_MODE_FACTOR, Vector3(-20.0f, -20.0f, 0.0));
 368
 369       if(numberOfButtons > 1)
 370       {
 371         Toolkit::TableView controlLayout = Toolkit::TableView::New(1, 2);
 372         controlLayout.SetProperty(Actor::Property::PARENT_ORIGIN, ParentOrigin::CENTER);
 373         controlLayout.SetProperty(Actor::Property::ANCHOR_POINT, AnchorPoint::CENTER);
 374         controlLayout.SetResizePolicy(ResizePolicy::FILL_TO_PARENT, Dimension::ALL_DIMENSIONS);
 375
 376         Actor cancelButton = CreateCancelButton();
 377         cancelButton.SetProperty(Actor::Property::PARENT_ORIGIN, ParentOrigin::CENTER);
 378         cancelButton.SetProperty(Actor::Property::ANCHOR_POINT, AnchorPoint::CENTER);
 379         cancelButton.SetResizePolicy(ResizePolicy::SIZE_FIXED_OFFSET_FROM_PARENT, Dimension::ALL_DIMENSIONS);
 380         cancelButton.SetProperty(Actor::Property::SIZE_MODE_FACTOR, Vector3(-20.0f, -20.0f, 0.0));
 381
 382         controlLayout.SetCellPadding(Size(10.0f, 10.0f));
 383
 384         controlLayout.SetRelativeWidth(0, 0.5f);
 385         controlLayout.SetRelativeWidth(1, 0.5f);
 386
 387         controlLayout.SetCellAlignment(Toolkit::TableView::CellPosition(0, 0), HorizontalAlignment::CENTER, VerticalAlignment::CENTER);
 388         controlLayout.SetCellAlignment(Toolkit::TableView::CellPosition(0, 1), HorizontalAlignment::CENTER, VerticalAlignment::CENTER);
 389         controlLayout.AddChild(okButton, Toolkit::TableView::CellPosition(0, 0));
 390         controlLayout.AddChild(cancelButton, Toolkit::TableView::CellPosition(0, 1));
 391
 392         footer.Add(controlLayout);
 393       }
 394       else
 395       {
 396         footer.Add(okButton);
 397       }
 398
 399       confirmationPopup.SetFooter(footer);
 400     }
 401
 402     confirmationPopup.OutsideTouchedSignal().Connect(this, &PopupExample::HidePopup);
 403
 404     return confirmationPopup;
 405   }
 406
 407   Actor CreateTitle(std::string title)
 408   {
 409     Toolkit::TextLabel titleActor = Toolkit::TextLabel::New(title);
 410     titleActor.SetProperty(Dali::Actor::Property::NAME, "titleActor");
 411     titleActor.SetProperty(Toolkit::TextLabel::Property::TEXT_COLOR, Color::WHITE);
 412     titleActor.SetProperty(Toolkit::TextLabel::Property::MULTI_LINE, true);
 413     titleActor.SetProperty(Toolkit::TextLabel::Property::HORIZONTAL_ALIGNMENT, "CENTER");
 414
 415     return titleActor;
 416   }
 417
 418   Toolkit::PushButton CreateOKButton()
 419   {
 420     Toolkit::PushButton okayButton = Toolkit::PushButton::New();
 421     okayButton.SetProperty(Dali::Actor::Property::NAME, POPUP_CONTROL_OK_NAME);
 422     okayButton.SetProperty(Toolkit::Button::Property::LABEL, "OK!");
 423
 424     okayButton.ClickedSignal().Connect(this, &PopupExample::OnPopupButtonClicked);
 425
 426     return okayButton;
 427   }
 428
 429   Toolkit::PushButton CreateCancelButton()
 430   {
 431     Toolkit::PushButton cancelButton = Toolkit::PushButton::New();
 432     cancelButton.SetProperty(Dali::Actor::Property::NAME, POPUP_CONTROL_CANCEL_NAME);
 433     cancelButton.SetProperty(Toolkit::Button::Property::LABEL, "Cancel");
 434
 435     cancelButton.ClickedSignal().Connect(this, &PopupExample::OnPopupButtonClicked);
 436
 437     return cancelButton;
 438   }
 439
 440   bool OnPopupButtonClicked(Toolkit::Button button)
 441   {
 442     // Handle Popup pushbuttons being clicked.
 443     HidePopup();
 444     return true;
 445   }
 446
 447   bool OnButtonClicked(Toolkit::Button button)
 448   {
 449     // Handle menu items that create popups.
 450     if(button.GetProperty<std::string>(Dali::Actor::Property::NAME) == POPUP_BUTTON_TITLE_ID)
 451     {
 452       mPopup = CreatePopup();
 453       mPopup.SetTitle(CreateTitle("Popup!"));
 454
 455       SetupPopup(mPopup, button);
 456     }
 457     else if(button.GetProperty<std::string>(Dali::Actor::Property::NAME) == POPUP_BUTTON_BUTTONS_1_ID)
 458     {
 459       mPopup = CreateConfirmationPopup(1);
 460       mPopup.SetTitle(CreateTitle("Title"));
 461
 462       SetupPopup(mPopup, button);
 463     }
 464     else if(button.GetProperty<std::string>(Dali::Actor::Property::NAME) == POPUP_BUTTON_BUTTONS_2_ID)
 465     {
 466       mPopup = CreateConfirmationPopup(2);
 467       mPopup.SetTitle(CreateTitle("Title"));
 468
 469       SetupPopup(mPopup, button);
 470     }
 471     else if(button.GetProperty<std::string>(Dali::Actor::Property::NAME) == POPUP_BUTTON_TOAST_ID)
 472     {
 473       // Create a toast popup via the type registry (as it is a named-type).
 474       TypeInfo typeInfo = TypeRegistry::Get().GetTypeInfo("PopupToast");
 475       if(typeInfo)
 476       {
 477         BaseHandle baseHandle = typeInfo.CreateInstance();
 478         if(baseHandle)
 479         {
 480           mPopup = Toolkit::Popup::DownCast(baseHandle);
 481           mPopup.SetTitle(CreateTitle("This is a Toast Popup.\nIt will auto-hide itself"));
 482
 483           mApplication.GetWindow().Add(mPopup);
 484           mPopup.SetDisplayState(Toolkit::Popup::SHOWN);
 485         }
 486       }
 487     }
 488     else if(button.GetProperty<std::string>(Dali::Actor::Property::NAME) == POPUP_BUTTON_TITLE_CONTENT_BUTTONS_ID)
 489     {
 490       mPopup = CreateConfirmationPopup(2);
 491       mPopup.SetTitle(CreateTitle("Erase image"));
 492
 493       Toolkit::TextLabel text = Toolkit::TextLabel::New("This will erase the image permanently. Are you sure?");
 494       text.SetProperty(Dali::Actor::Property::NAME, "POPUP_CONTENT_TEXT");
 495       text.SetProperty(Toolkit::TextLabel::Property::TEXT_COLOR, Color::WHITE);
 496       text.SetResizePolicy(ResizePolicy::FILL_TO_PARENT, Dimension::WIDTH);
 497       text.SetResizePolicy(ResizePolicy::DIMENSION_DEPENDENCY, Dimension::HEIGHT);
 498       text.SetProperty(TextLabel::Property::MULTI_LINE, true);
 499       text.SetProperty(Actor::Property::PADDING, Padding(10.0f, 10.0f, 20.0f, 0.0f));
 500       mPopup.SetContent(text);
 501
 502       SetupPopup(mPopup, button);
 503     }
 504     else if(button.GetProperty<std::string>(Dali::Actor::Property::NAME) == POPUP_BUTTON_CONTENT_TEXT_ID)
 505     {
 506       mPopup = CreatePopup();
 507
 508       TextLabel text = TextLabel::New(CONTENT_TEXT);
 509       text.SetProperty(Dali::Actor::Property::NAME, "POPUP_CONTENT_TEXT");
 510       text.SetProperty(Toolkit::TextLabel::Property::TEXT_COLOR, Color::WHITE);
 511       text.SetProperty(TextLabel::Property::MULTI_LINE, true);
 512       text.SetProperty(TextLabel::Property::HORIZONTAL_ALIGNMENT, "CENTER");
 513       text.SetProperty(TextLabel::Property::VERTICAL_ALIGNMENT, "CENTER");
 514       text.SetResizePolicy(ResizePolicy::FILL_TO_PARENT, Dimension::WIDTH);
 515       text.SetResizePolicy(ResizePolicy::DIMENSION_DEPENDENCY, Dimension::HEIGHT);
 516       text.SetProperty(Actor::Property::PADDING, Padding(20.0f, 20.0f, 20.0f, 20.0f));
 517
 518       mPopup.Add(text);
 519
 520       SetupPopup(mPopup, button);
 521     }
 522     else if(button.GetProperty<std::string>(Dali::Actor::Property::NAME) == POPUP_BUTTON_CONTENT_IMAGE_ID)
 523     {
 524       mPopup                   = CreatePopup();
 525       Toolkit::ImageView image = Toolkit::ImageView::New(IMAGE2);
 526       image.SetResizePolicy(ResizePolicy::FILL_TO_PARENT, Dimension::WIDTH);
 527       image.SetResizePolicy(ResizePolicy::DIMENSION_DEPENDENCY, Dimension::HEIGHT);
 528       image.SetProperty(Actor::Property::PADDING, Padding(20.0f, 20.0f, 20.0f, 20.0f));
 529
 530       mPopup.Add(image);
 531
 532       SetupPopup(mPopup, button);
 533     }
 534     else if(button.GetProperty<std::string>(Dali::Actor::Property::NAME) == POPUP_BUTTON_TITLE_CONTENT_TEXT_ID)
 535     {
 536       mPopup = CreatePopup();
 537       mPopup.SetTitle(CreateTitle("Popup!"));
 538
 539       Toolkit::TextLabel text = Toolkit::TextLabel::New(CONTENT_TEXT);
 540       text.SetProperty(Dali::Actor::Property::NAME, "POPUP_CONTENT_TEXT");
 541       text.SetProperty(Toolkit::TextLabel::Property::TEXT_COLOR, Color::WHITE);
 542       text.SetProperty(TextLabel::Property::MULTI_LINE, true);
 543       text.SetResizePolicy(ResizePolicy::FILL_TO_PARENT, Dimension::WIDTH);
 544       text.SetResizePolicy(ResizePolicy::DIMENSION_DEPENDENCY, Dimension::HEIGHT);
 545       text.SetProperty(Actor::Property::PADDING, Padding(20.0f, 20.0f, 20.0f, 20.0f));
 546
 547       mPopup.Add(text);
 548
 549       SetupPopup(mPopup, button);
 550     }
 551     else if(button.GetProperty<std::string>(Dali::Actor::Property::NAME) == POPUP_BUTTON_FIXED_SIZE_ID)
 552     {
 553       mPopup = CreatePopup();
 554       mPopup.SetTitle(CreateTitle("Popup!"));
 555
 556       Toolkit::TextLabel text = Toolkit::TextLabel::New("Fixed size popup");
 557       text.SetProperty(Dali::Actor::Property::NAME, "POPUP_CONTENT_TEXT");
 558       text.SetProperty(Toolkit::TextLabel::Property::TEXT_COLOR, Color::WHITE);
 559       text.SetProperty(TextLabel::Property::MULTI_LINE, true);
 560       text.SetProperty(Actor::Property::PADDING, Padding(20.0f, 20.0f, 20.0f, 20.0f));
 561
 562       mPopup.Add(text);
 563
 564       // Fix the popup's size.
 565       mPopup.SetProperty(Actor::Property::SIZE, Vector2(240.0f, 400.0f));
 566       mPopup.SetResizePolicy(ResizePolicy::FIXED, Dimension::ALL_DIMENSIONS);
 567
 568       SetupPopup(mPopup, button);
 569     }
 570     else if(button.GetProperty<std::string>(Dali::Actor::Property::NAME) == POPUP_BUTTON_TITLE_LARGE_CONTENT_BUTTONS_ID)
 571     {
 572       mPopup = CreateConfirmationPopup(2);
 573       mPopup.SetTitle(CreateTitle("Popup!"));
 574
 575       Toolkit::TextLabel text = Toolkit::TextLabel::New(CONTENT_TEXT);
 576       text.SetProperty(Dali::Actor::Property::NAME, "POPUP_CONTENT_TEXT");
 577       text.SetProperty(Toolkit::TextLabel::Property::TEXT_COLOR, Color::WHITE);
 578       text.SetResizePolicy(ResizePolicy::FILL_TO_PARENT, Dimension::WIDTH);
 579       text.SetResizePolicy(ResizePolicy::DIMENSION_DEPENDENCY, Dimension::HEIGHT);
 580       text.SetProperty(TextLabel::Property::MULTI_LINE, true);
 581       text.SetProperty(Actor::Property::PADDING, Padding(10.0f, 10.0f, 20.0f, 0.0f));
 582
 583       mPopup.Add(text);
 584
 585       SetupPopup(mPopup, button);
 586     }
 587     else if(button.GetProperty<std::string>(Dali::Actor::Property::NAME) == POPUP_BUTTON_COMPLEX_ID)
 588     {
 589       mPopup = CreateConfirmationPopup(2);
 590       mPopup.SetTitle(CreateTitle("Warning"));
 591
 592       // Content
 593       Toolkit::TableView content = Toolkit::TableView::New(2, 2);
 594       content.SetProperty(Dali::Actor::Property::NAME, "COMPLEX_TABLEVIEW");
 595       content.SetResizePolicy(ResizePolicy::FILL_TO_PARENT, Dimension::WIDTH);
 596       content.SetResizePolicy(ResizePolicy::USE_NATURAL_SIZE, Dimension::HEIGHT);
 597       content.SetFitHeight(0);
 598       content.SetFitHeight(1);
 599       content.SetProperty(Actor::Property::PADDING, Padding(20.0f, 20.0f, 20.0f, 0.0f));
 600
 601       // Text
 602       {
 603         Toolkit::TextLabel text = Toolkit::TextLabel::New("Do you really want to quit?");
 604         text.SetProperty(Toolkit::TextLabel::Property::TEXT_COLOR, Color::WHITE);
 605         text.SetProperty(Toolkit::TextLabel::Property::MULTI_LINE, true);
 606         text.SetResizePolicy(ResizePolicy::FILL_TO_PARENT, Dimension::WIDTH);
 607         text.SetResizePolicy(ResizePolicy::DIMENSION_DEPENDENCY, Dimension::HEIGHT);
 608
 609         content.AddChild(text, Toolkit::TableView::CellPosition(0, 0));
 610       }
 611
 612       // Image
 613       {
 614         Toolkit::ImageView image = Toolkit::ImageView::New(IMAGE1);
 615         image.SetProperty(Dali::Actor::Property::NAME, "COMPLEX_IMAGE");
 616         image.SetResizePolicy(ResizePolicy::FILL_TO_PARENT, Dimension::WIDTH);
 617         image.SetResizePolicy(ResizePolicy::DIMENSION_DEPENDENCY, Dimension::HEIGHT);
 618         image.SetProperty(Actor::Property::PADDING, Padding(20.0f, 0.0f, 0.0f, 0.0f));
 619         content.AddChild(image, Toolkit::TableView::CellPosition(0, 1));
 620       }
 621
 622       // Text 2
 623       {
 624         Toolkit::TableView root = Toolkit::TableView::New(1, 2);
 625         root.SetResizePolicy(ResizePolicy::FILL_TO_PARENT, Dimension::WIDTH);
 626         root.SetResizePolicy(ResizePolicy::USE_NATURAL_SIZE, Dimension::HEIGHT);
 627         root.SetFitHeight(0);
 628         root.SetFitWidth(0);
 629         root.SetProperty(Actor::Property::PADDING, Padding(0.0f, 0.0f, 0.0f, 20.0f));
 630
 631         Toolkit::CheckBoxButton checkBox = Toolkit::CheckBoxButton::New();
 632         checkBox.SetProperty(Actor::Property::SIZE, Vector2(48, 48));
 633         root.AddChild(checkBox, Toolkit::TableView::CellPosition(0, 0));
 634
 635         Toolkit::TextLabel text = Toolkit::TextLabel::New("Don't show again");
 636         text.SetProperty(Toolkit::TextLabel::Property::TEXT_COLOR, Color::WHITE);
 637         Actor textActor = text;
 638         textActor.SetProperty(Actor::Property::PADDING, Padding(20.0f, 0.0f, 0.0f, 10.0f));
 639
 640         root.AddChild(text, Toolkit::TableView::CellPosition(0, 1));
 641
 642         content.AddChild(root, Toolkit::TableView::CellPosition(1, 0));
 643       }
 644
 645       mPopup.SetContent(content);
 646
 647       SetupPopup(mPopup, button);
 648     }
 649     else if(button.GetProperty<std::string>(Dali::Actor::Property::NAME) == POPUP_BUTTON_CUSTOM_STYLE)
 650     {
 651       mPopup = CreateConfirmationPopup(2);
 652
 653       Toolkit::TextLabel titleActor = Toolkit::TextLabel::New("Styled Popup");
 654       titleActor.SetProperty(Dali::Actor::Property::NAME, "titleActor");
 655       titleActor.SetProperty(Toolkit::TextLabel::Property::TEXT_COLOR, Color::RED);
 656       titleActor.SetProperty(Toolkit::TextLabel::Property::MULTI_LINE, true);
 657       titleActor.SetProperty(Toolkit::TextLabel::Property::HORIZONTAL_ALIGNMENT, "CENTER");
 658       mPopup.SetTitle(titleActor);
 659
 660       SetupPopup(mPopup, button);
 661
 662       mPopup.SetStyleName(CUSTOM_POPUP_STYLE_NAME);
 663     }
 664
 665     return true;
 666   }
 667
 668   void OnKeyEvent(const KeyEvent& event)
 669   {
 670     if(event.GetState() == KeyEvent::DOWN)
 671     {
 672       if(IsKey(event, Dali::DALI_KEY_ESCAPE) || IsKey(event, Dali::DALI_KEY_BACK))
 673       {
 674         // Exit application when click back or escape.
 675         mApplication.Quit();
 676       }
 677     }
 678   }
 679
 680 public: // From ItemFactory
 681   /**
 682    * @brief Return the number of items to display in the item view
 683    *
 684    * @return Return the number of items to display
 685    */
 686   virtual unsigned int GetNumberOfItems()
 687   {
 688     return POPUP_BUTTON_ITEMS_COUNT;
 689   }
 690
 691   /**
 692    * @brief Create a new item to populate the item view with
 693    *
 694    * @param[in] itemId The index of the item to create
 695    * @return Return the created actor for the given ID
 696    */
 697   virtual Actor NewItem(unsigned int itemId)
 698   {
 699     Toolkit::PushButton popupButton = Toolkit::PushButton::New();
 700     popupButton.SetProperty(Dali::Actor::Property::NAME, POPUP_BUTTON_ITEMS[itemId].name);
 701     popupButton.SetProperty(Toolkit::Button::Property::LABEL, POPUP_BUTTON_ITEMS[itemId].text);
 702     popupButton.SetResizePolicy(ResizePolicy::USE_NATURAL_SIZE, Dimension::ALL_DIMENSIONS);
 703
 704     popupButton.ClickedSignal().Connect(this, &PopupExample::OnButtonClicked);
 705
 706     return popupButton;
 707   }
 708
 709 private:
 710   Application&        mApplication;
 711   Toolkit::Control    mView;            ///< The View instance.
 712   Toolkit::ToolBar    mToolBar;         ///< The View's Toolbar.
 713   Toolkit::PushButton mContextButton;   ///< For toggling contextual mode.
 714   Toolkit::PushButton mAnimationButton; ///< For toggling the fade animation.
 715   Layer               mContentLayer;    ///< Content layer
 716
 717   Toolkit::TextLabel mTitleActor; ///< Title text
 718
 719   bool mContextual;    ///< True if currently using the contextual popup mode.
 720   bool mAnimationFade; ///< True if currently using the fade animation.
 721
 722   Toolkit::Popup mPopup; ///< The current example popup.
 723
 724   Toolkit::ItemView mItemView; ///< ItemView to hold test images
 725 };
 726
 727 int DALI_EXPORT_API main(int argc, char** argv)
 728 {
 729   Application  application = Application::New(&argc, &argv, DEMO_THEME_PATH);
 730   PopupExample test(application);
 731   application.MainLoop();
 732   return 0;
 733 }