GridLayout example
[platform/core/uifw/dali-demo.git] / examples / layouting / linear-example.cpp
1 /*
2  * Copyright (c) 2018 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 <string>
19 #include "linear-example.h"
20 #include <dali-toolkit/devel-api/visuals/image-visual-properties-devel.h>
21 #include <dali-toolkit/devel-api/visual-factory/visual-factory.h>
22 #include <dali-toolkit/devel-api/controls/control-devel.h>
23 #include <dali-toolkit/devel-api/layouting/linear-layout.h>
24
25 using namespace Dali;
26 using namespace Dali::Toolkit;
27
28 namespace
29 {
30 const char* const TITLE = "Linear Example";
31
32 // Button file names
33 const char* LTR_IMAGE( DEMO_IMAGE_DIR "icon-play.png" );
34 const char* LTR_SELECTED_IMAGE( DEMO_IMAGE_DIR "icon-play-selected.png" );
35
36 const char* RTL_IMAGE( DEMO_IMAGE_DIR "icon-reverse.png" );
37 const char* RTL_SELECTED_IMAGE( DEMO_IMAGE_DIR "icon-reverse-selected.png" );
38
39 const char* ROTATE_CLOCKWISE_IMAGE( DEMO_IMAGE_DIR "icon-reset.png" );
40 const char* ROTATE_CLOCKWISE_SELECTED_IMAGE( DEMO_IMAGE_DIR "icon-reset-selected.png" );
41
42 // Child image filenames
43 const char* IMAGE_PATH[] = {
44   DEMO_IMAGE_DIR "application-icon-101.png",
45   DEMO_IMAGE_DIR "application-icon-102.png",
46   DEMO_IMAGE_DIR "application-icon-103.png",
47   DEMO_IMAGE_DIR "application-icon-104.png"
48 };
49
50 const unsigned int NUMBER_OF_RESOURCES = sizeof(IMAGE_PATH) / sizeof(char*);
51
52 // Helper function to create ImageViews with given filename and size.
53 void CreateChildImageView( ImageView& imageView, const char* filename, Size size )
54 {
55   imageView = ImageView::New();
56   Property::Map imagePropertyMap;
57   imagePropertyMap[ Toolkit::Visual::Property::TYPE ] = Toolkit::Visual::IMAGE;
58   imagePropertyMap[ Toolkit::ImageVisual::Property::URL ] = filename;
59   imagePropertyMap[ ImageVisual::Property::DESIRED_WIDTH ] = size.width;
60   imagePropertyMap[ ImageVisual::Property::DESIRED_HEIGHT ] = size.height;
61   imageView.SetProperty(Toolkit::ImageView::Property::IMAGE , imagePropertyMap );
62   imageView.SetName("ImageView");
63   imageView.SetAnchorPoint( AnchorPoint::TOP_LEFT );
64   imageView.SetResizePolicy( ResizePolicy::FIXED, Dimension::ALL_DIMENSIONS );
65 }
66
67 }  // namespace
68
69 namespace Demo
70 {
71
72 LinearExample::LinearExample()
73 : Example( TITLE ),
74   mLTRDirection(true)
75 {
76 }
77
78 void LinearExample::Create()
79 {
80   auto stage = Stage::GetCurrent();
81
82   mDirectionButton = PushButton::New();
83   mDirectionButton.SetProperty( PushButton::Property::UNSELECTED_ICON, RTL_IMAGE );
84   mDirectionButton.SetProperty( PushButton::Property::SELECTED_ICON, RTL_SELECTED_IMAGE );
85   mDirectionButton.ClickedSignal().Connect( this, &LinearExample::OnDirectionClicked );
86   mDirectionButton.SetParentOrigin( Vector3(0.33f, 1.0f, 0.5f ) );
87   mDirectionButton.SetAnchorPoint( AnchorPoint::BOTTOM_CENTER );
88   mDirectionButton.SetSize(75, 75);
89   stage.Add( mDirectionButton );
90
91   mRotateButton = PushButton::New();
92   mRotateButton.SetProperty( PushButton::Property::UNSELECTED_ICON, ROTATE_CLOCKWISE_IMAGE );
93   mRotateButton.SetProperty( PushButton::Property::SELECTED_ICON, ROTATE_CLOCKWISE_SELECTED_IMAGE );
94   mRotateButton.ClickedSignal().Connect( this, &LinearExample::OnRotateClicked );
95   mRotateButton.SetParentOrigin( Vector3(0.66f, 1.0f, 0.5f ));
96   mRotateButton.SetAnchorPoint( Vector3(0.5f, 1.0f, 0.5f));
97   mRotateButton.SetSize(75, 75);
98   stage.Add( mRotateButton );
99
100   // Create a linear layout
101   mLinearContainer = Control::New();
102   auto layout = LinearLayout::New();
103   layout.SetAnimateLayout(true);
104   layout.SetOrientation( LinearLayout::Orientation::VERTICAL );
105   DevelControl::SetLayout( mLinearContainer, layout );
106
107   mLinearContainer.SetParentOrigin( ParentOrigin::CENTER );
108   mLinearContainer.SetAnchorPoint( AnchorPoint::CENTER );
109   mLinearContainer.SetName( "LinearExample" );
110   stage.Add( mLinearContainer );
111   mLinearContainer.SetProperty( Toolkit::LayoutItem::ChildProperty::WIDTH_SPECIFICATION, ChildLayoutData::MATCH_PARENT );
112   mLinearContainer.SetProperty( Toolkit::LayoutItem::ChildProperty::HEIGHT_SPECIFICATION, ChildLayoutData::MATCH_PARENT );
113   mLinearContainer.SetProperty( Actor::Property::LAYOUT_DIRECTION, LayoutDirection::LEFT_TO_RIGHT );
114
115   for( unsigned int x = 0; x < NUMBER_OF_RESOURCES; ++x )
116   {
117     Toolkit::ImageView imageView;
118     CreateChildImageView( imageView, IMAGE_PATH[ x ], Size(100.0f, 100.0f) );
119     mLinearContainer.Add( imageView );
120   }
121 }
122
123 // Remove controls added by this example from stage
124 void LinearExample::Remove()
125 {
126   if ( mLinearContainer )
127   {
128     UnparentAndReset( mDirectionButton );
129     UnparentAndReset( mRotateButton );
130     UnparentAndReset( mLinearContainer);
131   }
132 }
133
134 // Mirror items in layout
135 bool LinearExample::OnDirectionClicked( Button button )
136 {
137   if( !mLTRDirection )
138   {
139     mDirectionButton.SetProperty( PushButton::Property::UNSELECTED_ICON, LTR_IMAGE );
140     mDirectionButton.SetProperty( PushButton::Property::SELECTED_ICON, LTR_SELECTED_IMAGE );
141     mLinearContainer.SetProperty( Actor::Property::LAYOUT_DIRECTION, LayoutDirection::LEFT_TO_RIGHT );
142   }
143   else
144   {
145     mDirectionButton.SetProperty( PushButton::Property::UNSELECTED_ICON, RTL_IMAGE );
146     mDirectionButton.SetProperty( PushButton::Property::SELECTED_ICON, RTL_SELECTED_IMAGE );
147     mLinearContainer.SetProperty( Actor::Property::LAYOUT_DIRECTION, LayoutDirection::RIGHT_TO_LEFT );
148   }
149   mLTRDirection = !mLTRDirection;
150   return true;
151 }
152
153 // Rotate layout by changing layout
154 bool LinearExample::OnRotateClicked( Button button )
155 {
156   auto layout = LinearLayout::DownCast( DevelControl::GetLayout( mLinearContainer ) );
157   if( layout.GetOrientation() == LinearLayout::Orientation::VERTICAL )
158   {
159     layout.SetOrientation( LinearLayout::Orientation::HORIZONTAL );
160   }
161   else
162   {
163     layout.SetOrientation( LinearLayout::Orientation::VERTICAL );
164   }
165   return true;
166 }
167
168 } // namespace Demo