2 * Copyright (c) 2018 Samsung Electronics Co., Ltd.
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
8 * http://www.apache.org/licenses/LICENSE-2.0
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.
19 #include "grid-example.h"
20 #include "layout-utilities.h"
21 #include <dali-toolkit/devel-api/visuals/image-visual-properties-devel.h>
22 #include <dali-toolkit/devel-api/visual-factory/visual-factory.h>
23 #include <dali-toolkit/devel-api/controls/control-devel.h>
24 #include <dali-toolkit/devel-api/layouting/absolute-layout.h>
25 #include <dali-toolkit/devel-api/layouting/grid.h>
28 using namespace Dali::Toolkit;
32 const char* const TITLE = "Grid Example";
34 // Helper function to create ImageViews with given filename and size.
35 void CreateChildImageView( ImageView& imageView, const char* filename, Size size )
37 imageView = ImageView::New();
38 Property::Map imagePropertyMap;
39 imagePropertyMap[ Toolkit::Visual::Property::TYPE ] = Toolkit::Visual::IMAGE;
40 imagePropertyMap[ Toolkit::ImageVisual::Property::URL ] = filename;
41 imagePropertyMap[ ImageVisual::Property::DESIRED_WIDTH ] = size.width;
42 imagePropertyMap[ ImageVisual::Property::DESIRED_HEIGHT ] = size.height;
43 imageView.SetProperty(Toolkit::ImageView::Property::IMAGE , imagePropertyMap );
44 imageView.SetName("ImageView");
45 imageView.SetAnchorPoint( AnchorPoint::TOP_LEFT );
46 imageView.SetResizePolicy( ResizePolicy::FIXED, Dimension::ALL_DIMENSIONS );
64 GridExample::GridExample()
69 void GridExample::Create()
71 // The Init signal is received once (only) during the Application lifetime
73 auto stage = Stage::GetCurrent();
75 // This layout will be the size of the stage but allow the Grid layout to be any size.
76 mRootLayoutControl = LayoutUtilities::CreateRootContainer();
77 stage.Add( mRootLayoutControl );
79 // Create a table view to show a pair of buttons above each image.
80 mGridContainer = Control::New();
82 // Create LinearLayout for this control.
83 auto gridLayout = Grid::New();
84 gridLayout.SetAnimateLayout(true);
85 gridLayout.SetNumberOfColumns( 2 );
86 DevelControl::SetLayout( mGridContainer, gridLayout );
87 mGridContainer.SetName("GridContainer");
88 mGridContainer.SetBackgroundColor( Color::WHITE );
89 mGridContainer.SetProperty( LayoutItem::ChildProperty::WIDTH_SPECIFICATION, ChildLayoutData::WRAP_CONTENT );
90 mGridContainer.SetProperty( LayoutItem::ChildProperty::HEIGHT_SPECIFICATION, ChildLayoutData::WRAP_CONTENT );
91 mGridContainer.SetProperty( Toolkit::Control::Property::PADDING, Extents( 20,20,20,20 ) );
92 mGridContainer.SetParentOrigin( ParentOrigin::CENTER );
94 mRootLayoutControl.Add( mGridContainer );
96 for( unsigned int x = 0; x < INITIAL_NUMBER_OF_IMAGE_VIEWS; x++ )
99 CreateChildImageView( imageView, DEMO_IMAGE_DIR "gallery-small-23.jpg" , Size(100.0f, 100.0f) );
100 mImageViews.push_back( imageView );
101 mGridContainer.Add( mImageViews[x] );
104 // Button toggles the size of the layout
105 mToggleButton = PushButton::New();
106 mToggleButton.SetProperty( Toolkit::Button::Property::LABEL, "Set Width 300" );
107 mToggleButton.SetParentOrigin( ParentOrigin::BOTTOM_CENTER );
108 mToggleButton.SetAnchorPoint( AnchorPoint::BOTTOM_CENTER );
109 mToggleButton.ClickedSignal().Connect( this, &Demo::GridExample::ToggleButtonClicked );
110 mToggleButton.SetResizePolicy( ResizePolicy::FILL_TO_PARENT, Dimension::WIDTH );
111 mToggleButton.SetResizePolicy( ResizePolicy::USE_NATURAL_SIZE, Dimension::HEIGHT );
113 stage.Add( mToggleButton );
116 void GridExample::Remove()
119 UnparentAndReset( mGridContainer );
120 UnparentAndReset( mRootLayoutControl );
121 UnparentAndReset( mToggleButton );
124 void GridExample::ChangeTo3Columns()
126 Grid gridLayout = Grid::DownCast( DevelControl::GetLayout(mGridContainer) );
129 gridLayout.SetNumberOfColumns( 3 );
133 void GridExample::AddItemsInteractively()
135 if( mImageViews.size() < MAX_NUMBER_OF_IMAGE_VIEWS )
138 CreateChildImageView( imageView, DEMO_IMAGE_DIR "gallery-small-23.jpg" , Size(100.0f, 100.0f) );
139 mImageViews.push_back( imageView );
140 mGridContainer.Add( imageView);
142 // Add item button shows how many items left to add.
143 unsigned int numberOfAdditonalImageViews = MAX_NUMBER_OF_IMAGE_VIEWS-INITIAL_NUMBER_OF_IMAGE_VIEWS;
144 unsigned int remainingImageViews = numberOfAdditonalImageViews - ( ( mImageViews.size() - INITIAL_NUMBER_OF_IMAGE_VIEWS) );
145 std::string buttonLabel( "Add item["+ std::to_string( numberOfAdditonalImageViews-remainingImageViews ) +"/"+
146 std::to_string( numberOfAdditonalImageViews)+"]" );
147 mToggleButton.SetProperty( Toolkit::Button::Property::LABEL, buttonLabel );
151 void GridExample::AddMarginToItems()
153 for( unsigned int x = 0; x < INITIAL_NUMBER_OF_IMAGE_VIEWS; x++ )
155 mImageViews[x].SetProperty(Toolkit::Control::Property::MARGIN, Extents( 20,20,20,10));
159 void GridExample::RemoveMarginsFromItems()
161 for( unsigned int x = 0; x < INITIAL_NUMBER_OF_IMAGE_VIEWS; x++ )
163 mImageViews[x].SetProperty(Toolkit::Control::Property::MARGIN, Extents());
167 void GridExample::MatchParentOnWidth()
169 mGridContainer.SetProperty( LayoutItem::ChildProperty::WIDTH_SPECIFICATION,ChildLayoutData::MATCH_PARENT );
172 void GridExample::WrapContentOnWidth()
174 mGridContainer.SetProperty( LayoutItem::ChildProperty::WIDTH_SPECIFICATION, ChildLayoutData::WRAP_CONTENT );
177 void GridExample::SetExactWidth()
179 mGridContainer.SetProperty( LayoutItem::ChildProperty::WIDTH_SPECIFICATION, 300 );
182 bool GridExample::ToggleButtonClicked( Toolkit::Button button )
184 switch( mToggleStatus )
186 case GRID_EXACT_WIDTH :
189 mToggleButton.SetProperty( Toolkit::Button::Property::LABEL, "Set Child Margin" );
190 mToggleStatus = ITEMS_WITH_MARGINS;
193 case ITEMS_WITH_MARGINS :
196 mToggleStatus = GRID_MATCH_PARENT;
197 mToggleButton.SetProperty( Toolkit::Button::Property::LABEL, "Set width MATCH_PARENT" );
200 case GRID_MATCH_PARENT :
202 RemoveMarginsFromItems();
203 MatchParentOnWidth();
204 mToggleButton.SetProperty( Toolkit::Button::Property::LABEL, "Set width WRAP_CONTENT" );
205 mToggleStatus = GRID_WRAP_CONTENT;
208 case GRID_WRAP_CONTENT :
210 WrapContentOnWidth();
211 mToggleButton.SetProperty( Toolkit::Button::Property::LABEL, "Add item" );
212 mToggleStatus = ADD_ITEMS;
217 if( mGridContainer.GetChildCount() < MAX_NUMBER_OF_IMAGE_VIEWS )
219 AddItemsInteractively();
222 if( mGridContainer.GetChildCount() == MAX_NUMBER_OF_IMAGE_VIEWS )
224 // Remove button when no more items to add
225 mToggleStatus= CHANGE_TO_3_COLUMNS;
226 mToggleButton.SetProperty( Toolkit::Button::Property::LABEL, "Change Columns" );
230 case CHANGE_TO_3_COLUMNS :
233 mToggleStatus = GRID_EXACT_WIDTH;
234 UnparentAndReset( mToggleButton );
239 mToggleStatus = GRID_EXACT_WIDTH;