2 * Copyright (c) 2016 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 * @file text-label-example.cpp
20 * @brief Basic usage of TextLabel control
24 #include <dali/devel-api/object/handle-devel.h>
25 #include <dali/devel-api/actors/actor-devel.h>
26 #include <dali-toolkit/devel-api/controls/text-controls/text-label-devel.h>
27 #include <dali-toolkit/devel-api/controls/buttons/button-devel.h>
28 #include <dali-toolkit/dali-toolkit.h>
32 #include "shared/multi-language-strings.h"
33 #include "shared/view.h"
36 using namespace Dali::Toolkit;
37 using namespace MultiLanguageStrings;
41 const char* const BACKGROUND_IMAGE = DEMO_IMAGE_DIR "grab-handle.png";
42 const char* const STYLES_IMAGE = DEMO_IMAGE_DIR "FontStyleButton_Main.png";
43 const char* const TICK_IMAGE_IMAGE = DEMO_IMAGE_DIR "FontStyleButton_OK_02.png";
44 const char* const STYLE_SELECTED_IMAGE = DEMO_IMAGE_DIR "FontStyleButton_OK_03.png";
46 const char* BUTTON_IMAGES[] =
48 DEMO_IMAGE_DIR "FontStyleButton_Colour.png",
49 DEMO_IMAGE_DIR "FontStyleButton_Outline.png",
50 DEMO_IMAGE_DIR "FontStyleButton_Shadow.png"
53 const unsigned int KEY_ZERO = 10;
54 const unsigned int KEY_ONE = 11;
55 const unsigned int KEY_A = 38;
56 const unsigned int KEY_F = 41;
57 const unsigned int KEY_H = 43;
58 const unsigned int KEY_U = 30;
59 const unsigned int KEY_V = 55;
60 const unsigned int KEY_M = 58;
61 const unsigned int KEY_L = 46;
62 const unsigned int KEY_S = 39;
63 const unsigned int KEY_PLUS = 21;
64 const unsigned int KEY_MINUS = 20;
66 const char* H_ALIGNMENT_STRING_TABLE[] =
73 const unsigned int H_ALIGNMENT_STRING_COUNT = sizeof( H_ALIGNMENT_STRING_TABLE ) / sizeof( H_ALIGNMENT_STRING_TABLE[0u] );
75 const char* V_ALIGNMENT_STRING_TABLE[] =
82 const unsigned int V_ALIGNMENT_STRING_COUNT = sizeof( V_ALIGNMENT_STRING_TABLE ) / sizeof( V_ALIGNMENT_STRING_TABLE[0u] );
92 const Vector4 AVAILABLE_COLORS[] =
100 const unsigned int NUMBER_OF_COLORS = sizeof( AVAILABLE_COLORS ) / sizeof( AVAILABLE_COLORS[0u] );
102 int ConvertToEven(int value)
104 return (value % 2 == 0) ? value : (value + 1);
107 struct HSVColorConstraint
109 HSVColorConstraint(float hue, float saturation, float value)
111 saturation(saturation),
116 void operator()(Vector3& current, const PropertyInputContainer& inputs )
118 current = hsv2rgb(Vector3(inputs[0]->GetFloat(), saturation, value));
121 Vector3 hsv2rgb(Vector3 colorHSV)
123 float r=colorHSV.z*(1+colorHSV.y*(cos(colorHSV.x)-1));
124 float g=colorHSV.z*(1+colorHSV.y*(cos(colorHSV.x-2.09439)-1));
125 float b=colorHSV.z*(1+colorHSV.y*(cos(colorHSV.x+2.09439)-1));
126 return Vector3(r, g, b);
133 const float STYLE_BUTTON_POSTION_RELATIVE_TO_STAGE = 0.9f;
134 const float BUTTON_SIZE_RATIO_TO_STAGE = 0.1f;
135 const float OUTLINE_WIDTH = 2.0f;
136 const Vector2 SHADOW_OFFSET = Vector2( 2.0f, 2.0f );
139 } // anonymous namespace
142 * @brief The main class of the demo.
144 class TextLabelExample : public ConnectionTracker
148 TextLabelExample( Application& application )
149 : mApplication( application ),
151 mShadowActive( false ),
152 mOutlineActive( false ),
153 mSelectedColor(AVAILABLE_COLORS[0]),
157 mPanGestureDetector(),
161 mHueAngleIndex( Property::INVALID_INDEX ),
162 mOverrideMixColorIndex( Property::INVALID_INDEX )
165 // Connect to the Application's Init signal
166 mApplication.InitSignal().Connect( this, &TextLabelExample::Create );
171 // Nothing to do here.
175 * One-time setup in response to Application InitSignal.
177 void Create( Application& application )
179 Stage stage = Stage::GetCurrent();
181 stage.KeyEventSignal().Connect(this, &TextLabelExample::OnKeyEvent);
182 mStageSize = stage.GetSize();
184 mButtonSize = Size( mStageSize.height * 0.1, mStageSize.height * 0.1 ); // Button size 1/10 of stage height
186 mContainer = Control::New();
187 mContainer.SetName( "Container" );
188 mContainer.SetParentOrigin( ParentOrigin::CENTER );
189 mLayoutSize = Vector2(mStageSize.width*0.6f, mStageSize.width*0.6f);
190 mContainer.SetSize( mLayoutSize );
191 mContainer.SetDrawMode( DrawMode::OVERLAY_2D );
192 stage.Add( mContainer );
194 // Resize the center layout when the corner is grabbed
195 mGrabCorner = ImageView::New( BACKGROUND_IMAGE );
196 mGrabCorner.SetName( "GrabCorner" );
197 mGrabCorner.SetAnchorPoint( AnchorPoint::TOP_CENTER );
198 mGrabCorner.SetParentOrigin( ParentOrigin::BOTTOM_RIGHT );
199 mGrabCorner.SetResizePolicy( ResizePolicy::USE_NATURAL_SIZE, Dimension::ALL_DIMENSIONS );
200 mContainer.Add( mGrabCorner );
202 mPanGestureDetector = PanGestureDetector::New();
203 mPanGestureDetector.Attach( mGrabCorner );
204 mPanGestureDetector.DetectedSignal().Connect( this, &TextLabelExample::OnPan );
206 mLabel = TextLabel::New( "\xF0\x9F\x98\x89 A Quick Brown Fox Jumps Over The Lazy Dog" );
208 mLabel.SetName( "TextLabel" );
209 mLabel.SetAnchorPoint( AnchorPoint::TOP_LEFT );
210 mLabel.SetSize(mLayoutSize);
211 mLabel.SetProperty( TextLabel::Property::MULTI_LINE, true );
212 mLabel.SetProperty( DevelTextLabel::Property::TEXT_COLOR_ANIMATABLE, Color::GREEN );
213 mLabel.SetBackgroundColor( Color::WHITE );
214 mContainer.Add( mLabel );
216 // Create style activate button
217 mStyleMenuButton = PushButton::New();
218 mStyleMenuButton.SetPosition( mButtonSize.width, mStageSize.height * STYLE_BUTTON_POSTION_RELATIVE_TO_STAGE );
219 mStyleMenuButton.SetSize( mButtonSize );
220 mStyleMenuButton.SetProperty( Button::Property::TOGGLABLE, true );
221 mStyleMenuButton.SetProperty( Toolkit::DevelButton::Property::UNSELECTED_BACKGROUND_VISUAL, STYLES_IMAGE );
222 mStyleMenuButton.SetProperty( Toolkit::DevelButton::Property::SELECTED_BACKGROUND_VISUAL, TICK_IMAGE_IMAGE );
224 mStyleMenuButton.ClickedSignal().Connect( this, &TextLabelExample::OnStyleButtonClicked );
225 stage.Add( mStyleMenuButton );
227 // Add a border for the container so you can see the container is being resized while grabbing the handle.
228 mBorder = Control::New();
229 mBorder.SetAnchorPoint( AnchorPoint::TOP_LEFT );
230 mBorder.SetResizePolicy( ResizePolicy::FILL_TO_PARENT, Dimension::WIDTH );
231 mBorder.SetResizePolicy( ResizePolicy::FILL_TO_PARENT, Dimension::HEIGHT );
233 Dali::Property::Map border;
234 border.Insert( Visual::Property::TYPE, Visual::BORDER );
235 border.Insert( BorderVisual::Property::COLOR, Color::WHITE );
236 border.Insert( BorderVisual::Property::SIZE, 2.f );
237 mBorder.SetProperty( Control::Property::BACKGROUND, border );
238 mContainer.Add( mBorder );
239 mBorder.SetVisible(false);
241 DevelActor::RaiseToTop(mGrabCorner);
243 mHueAngleIndex = mLabel.RegisterProperty( "hue", 0.0f );
244 Renderer bgRenderer = mLabel.GetRendererAt(0);
245 mOverrideMixColorIndex = DevelHandle::GetPropertyIndex( bgRenderer, ColorVisual::Property::MIX_COLOR );
247 Constraint constraint = Constraint::New<Vector3>( bgRenderer, mOverrideMixColorIndex, HSVColorConstraint(0.0f, 0.5f, 0.8f));
248 constraint.AddSource( Source( mLabel, mHueAngleIndex ) );
249 constraint.SetRemoveAction( Constraint::Discard );
252 Animation anim = Animation::New(50.0f);
253 anim.AnimateTo(Property(mLabel, mHueAngleIndex), 6.28318f);
254 anim.SetLooping(true);
257 // Animate the text color 3 times from source color to Yellow
258 Animation animation = Animation::New( 2.f );
259 animation.AnimateTo( Property( mLabel, DevelTextLabel::Property::TEXT_COLOR_ANIMATABLE ), Color::YELLOW, AlphaFunction::SIN );
260 animation.SetLoopCount( 3 );
263 Property::Value labelText = mLabel.GetProperty( TextLabel::Property::TEXT );
264 std::cout << "Displaying text: \"" << labelText.Get< std::string >() << "\"" << std::endl;
267 // Depending on button pressed, apply the style to the text label
268 bool OnStyleSelected( Toolkit::Button button )
270 if( button == mStyleButtons[ StyleType::TEXT_COLOR ] )
272 Animation animation = Animation::New( 2.f );
273 animation.AnimateTo( Property( mLabel, DevelTextLabel::Property::TEXT_COLOR_ANIMATABLE ), mSelectedColor, AlphaFunction::LINEAR );
276 else if( button == mStyleButtons[ StyleType::OUTLINE ] )
278 Property::Map outlineMap;
279 float outlineWidth = OUTLINE_WIDTH;
283 outlineWidth = ( mOutlineColor == mSelectedColor ) ? 0.0f : OUTLINE_WIDTH ; // toggles outline on/off
285 mOutlineActive = ( outlineWidth > 0.0f ) ? true : false;
287 mOutlineColor = mSelectedColor;
288 outlineMap["color"] = mOutlineColor;
289 outlineMap["width"] = outlineWidth;
290 mLabel.SetProperty( TextLabel::Property::OUTLINE, outlineMap );
292 else if( button == mStyleButtons[ StyleType::SHADOW ] )
294 Vector2 shadowOffset( SHADOW_OFFSET ); // Will be set to zeros if color already set
295 Property::Value value = mLabel.GetProperty( TextLabel::Property::SHADOW_COLOR );
296 Vector4 currentShadowColor;
297 value.Get( currentShadowColor );
301 // toggle shadow off ( zero offset ) if color is already set
302 shadowOffset = ( currentShadowColor == mSelectedColor ) ? Vector2::ZERO : Vector2( SHADOW_OFFSET );
305 mShadowActive = ( shadowOffset == Vector2::ZERO ) ? false : true;
307 mLabel.SetProperty( TextLabel::Property::SHADOW_OFFSET, shadowOffset );
308 mLabel.SetProperty( TextLabel::Property::SHADOW_COLOR, mSelectedColor );
313 bool OnColorSelected( Toolkit::Button button )
315 for( unsigned int index = 0; index < NUMBER_OF_COLORS; index++)
317 if ( mColorButtons[index] == button )
319 mSelectedColor = AVAILABLE_COLORS[ index ];
326 void ShowColorButtons()
328 for( unsigned int index = 0; index < NUMBER_OF_COLORS; index++)
330 mColorButtons[index] = RadioButton::New();
331 mColorButtons[index].SetPosition( mButtonSize.width, mStageSize.height * STYLE_BUTTON_POSTION_RELATIVE_TO_STAGE - ( mButtonSize.width * (index+1) ) );
332 mColorButtons[index].SetSize( mButtonSize );
333 mColorButtons[index].ClickedSignal().Connect( this, &TextLabelExample::OnColorSelected );
334 mColorButtons[index].SetProperty( Button::Property::TOGGLABLE, true );
335 Property::Map propertyMap;
336 propertyMap.Insert(Visual::Property::TYPE, Visual::COLOR);
337 propertyMap.Insert(ColorVisual::Property::MIX_COLOR, AVAILABLE_COLORS[ index ]);
338 mColorButtons[index].SetProperty( Toolkit::DevelButton::Property::UNSELECTED_BACKGROUND_VISUAL, propertyMap );
339 mColorButtons[index].SetProperty( Toolkit::DevelButton::Property::UNSELECTED_VISUAL, propertyMap );
341 propertyMap.Insert(Visual::Property::TYPE, Visual::COLOR);
342 propertyMap.Insert(ColorVisual::Property::MIX_COLOR, AVAILABLE_COLORS[ index ]);
343 mColorButtons[index].SetProperty( Toolkit::DevelButton::Property::SELECTED_BACKGROUND_VISUAL, propertyMap );
345 mColorButtons[index].SetProperty( Toolkit::DevelButton::Property::SELECTED_VISUAL,
346 Property::Map().Add( Visual::Property::TYPE, Visual::BORDER )
347 .Add( BorderVisual::Property::COLOR, Color::WHITE )
348 .Add( BorderVisual::Property::SIZE, 2.0f )
349 .Add( BorderVisual::Property::ANTI_ALIASING, true ) );
351 Stage::GetCurrent().Add( mColorButtons[index] );
356 void HideColorButtons()
358 for( unsigned int index = 0; index < NUMBER_OF_COLORS; index++)
360 UnparentAndReset( mColorButtons[index] );
364 void HideStyleButtons()
366 for( unsigned int index = 0; index < NUMBER_OF_STYLES; index++)
368 UnparentAndReset( mStyleButtons[index] );
372 bool OnStyleButtonClicked( Toolkit::Button button )
374 if ( button.GetProperty( Toolkit::Button::Property::SELECTED ).Get<bool>() )
376 for ( unsigned int index = 0; index < NUMBER_OF_STYLES; index++ )
378 mStyleButtons[index] = PushButton::New();
379 mStyleButtons[index].SetPosition( mButtonSize.width + ( mButtonSize.width * (index+1) ), mStageSize.height * STYLE_BUTTON_POSTION_RELATIVE_TO_STAGE );
380 mStyleButtons[index].SetSize( mButtonSize );
381 mStyleButtons[index].SetProperty( Toolkit::DevelButton::Property::UNSELECTED_BACKGROUND_VISUAL, BUTTON_IMAGES[ index ] );
382 mStyleButtons[index].SetProperty( Toolkit::DevelButton::Property::SELECTED_BACKGROUND_VISUAL, STYLE_SELECTED_IMAGE );
383 mStyleButtons[index].ClickedSignal().Connect( this, &TextLabelExample::OnStyleSelected );
384 Stage::GetCurrent().Add( mStyleButtons[index] );
390 // hide menu and colors
397 // Resize the text-label with pan gesture
398 void OnPan( Actor actor, const PanGesture& gesture )
400 // Reset mLayoutSize when the pan starts
401 if( gesture.state == Gesture::Started )
403 if( mLayoutSize.x < 2.0f )
405 mLayoutSize.x = 2.0f;
408 if( mLayoutSize.y < 2.0f )
410 mLayoutSize.y = 2.0f;
413 // Only show the border during the panning
414 mBorder.SetVisible(true);
417 mLayoutSize.x += gesture.displacement.x * 2.0f;
418 mLayoutSize.y += gesture.displacement.y * 2.0f;
420 if( mLayoutSize.x >= 2.0f ||
421 mLayoutSize.y >= 2.0f )
423 mLayoutSize.x = std::min ( mLayoutSize.x, mStageSize.width );
424 mLayoutSize.y = std::min ( mLayoutSize.y, mStageSize.height*.9f );
426 // Avoid pixel mis-alignment issue
427 Vector2 clampedSize = Vector2( std::max( ConvertToEven( static_cast<int>( mLayoutSize.x )), 2 ),
428 std::max( ConvertToEven( static_cast<int>( mLayoutSize.y )), 2 ) );
430 mContainer.SetSize( clampedSize );
433 if( gesture.state == Gesture::Cancelled || gesture.state == Gesture::Finished )
435 // Resize the text label to match the container size when panning is finished
436 mLabel.SetSize(mLayoutSize);
437 mBorder.SetVisible(false);
442 * Main key event handler
444 void OnKeyEvent(const KeyEvent& event)
446 if(event.state == KeyEvent::Down)
448 if( IsKey( event, DALI_KEY_ESCAPE) || IsKey( event, DALI_KEY_BACK ) )
452 else if( event.IsCtrlModifier() )
454 switch( event.keyCode )
456 // Select rendering back-end
457 case KEY_ZERO: // fall through
460 mLabel.SetProperty( TextLabel::Property::RENDERING_BACKEND, event.keyCode - 10 );
463 case KEY_A: // Animate text colour
465 Animation animation = Animation::New( 2.f );
466 animation.AnimateTo( Property( mLabel, DevelTextLabel::Property::TEXT_COLOR_ANIMATABLE ), Color::RED, AlphaFunction::SIN );
467 animation.SetLoopCount( 3 );
471 case KEY_F: // Fill vertically
473 if( ResizePolicy::DIMENSION_DEPENDENCY == mLabel.GetResizePolicy(Dimension::HEIGHT) )
475 mLabel.SetResizePolicy( ResizePolicy::FILL_TO_PARENT, Dimension::HEIGHT );
479 mLabel.SetResizePolicy( ResizePolicy::DIMENSION_DEPENDENCY, Dimension::HEIGHT );
483 case KEY_H: // Horizontal alignment
485 if( ++mAlignment >= H_ALIGNMENT_STRING_COUNT )
490 mLabel.SetProperty( TextLabel::Property::HORIZONTAL_ALIGNMENT, H_ALIGNMENT_STRING_TABLE[ mAlignment ] );
493 case KEY_V: // Vertical alignment
495 if( ++mAlignment >= V_ALIGNMENT_STRING_COUNT )
500 mLabel.SetProperty( TextLabel::Property::VERTICAL_ALIGNMENT, V_ALIGNMENT_STRING_TABLE[ mAlignment ] );
503 case KEY_M: // Multi-line
505 bool multiLine = mLabel.GetProperty<bool>( TextLabel::Property::MULTI_LINE );
506 mLabel.SetProperty( TextLabel::Property::MULTI_LINE, !multiLine );
509 case KEY_L: // Language
511 const Language& language = LANGUAGES[ mLanguageId ];
513 mLabel.SetProperty( TextLabel::Property::TEXT, language.text );
515 if( ++mLanguageId >= NUMBER_OF_LANGUAGES )
521 case KEY_S: // Shadow color
523 if( Color::BLACK == mLabel.GetProperty<Vector4>( TextLabel::Property::SHADOW_COLOR ) )
525 mLabel.SetProperty( TextLabel::Property::SHADOW_COLOR, Color::RED );
529 mLabel.SetProperty( TextLabel::Property::SHADOW_COLOR, Color::BLACK );
533 case KEY_U: // Markup
535 mLabel.SetProperty( TextLabel::Property::ENABLE_MARKUP, true );
536 mLabel.SetProperty( TextLabel::Property::TEXT, "<font family='DejaVuSerif' size='18'>H<color value='blue'>ello</color> <font weight='bold'>world</font> demo</font>" );
539 case KEY_PLUS: // Increase shadow offset
541 mLabel.SetProperty( TextLabel::Property::SHADOW_OFFSET, mLabel.GetProperty<Vector2>( TextLabel::Property::SHADOW_OFFSET ) + Vector2( 1.0f, 1.0f ) );
544 case KEY_MINUS: // Decrease shadow offset
546 mLabel.SetProperty( TextLabel::Property::SHADOW_OFFSET, mLabel.GetProperty<Vector2>( TextLabel::Property::SHADOW_OFFSET ) - Vector2( 1.0f, 1.0f ) );
557 Application& mApplication;
561 PushButton mStyleMenuButton;
562 PushButton mStyleButtons[ NUMBER_OF_STYLES ];
565 Vector4 mSelectedColor;
566 Vector4 mOutlineColor; // Store outline as Vector4 whilst TextLabel Outline Property returns a string when using GetProperty
567 Button mColorButtons[ NUMBER_OF_COLORS ];
573 PanGestureDetector mPanGestureDetector;
580 unsigned int mLanguageId;
581 unsigned int mAlignment;
582 Property::Index mHueAngleIndex;
583 Property::Index mOverrideMixColorIndex;
586 void RunTest( Application& application )
588 TextLabelExample test( application );
590 application.MainLoop();
593 /** Entry point for Linux & Tizen applications */
594 int DALI_EXPORT_API main( int argc, char **argv )
596 Application application = Application::New( &argc, &argv, DEMO_THEME_PATH );
598 RunTest( application );