2 * Copyright (c) 2014 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.
18 #include "../shared/view.h"
19 #include <dali/dali.h>
20 #include <dali-toolkit/dali-toolkit.h>
26 // Used to produce visually same dimensions on desktop and device builds
27 float ScalePointSize( int pointSize )
29 Dali::Vector2 dpi = Dali::Stage::GetCurrent().GetDpi();
30 float meanDpi = (dpi.height + dpi.width) * 0.5f;
31 return pointSize * meanDpi / 220.0f;
36 // Define this so that it is interchangeable
37 // "DP" stands for Device independent Pixels
38 #define DP(x) ScalePointSize(x)
44 const char* const BACKGROUND_IMAGE = DALI_IMAGE_DIR "background-gradient.jpg";
45 const char* const TOOLBAR_IMAGE = DALI_IMAGE_DIR "top-bar.png";
47 const char* const TOOLBAR_TITLE = "Buttons";
49 const char* const SMALL_IMAGE_1 = DALI_IMAGE_DIR "gallery-small-14.jpg";
50 const char* const BIG_IMAGE_1 = DALI_IMAGE_DIR "gallery-large-4.jpg";
52 const char* const SMALL_IMAGE_2 = DALI_IMAGE_DIR "gallery-small-20.jpg";
53 const char* const BIG_IMAGE_2 = DALI_IMAGE_DIR "gallery-large-11.jpg";
55 const char* const SMALL_IMAGE_3 = DALI_IMAGE_DIR "gallery-small-25.jpg";
56 const char* const BIG_IMAGE_3 = DALI_IMAGE_DIR "gallery-large-13.jpg";
58 const char* const ENABLED_IMAGE = DALI_IMAGE_DIR "item-select-check.png";
60 const char* const PUSHBUTTON_PRESS_IMAGE = DALI_IMAGE_DIR "button-down.9.png";
61 const char* const PUSHBUTTON_DIM_IMAGE = DALI_IMAGE_DIR "button-disabled.9.png";
62 const char* const PUSHBUTTON_BUTTON_IMAGE = DALI_IMAGE_DIR "button-up.9.png";
64 const char* const CHECKBOX_UNCHECKED_IMAGE = DALI_IMAGE_DIR "checkbox-unchecked.png";
65 const char* const CHECKBOX_CHECKED_IMAGE = DALI_IMAGE_DIR "checkbox-checked.png";
67 const Vector4 BACKGROUND_COLOUR( 1.0f, 1.0f, 1.0f, 0.15f );
70 const int RADIO_LABEL_THUMBNAIL_SIZE = 48;
71 const int RADIO_IMAGE_SPACING = 8;
72 const int BUTTON_HEIGHT = 48;
74 const int MARGIN_SIZE = 10;
75 const int TOP_MARGIN = 85;
76 const int GROUP2_HEIGHT = 238;
77 const int GROUP1_HEIGHT = 120;
78 const int GROUP3_HEIGHT = 190;
79 const int GROUP4_HEIGHT = BUTTON_HEIGHT + MARGIN_SIZE * 2;
83 /** This example shows how to create and use different buttons.
85 * 1. First group of radio buttons with image actor labels selects an image to load
86 * 2. A push button loads the selected thumbnail image into the larger image pane
87 * 3. Second group of radio buttons with a table view label containing a text view and image view, and a normal text view.
88 * Selecting one of these will enable/disable the image loading push button
89 * 4. A group of check boxes
91 class ButtonsController: public ConnectionTracker
95 ButtonsController( Application& application )
96 : mApplication( application )
98 // Connect to the Application's Init signal
99 mApplication.InitSignal().Connect( this, &ButtonsController::Create );
104 // Nothing to do here
107 void Create( Application& application )
109 // The Init signal is received once (only) during the Application lifetime
111 // Respond to key events
112 Stage::GetCurrent().KeyEventSignal().Connect(this, &ButtonsController::OnKeyEvent);
114 // Creates a default view with a default tool bar.
115 // The view is added to the stage.
116 mContentLayer = DemoHelper::CreateView( application,
123 int yPos = TOP_MARGIN + MARGIN_SIZE;
125 // Image selector radio group
126 Actor radioGroup2Background = Toolkit::CreateSolidColorActor( BACKGROUND_COLOUR );
127 radioGroup2Background.SetAnchorPoint( AnchorPoint::TOP_LEFT );
128 radioGroup2Background.SetParentOrigin( ParentOrigin::TOP_LEFT );
129 radioGroup2Background.SetPosition( DP(MARGIN_SIZE), DP(yPos) );
130 radioGroup2Background.SetSize( DP(348), DP(GROUP2_HEIGHT) );
131 mContentLayer.Add( radioGroup2Background );
133 Actor radioButtonsGroup2 = Actor::New();
134 radioButtonsGroup2.SetParentOrigin( ParentOrigin::TOP_LEFT );
135 radioButtonsGroup2.SetAnchorPoint( AnchorPoint::TOP_LEFT );
136 radioButtonsGroup2.SetPosition( DP(MARGIN_SIZE), DP(MARGIN_SIZE) );
137 radioButtonsGroup2.SetSize( DP(100), DP(160) );
139 radioGroup2Background.Add( radioButtonsGroup2 );
145 ImageActor imageActor = ImageActor::New( Image::New( SMALL_IMAGE_1 ) );
146 imageActor.SetSize( DP(RADIO_LABEL_THUMBNAIL_SIZE), DP(RADIO_LABEL_THUMBNAIL_SIZE) );
147 mRadioButtonImage1 = Dali::Toolkit::RadioButton::New( imageActor );
148 mRadioButtonImage1.SetParentOrigin( ParentOrigin::TOP_LEFT );
149 mRadioButtonImage1.SetAnchorPoint( AnchorPoint::TOP_LEFT );
150 mRadioButtonImage1.SetPosition( 0, DP(radioY) );
151 mRadioButtonImage1.SetActive( true );
153 radioButtonsGroup2.Add( mRadioButtonImage1 );
158 radioY += RADIO_LABEL_THUMBNAIL_SIZE + RADIO_IMAGE_SPACING;
160 ImageActor imageActor = ImageActor::New( Image::New( SMALL_IMAGE_2 ) );
161 imageActor.SetSize( DP(RADIO_LABEL_THUMBNAIL_SIZE), DP(RADIO_LABEL_THUMBNAIL_SIZE) );
163 mRadioButtonImage2 = Dali::Toolkit::RadioButton::New( imageActor );
164 mRadioButtonImage2.SetParentOrigin( ParentOrigin::TOP_LEFT );
165 mRadioButtonImage2.SetAnchorPoint( AnchorPoint::TOP_LEFT );
166 mRadioButtonImage2.SetPosition( 0, DP(radioY) );
168 radioButtonsGroup2.Add( mRadioButtonImage2 );
173 radioY += RADIO_LABEL_THUMBNAIL_SIZE + RADIO_IMAGE_SPACING;
175 ImageActor imageActor = ImageActor::New( Image::New( SMALL_IMAGE_3 ) );
176 imageActor.SetSize( DP(RADIO_LABEL_THUMBNAIL_SIZE), DP(RADIO_LABEL_THUMBNAIL_SIZE) );
178 mRadioButtonImage3 = Dali::Toolkit::RadioButton::New( imageActor );
179 mRadioButtonImage3.SetParentOrigin( ParentOrigin::TOP_LEFT );
180 mRadioButtonImage3.SetAnchorPoint( AnchorPoint::TOP_LEFT );
181 mRadioButtonImage3.SetPosition( 0, DP(radioY) );
183 radioButtonsGroup2.Add( mRadioButtonImage3 );
186 // Create select button
187 mUpdateButton = Toolkit::PushButton::New();
188 mUpdateButton.SetParentOrigin( ParentOrigin::BOTTOM_CENTER );
189 mUpdateButton.SetAnchorPoint( AnchorPoint::TOP_CENTER );
190 mUpdateButton.SetPosition( 0, DP(MARGIN_SIZE) );
191 mUpdateButton.SetLabelText("Select");
192 mUpdateButton.SetSize( DP(100), DP(BUTTON_HEIGHT) );
194 mUpdateButton.SetPressedImage( Dali::Image::New( PUSHBUTTON_PRESS_IMAGE ) );
195 mUpdateButton.SetDimmedImage( Dali::Image::New( PUSHBUTTON_DIM_IMAGE ) );
196 mUpdateButton.SetButtonImage( Dali::Image::New( PUSHBUTTON_BUTTON_IMAGE ) );
198 mUpdateButton.ClickedSignal().Connect( this, &ButtonsController::OnButtonClicked );
200 radioButtonsGroup2.Add(mUpdateButton);
202 // ImageActor to display selected image
203 mBigImage1 = Image::New( BIG_IMAGE_1 );
204 mBigImage2 = Image::New( BIG_IMAGE_2 );
205 mBigImage3 = Image::New( BIG_IMAGE_3 );
207 mImage = ImageActor::New( mBigImage1 );
208 mImage.SetParentOrigin( ParentOrigin::TOP_RIGHT );
209 mImage.SetAnchorPoint( AnchorPoint::TOP_LEFT );
210 mImage.SetPosition( DP(MARGIN_SIZE), 0 );
211 mImage.SetSize( DP(218), DP(218) );
212 radioButtonsGroup2.Add( mImage );
214 // The enable/disable radio group
215 yPos += GROUP2_HEIGHT + MARGIN_SIZE;
217 Actor radioGroup1Background = Toolkit::CreateSolidColorActor( BACKGROUND_COLOUR );
218 radioGroup1Background.SetAnchorPoint( AnchorPoint::TOP_LEFT );
219 radioGroup1Background.SetParentOrigin( ParentOrigin::TOP_LEFT );
220 radioGroup1Background.SetPosition( DP(MARGIN_SIZE), DP(yPos) );
221 radioGroup1Background.SetSize( DP(348), DP(GROUP1_HEIGHT) );
222 mContentLayer.Add( radioGroup1Background );
225 Actor radioButtonsGroup1 = Actor::New();
226 radioButtonsGroup1.SetParentOrigin( ParentOrigin::TOP_LEFT );
227 radioButtonsGroup1.SetAnchorPoint( AnchorPoint::TOP_LEFT );
228 radioButtonsGroup1.SetPosition( DP(MARGIN_SIZE), DP(MARGIN_SIZE) );
230 radioGroup1Background.Add( radioButtonsGroup1 );
232 // First radio button
234 Toolkit::TableView tableView = Toolkit::TableView::New( 1, 2 );
235 tableView.SetSize( DP(260), DP(RADIO_LABEL_THUMBNAIL_SIZE) );
237 Toolkit::TextView textView = Toolkit::TextView::New( "Select enabled" );
238 Toolkit::Alignment alignment = Toolkit::Alignment::New( Toolkit::Alignment::HorizontalLeft );
239 alignment.Add( textView );
240 tableView.AddChild( alignment, Toolkit::TableView::CellPosition( 0, 0 ) );
242 ImageActor imageActor = ImageActor::New( Image::New( ENABLED_IMAGE ) );
243 imageActor.SetSize( DP(RADIO_LABEL_THUMBNAIL_SIZE), DP(RADIO_LABEL_THUMBNAIL_SIZE) );
244 tableView.AddChild( imageActor, Toolkit::TableView::CellPosition( 0, 1 ) );
245 tableView.SetFixedWidth( 1, DP(RADIO_LABEL_THUMBNAIL_SIZE) );
247 Toolkit::RadioButton radioButton = Dali::Toolkit::RadioButton::New( tableView );
248 radioButton.SetName( "radio-select-enable" );
249 radioButton.SetParentOrigin( ParentOrigin::TOP_LEFT );
250 radioButton.SetAnchorPoint( AnchorPoint::TOP_LEFT );
251 radioButton.SetPosition( 0, 0 );
252 radioButton.SetActive( true );
254 radioButton.ToggledSignal().Connect( this, &ButtonsController::EnableSelectButtonToggle );
256 radioButtonsGroup1.Add( radioButton );
259 // Second radio button
261 Toolkit::RadioButton radioButton = Dali::Toolkit::RadioButton::New( "Select disabled" );
262 radioButton.SetName( "radio-select-disable" );
263 radioButton.SetParentOrigin( ParentOrigin::TOP_LEFT );
264 radioButton.SetAnchorPoint( AnchorPoint::TOP_LEFT );
265 radioButton.SetPosition( 0, DP(50) );
267 radioButton.ToggledSignal().Connect( this, &ButtonsController::EnableSelectButtonToggle );
269 radioButtonsGroup1.Add( radioButton );
273 yPos += GROUP1_HEIGHT + MARGIN_SIZE;
275 Actor checkBoxBackground = Toolkit::CreateSolidColorActor( BACKGROUND_COLOUR );
276 checkBoxBackground.SetAnchorPoint( AnchorPoint::TOP_LEFT );
277 checkBoxBackground.SetParentOrigin( ParentOrigin::TOP_LEFT );
278 checkBoxBackground.SetPosition( DP(MARGIN_SIZE), DP(yPos) );
279 checkBoxBackground.SetSize( DP(430), DP(GROUP3_HEIGHT) );
280 mContentLayer.Add( checkBoxBackground );
282 Dali::Image unchecked = Dali::Image::New( CHECKBOX_UNCHECKED_IMAGE );
283 Dali::Image checked = Dali::Image::New( CHECKBOX_CHECKED_IMAGE );
285 int checkYPos = MARGIN_SIZE;
288 Toolkit::CheckBoxButton checkBox = Toolkit::CheckBoxButton::New();
289 checkBox.SetName( "checkbox1" );
290 checkBox.SetPosition( DP(MARGIN_SIZE), DP(checkYPos) );
291 checkBox.SetParentOrigin( ParentOrigin::TOP_LEFT );
292 checkBox.SetAnchorPoint( AnchorPoint::TOP_LEFT );
293 checkBox.SetBackgroundImage( unchecked );
294 checkBox.SetCheckedImage( checked );
295 checkBox.SetSize( DP(48), DP(48) );
296 checkBox.ToggledSignal().Connect( this, &ButtonsController::OnCheckBoxesToggled );
298 checkBoxBackground.Add( checkBox );
301 mCheckBox1State = Toolkit::TextView::New( "CheckBox1 is unchecked" );
303 mCheckBox1State.SetAnchorPoint( AnchorPoint::TOP_LEFT );
304 mCheckBox1State.SetPosition( DP(80), DP(checkYPos) );
306 checkBoxBackground.Add( mCheckBox1State );
311 Toolkit::CheckBoxButton checkBox = Toolkit::CheckBoxButton::New();
312 checkBox.SetName( "checkbox2" );
313 checkBox.SetPosition( DP(MARGIN_SIZE), DP(checkYPos) );
314 checkBox.SetAnchorPoint( AnchorPoint::TOP_LEFT );
315 checkBox.SetBackgroundImage( unchecked );
316 checkBox.SetCheckedImage( checked );
317 checkBox.SetSize( DP(48), DP(48) );
318 checkBox.SetChecked( true );
319 checkBox.ToggledSignal().Connect( this, &ButtonsController::OnCheckBoxesToggled );
321 checkBoxBackground.Add( checkBox );
324 mCheckBox2State = Toolkit::TextView::New( "CheckBox2 is checked" );
325 mCheckBox2State.SetParentOrigin( ParentOrigin::TOP_LEFT );
326 mCheckBox2State.SetAnchorPoint( AnchorPoint::TOP_LEFT );
327 mCheckBox2State.SetPosition( DP(80), DP(checkYPos) );
329 checkBoxBackground.Add( mCheckBox2State );
334 Toolkit::CheckBoxButton checkBox = Toolkit::CheckBoxButton::New();
335 checkBox.SetName( "checkbox3" );
336 checkBox.SetPosition( DP(MARGIN_SIZE), DP(checkYPos) );
337 checkBox.SetAnchorPoint( AnchorPoint::TOP_LEFT );
338 checkBox.SetBackgroundImage( unchecked );
339 checkBox.SetCheckedImage( checked );
340 checkBox.SetSize( DP(48), DP(48) );
341 checkBox.ToggledSignal().Connect( this, &ButtonsController::OnCheckBoxesToggled );
343 checkBoxBackground.Add( checkBox );
346 mCheckBox3State = Toolkit::TextView::New( "CheckBox3 is unchecked" );
348 mCheckBox3State.SetAnchorPoint( AnchorPoint::TOP_LEFT );
349 mCheckBox3State.SetPosition( DP(80), DP(checkYPos) );
351 checkBoxBackground.Add( mCheckBox3State );
353 // Create toggle button
354 yPos += GROUP3_HEIGHT + MARGIN_SIZE;
356 Actor toggleBackground = Toolkit::CreateSolidColorActor( BACKGROUND_COLOUR );
357 toggleBackground.SetAnchorPoint( AnchorPoint::TOP_LEFT );
358 toggleBackground.SetParentOrigin( ParentOrigin::TOP_LEFT );
359 toggleBackground.SetPosition( DP(MARGIN_SIZE), DP(yPos) );
360 toggleBackground.SetSize( DP(150 + MARGIN_SIZE * 2), DP(GROUP4_HEIGHT) );
361 mContentLayer.Add( toggleBackground );
363 Toolkit::PushButton toggleButton = Toolkit::PushButton::New();
364 toggleButton.SetToggleButton( true );
365 toggleButton.SetParentOrigin( ParentOrigin::TOP_LEFT );
366 toggleButton.SetAnchorPoint( AnchorPoint::TOP_LEFT );
367 toggleButton.SetPosition( DP(MARGIN_SIZE), DP(MARGIN_SIZE) );
368 toggleButton.SetLabelText( "Toggle OFF" );
369 toggleButton.SetSize( DP(150), DP(BUTTON_HEIGHT) );
371 toggleButton.SetPressedImage( Dali::Image::New( PUSHBUTTON_PRESS_IMAGE ) );
372 toggleButton.SetDimmedImage( Dali::Image::New( PUSHBUTTON_DIM_IMAGE ) );
373 toggleButton.SetButtonImage( Dali::Image::New( PUSHBUTTON_BUTTON_IMAGE ) );
375 toggleButton.ToggledSignal().Connect( this, &ButtonsController::OnButtonToggled );
377 toggleBackground.Add( toggleButton );
380 void OnKeyEvent( const KeyEvent& event )
382 if( event.state == KeyEvent::Down )
384 if( IsKey( event, Dali::DALI_KEY_ESCAPE ) || IsKey( event, Dali::DALI_KEY_BACK ) )
386 // Exit application when click back or escape.
392 bool OnButtonToggled( Toolkit::Button button, bool state )
394 Toolkit::PushButton pushButton = Toolkit::PushButton::DownCast( button );
399 pushButton.SetLabelText( "Toggle ON" );
403 pushButton.SetLabelText( "Toggle OFF" );
410 bool EnableSelectButtonToggle( Toolkit::Button button, bool state )
412 if( button.GetName() == "radio-select-enable" && state == true )
414 mUpdateButton.SetDimmed( false );
416 else if( button.GetName() == "radio-select-disable" && state == true )
418 mUpdateButton.SetDimmed( true );
424 bool OnButtonClicked(Toolkit::Button button)
426 if( mRadioButtonImage1.IsActive() )
428 mImage.SetImage( mBigImage1 );
430 else if( mRadioButtonImage2.IsActive() )
432 mImage.SetImage( mBigImage2 );
434 else if( mRadioButtonImage3.IsActive() )
436 mImage.SetImage( mBigImage3 );
441 bool OnCheckBoxesToggled( Toolkit::Button button, bool state )
443 if( button.GetName() == "checkbox1" )
447 mCheckBox1State.SetText("CheckBox1 is checked");
451 mCheckBox1State.SetText("CheckBox1 is unchecked");
455 if( button.GetName() == "checkbox2" )
459 mCheckBox2State.SetText("CheckBox2 is checked");
463 mCheckBox2State.SetText("CheckBox2 is unchecked");
467 if( button.GetName() == "checkbox3" )
471 mCheckBox3State.SetText("CheckBox3 is checked");
475 mCheckBox3State.SetText("CheckBox3 is unchecked");
484 Application& mApplication;
485 Toolkit::View mView; ///< The View instance.
486 Toolkit::ToolBar mToolBar; ///< The View's Toolbar.
487 Layer mContentLayer; ///< Content layer
489 Toolkit::RadioButton mRadioButtonImage1;
490 Toolkit::RadioButton mRadioButtonImage2;
491 Toolkit::RadioButton mRadioButtonImage3;
493 Toolkit::PushButton mUpdateButton;
500 Toolkit::TextView mCheckBox1State;
501 Toolkit::TextView mCheckBox2State;
502 Toolkit::TextView mCheckBox3State;
505 void RunTest( Application& application )
507 ButtonsController test( application );
509 application.MainLoop();
512 // Entry point for Linux & SLP applications
514 int main( int argc, char **argv )
516 Application application = Application::New( &argc, &argv );
518 RunTest( application );