examples/clipping-draw-order/clipping-draw-order.cpp

   1 /*
   2  * Copyright (c) 2017 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
  20 using namespace Dali;
  21 using namespace Dali::Toolkit;
  22
  23 const char* images[] = {
  24     DEMO_IMAGE_DIR "gallery-small-1.jpg",
  25     DEMO_IMAGE_DIR "gallery-small-2.jpg",
  26     DEMO_IMAGE_DIR "gallery-small-3.jpg",
  27     DEMO_IMAGE_DIR "gallery-small-4.jpg",
  28     DEMO_IMAGE_DIR "gallery-small-5.jpg"
  29 };
  30
  31 // This verification example confirms drawing order is the same, with or without clipping enabled.
  32 class ClippingDrawOrderVerification : public ConnectionTracker
  33 {
  34 public:
  35
  36   ClippingDrawOrderVerification( Application& application )
  37   : mApplication( application )
  38   {
  39     // Connect to the Application's Init signal.
  40     mApplication.InitSignal().Connect( this, &ClippingDrawOrderVerification::Create );
  41   }
  42
  43   ~ClippingDrawOrderVerification()
  44   {
  45     // Nothing to do here.
  46   }
  47
  48   // The Init signal is received once (only) during the Application lifetime.
  49   void Create( Application& application )
  50   {
  51     // Get a handle to the stage
  52     Stage stage = Stage::GetCurrent();
  53     stage.SetBackgroundColor( Color::WHITE );
  54
  55     // Connect to the stage's key signal to allow Back and Escape to exit.
  56     stage.KeyEventSignal().Connect( this, &ClippingDrawOrderVerification::OnKeyEvent );
  57
  58     // Create the title label.
  59     TextLabel title = TextLabel::New( "Clipping draw order verification" );
  60     title.SetProperty( TextLabel::Property::HORIZONTAL_ALIGNMENT, "CENTER" );
  61     title.SetProperty( TextLabel::Property::VERTICAL_ALIGNMENT, "CENTER" );
  62     title.SetAnchorPoint( AnchorPoint::CENTER );
  63     title.SetParentOrigin( ParentOrigin::CENTER );
  64
  65     // Create the description label.
  66     TextLabel description = TextLabel::New( "The bottom tree should have the same draw order as the top tree.\nThey should look identical except \"C\" is clipped on the bottom tree." );
  67     description.SetProperty( TextLabel::Property::HORIZONTAL_ALIGNMENT, "CENTER" );
  68     description.SetProperty( TextLabel::Property::MULTI_LINE, true );
  69     description.SetAnchorPoint( AnchorPoint::BOTTOM_CENTER );
  70     description.SetParentOrigin( Vector3( 0.5f, 1.0f, 0.5f ) );
  71     stage.Add( description );
  72
  73     /*
  74      * Create a 4-row TableView.
  75      * It will be segmented as follows:
  76      *
  77      *    +---------------+
  78      *    |     Title     |
  79      *    +---------------+
  80      *    |     Tree      |
  81      *    |    Without    |
  82      *    |   Clipping    |
  83      *    +---------------+
  84      *    |     Tree      |
  85      *    |     With      |
  86      *    |   Clipping    |
  87      *    +---------------+
  88      *    |  Explanation  |
  89      *    +---------------+
  90      */
  91     TableView view = TableView::New( 4, 1 );
  92     view.SetAnchorPoint( AnchorPoint::CENTER );
  93     view.SetParentOrigin( ParentOrigin::CENTER );
  94     view.SetResizePolicy( ResizePolicy::FILL_TO_PARENT, Dimension::ALL_DIMENSIONS );
  95
  96     view.SetCellAlignment( Toolkit::TableView::CellPosition( 0, 0 ), HorizontalAlignment::CENTER, VerticalAlignment::CENTER );
  97     view.SetCellAlignment( Toolkit::TableView::CellPosition( 1, 0 ), HorizontalAlignment::CENTER, VerticalAlignment::CENTER );
  98     view.SetCellAlignment( Toolkit::TableView::CellPosition( 2, 0 ), HorizontalAlignment::CENTER, VerticalAlignment::CENTER );
  99     view.SetCellAlignment( Toolkit::TableView::CellPosition( 3, 0 ), HorizontalAlignment::CENTER, VerticalAlignment::CENTER );
 100
 101     view.SetCellPadding( Vector2( 14.0f, 7.0f ) );
 102
 103     view.SetRelativeWidth( 0u, 1.0f );
 104
 105     view.SetFitHeight( 0u );
 106     view.SetRelativeHeight( 1u, 0.5f );
 107     view.SetRelativeHeight( 2u, 0.5f );
 108     view.SetFitHeight( 3u );
 109
 110     // Add the title and description to the TableView.
 111     view.AddChild( title, TableView::CellPosition( 0u, 0u ) );
 112     view.AddChild( description, TableView::CellPosition( 3u, 0u ) );
 113
 114     /*
 115        For each of the 2 tree views, we create a small tree of actors as follows:
 116        ( Note: Clipping is only enabled for B on the bottom tree ).
 117
 118                              A
 119                             / \
 120        Clipping enabled -> B   D
 121                            |   |
 122                            C   E
 123
 124        The correct draw order is "ABCDE" (the same as if clipping was not enabled).
 125     */
 126     const float treeYStart = 0.12f;
 127     const float depthGap = 0.35f;
 128
 129     for( int tree = 0; tree < 2; ++tree )
 130     {
 131       Control container = Control::New();
 132       container.SetAnchorPoint( AnchorPoint::TOP_CENTER );
 133       container.SetParentOrigin( ParentOrigin::TOP_CENTER );
 134       container.SetResizePolicy( ResizePolicy::FILL_TO_PARENT, Dimension::ALL_DIMENSIONS );
 135       Vector4 backgroundColor = tree == 0 ? Vector4( 0.77f, 1.0f, 0.77f, 1.0f ) : Vector4( 0.8f, 0.8f, 1.0f, 1.0f );
 136       container.SetProperty( Control::Property::BACKGROUND, backgroundColor );
 137       ImageView image[5];
 138
 139       // Loop for each of the 5 images & labels.
 140       for( int i = 0; i < 5; ++i )
 141       {
 142         std::stringstream labelStream;
 143         labelStream << static_cast<char>( static_cast<char>( i ) + 'A' );
 144         TextLabel textLabel = TextLabel::New( labelStream.str() );
 145         textLabel.SetAnchorPoint( AnchorPoint::TOP_CENTER );
 146
 147         image[i] = ImageView::New( images[i] );
 148         image[i].SetAnchorPoint( AnchorPoint::TOP_CENTER );
 149
 150         // Calculate the relative positioning for the images and labels.
 151         float depth = static_cast<float>( i == 0 ? 0 : ( ( i - 1 ) % 2 ) + 1 );
 152
 153         if( i == 0 )
 154         {
 155           image[i].SetParentOrigin( Vector3( 0.5f, treeYStart, 0.5f ) );
 156           textLabel.SetParentOrigin( Vector3( 1.0f, 0.05f * depth, 0.5f ) );
 157         }
 158         else
 159         {
 160           float b = i > 2 ? 1.0f : -1.0f;
 161           image[i].SetParentOrigin( Vector3( 0.5f + ( 0.2f * b ), depthGap, 0.5f ) );
 162           textLabel.SetParentOrigin( Vector3( 0.98f + 0.215f * b + ( 0.04f * b * depth ), treeYStart + 0.02f + ( 0.16f * depth ), 0.5f ) );
 163         }
 164
 165         container.Add( textLabel );
 166       }
 167
 168       // Create the title label.
 169       std::string treeText = tree == 0 ? "Without Clipping" : "With Clipping";
 170       TextLabel treeLabel = TextLabel::New( treeText );
 171       treeLabel.SetProperty( TextLabel::Property::HORIZONTAL_ALIGNMENT, "CENTER" );
 172       treeLabel.SetProperty( TextLabel::Property::VERTICAL_ALIGNMENT, "BOTTOM" );
 173       treeLabel.SetAnchorPoint( AnchorPoint::BOTTOM_CENTER );
 174       treeLabel.SetParentOrigin( ParentOrigin::BOTTOM_CENTER );
 175       container.Add( treeLabel );
 176
 177       // Enable clipping for the 2nd tree.
 178       if( tree == 1 )
 179       {
 180         image[1].SetProperty( Actor::Property::CLIPPING_MODE, ClippingMode::CLIP_CHILDREN );
 181       }
 182
 183       // Build the tree structure.
 184       container.Add( image[0] );
 185
 186       image[0].Add( image[1] );
 187       image[1].Add( image[2] );
 188
 189       image[0].Add( image[3] );
 190       image[3].Add( image[4] );
 191
 192       // Add the finished tree to the TableView.
 193       view.AddChild( container, TableView::CellPosition( 1u + tree, 0u ) );
 194     }
 195
 196     // Add the finished TableView to the stage.
 197     stage.Add( view );
 198
 199     // Respond to a click anywhere on the stage
 200     stage.GetRootLayer().TouchSignal().Connect( this, &ClippingDrawOrderVerification::OnTouch );
 201   }
 202
 203   bool OnTouch( Actor actor, const TouchData& touch )
 204   {
 205     // Quit the application.
 206     mApplication.Quit();
 207     return true;
 208   }
 209
 210   /**
 211    * @brief Called when any key event is received
 212    *
 213    * Will use this to quit the application if Back or the Escape key is received
 214    * @param[in] event The key event information
 215    */
 216   void OnKeyEvent( const KeyEvent& event )
 217   {
 218     if( event.state == KeyEvent::Down )
 219     {
 220       if( IsKey( event, DALI_KEY_ESCAPE) || IsKey( event, DALI_KEY_BACK ) )
 221       {
 222         mApplication.Quit();
 223       }
 224     }
 225   }
 226
 227 private:
 228   Application&  mApplication;
 229 };
 230
 231 int DALI_EXPORT_API main( int argc, char **argv )
 232 {
 233   Application application = Application::New( &argc, &argv );
 234   ClippingDrawOrderVerification verification( application );
 235   application.MainLoop();
 236   return 0;
 237 }