From: Jiyun Yang Date: Tue, 9 Jun 2020 07:55:30 +0000 (+0900) Subject: Add circular ProgressBar style X-Git-Tag: dali_1.9.17~13 X-Git-Url: http://review.tizen.org/git/?p=platform%2Fcore%2Fuifw%2Fdali-toolkit.git;a=commitdiff_plain;h=6dee0c77383cfa21c57099dd519ce4821a9d23b0 Add circular ProgressBar style * The style implements UX requirements for wearable, but it can be used in other devices too. * The style uses arc visuals for track, secondary progress, progress and indeterminate visual. * The progress value will change sweepAngle of the track visual. * The indeterminate animation in the style uses visuals (e.g. track, progress) including indeterminate visual. * Add ProgressBar::NEW(Style) to easy use of style. Change-Id: I74c227ad2716bc829180f002abe22a28ffdef959 Signed-off-by: Jiyun Yang --- diff --git a/automated-tests/src/dali-toolkit/utc-Dali-ProgressBar.cpp b/automated-tests/src/dali-toolkit/utc-Dali-ProgressBar.cpp index 916fb13..d6f125d 100644 --- a/automated-tests/src/dali-toolkit/utc-Dali-ProgressBar.cpp +++ b/automated-tests/src/dali-toolkit/utc-Dali-ProgressBar.cpp @@ -17,6 +17,9 @@ #include #include +#include +#include +#include #include using namespace Dali; @@ -85,6 +88,22 @@ int UtcDaliProgressBarNew(void) END_TEST; } +int UtcDaliProgressBarNew2(void) +{ + ToolkitTestApplication application; + tet_infoline(" UtcDaliProgressBarNew2"); + + ProgressBar progressBar1 = DevelProgressBar::New( DevelProgressBar::Style::LINEAR ); + DALI_TEST_CHECK( progressBar1 ); + + ProgressBar progressBar2 = DevelProgressBar::New( DevelProgressBar::Style::CIRCULAR ); + DALI_TEST_CHECK( progressBar2 ); + + DALI_TEST_CHECK( progressBar1.GetStyleName() != progressBar2.GetStyleName() ); + + END_TEST; +} + int UtcDaliProgressBarDestructor(void) { ToolkitTestApplication application; @@ -410,3 +429,104 @@ int UtcDaliProgressBarSetPropertyP2(void) END_TEST; } + +int UtcDaliProgressBarSetPropertyP3(void) +{ + ToolkitTestApplication application; + tet_infoline( "UtcDaliProgressBarSetPropertyP3" ); + + ProgressBar progressBar = ProgressBar::New(); + progressBar.SetProperty( Actor::Property::PARENT_ORIGIN, ParentOrigin::TOP_LEFT); + progressBar.SetProperty( Actor::Property::ANCHOR_POINT, ParentOrigin::TOP_LEFT); + progressBar.SetProperty( Actor::Property::SIZE, Vector2( Stage::GetCurrent().GetSize().x, Stage::GetCurrent().GetSize().y ) ); + Stage::GetCurrent().Add( progressBar ); + application.SendNotification(); + application.Render(); + + { + // Set arc visual to the SECONDARY_PROGRESS_VISUAL + const float expected = 180.0f; + + Property::Map map; + map["visualType"] = "ARC"; + map["thickness"] = 4.0f; + map["mixColor"] = Color::BLUE; + map["sweepAngle"] = 60; + progressBar.SetProperty(ProgressBar::Property::SECONDARY_PROGRESS_VISUAL, map); + progressBar.SetProperty(ProgressBar::Property::SECONDARY_PROGRESS_VALUE, 0.5f); // This should change visual's sweep angle. + + Property::Value value = progressBar.GetProperty( ProgressBar::Property::SECONDARY_PROGRESS_VISUAL ); + Property::Map* resultMap = value.GetMap(); + DALI_TEST_CHECK( resultMap ); + + Property::Value* sweepAngle = resultMap->Find( DevelArcVisual::Property::SWEEP_ANGLE ); + float result = 0.0f; + sweepAngle->Get( result ); + DALI_TEST_EQUALS( result, expected, TEST_LOCATION ); + } + + { + // Set arc visual to the PROGRESS_VISUAL + const float expected = 90.0f; + + Property::Map map; + map["visualType"] = "ARC"; + map["thickness"] = 4.0f; + map["mixColor"] = Color::RED; + map["sweepAngle"] = 60; + progressBar.SetProperty(ProgressBar::Property::PROGRESS_VISUAL, map); + progressBar.SetProperty(ProgressBar::Property::PROGRESS_VALUE, 0.25f); // This should change visual's sweep angle. + + Property::Value value = progressBar.GetProperty( ProgressBar::Property::PROGRESS_VISUAL ); + Property::Map* resultMap = value.GetMap(); + DALI_TEST_CHECK( resultMap ); + + Property::Value* sweepAngle = resultMap->Find( DevelArcVisual::Property::SWEEP_ANGLE ); + float result = 0.0f; + sweepAngle->Get( result ); + DALI_TEST_EQUALS( result, expected, TEST_LOCATION ); + } + + { + // Set arc visual to the INDETERMINATE_VISUAL + const Vector4 expected = Color::GREEN; + + Property::Map map; + map["visualType"] = "ARC"; + map["thickness"] = 4.0f; + map["mixColor"] = expected; + progressBar.SetProperty(ProgressBar::Property::INDETERMINATE_VISUAL, map); + + Property::Value value = progressBar.GetProperty( ProgressBar::Property::INDETERMINATE_VISUAL ); + Property::Map* resultMap = value.GetMap(); + DALI_TEST_CHECK( resultMap ); + + Property::Value* mixColor = resultMap->Find( Visual::Property::MIX_COLOR ); + Vector4 result; + mixColor->Get( result ); + DALI_TEST_EQUALS( result, expected, TEST_LOCATION ); + } + + { + // Set arc visual to the TRACK_VISUAL + const Vector4 expected = Color::YELLOW; + + Property::Map map; + map["visualType"] = "ARC"; + map["thickness"] = 0.4f; + map["mixColor"] = expected; + progressBar.SetProperty( ProgressBar::Property::TRACK_VISUAL, map ); + progressBar.SetProperty( ProgressBar::Property::INDETERMINATE, true ); // This should not change track visual's properties. + + Property::Value value = progressBar.GetProperty( ProgressBar::Property::TRACK_VISUAL ); + Property::Map* resultMap = value.GetMap(); + DALI_TEST_CHECK( resultMap ); + + Property::Value* mixColor = resultMap->Find( Visual::Property::MIX_COLOR ); + Vector4 result; + mixColor->Get( result ); + DALI_TEST_EQUALS( result, expected, TEST_LOCATION ); + } + + END_TEST; +} diff --git a/dali-toolkit/devel-api/controls/progress-bar/progress-bar-devel.cpp b/dali-toolkit/devel-api/controls/progress-bar/progress-bar-devel.cpp new file mode 100644 index 0000000..f3951aa --- /dev/null +++ b/dali-toolkit/devel-api/controls/progress-bar/progress-bar-devel.cpp @@ -0,0 +1,39 @@ +/* + * Copyright (c) 2020 Samsung Electronics Co., Ltd. + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + * + */ + +// INTERNAL INCLUDES +#include + +namespace Dali +{ + +namespace Toolkit +{ + +namespace DevelProgressBar +{ + +Toolkit::ProgressBar New( Style progressBarStyle ) +{ + return Internal::ProgressBar::New( progressBarStyle ); +} + +} // namespace DevelProgressBar + +} // namespace Toolkit + +} // namespace Dali diff --git a/dali-toolkit/devel-api/controls/progress-bar/progress-bar-devel.h b/dali-toolkit/devel-api/controls/progress-bar/progress-bar-devel.h new file mode 100644 index 0000000..b9a04d4 --- /dev/null +++ b/dali-toolkit/devel-api/controls/progress-bar/progress-bar-devel.h @@ -0,0 +1,62 @@ +#ifndef DALI_TOOLKIT_PROGRESS_BAR_DEVEL_H +#define DALI_TOOLKIT_PROGRESS_BAR_DEVEL_H + +/* + * Copyright (c) 2020 Samsung Electronics Co., Ltd. + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + * + */ + +// INTERNAL INCLUDES +#include + +namespace Dali +{ + +namespace Toolkit +{ + +namespace DevelProgressBar +{ + +/** + * @brief Enumeration for the style of progress bar. + */ +enum class Style +{ + /** + * @brief Indicates a linear shape of progress bar. + */ + LINEAR, + + /** + * @brief Indicates a circular shape of progress bar. + */ + CIRCULAR, +}; + +/** + * @brief Creates a new ProgressBar with predefined style. + * @param[in] progressBarStyle A style value that determines the visual properties for ProgressBar. + * @return A handle to the ProgressBar control. + */ +DALI_TOOLKIT_API Toolkit::ProgressBar New( Style progressBarStyle ); + +} // namespace DevelProgressBar + +} // namespace Toolkit + +} // namespace Dali + +#endif // DALI_TOOLKIT_PROGRESS_BAR_DEVEL_H diff --git a/dali-toolkit/devel-api/file.list b/dali-toolkit/devel-api/file.list index 219fb28..48e3579 100755 --- a/dali-toolkit/devel-api/file.list +++ b/dali-toolkit/devel-api/file.list @@ -22,6 +22,7 @@ SET( devel_api_src_files ${devel_api_src_dir}/controls/page-turn-view/page-turn-view.cpp ${devel_api_src_dir}/controls/popup/confirmation-popup.cpp ${devel_api_src_dir}/controls/popup/popup.cpp + ${devel_api_src_dir}/controls/progress-bar/progress-bar-devel.cpp ${devel_api_src_dir}/controls/scene3d-view/scene3d-view.cpp ${devel_api_src_dir}/controls/shadow-view/shadow-view.cpp ${devel_api_src_dir}/controls/super-blur-view/super-blur-view.cpp @@ -115,6 +116,10 @@ SET( devel_api_popup_header_files ${devel_api_src_dir}/controls/popup/popup.h ) +SET( devel_api_progress_bar_header_files + ${devel_api_src_dir}/controls/progress-bar/progress-bar-devel.h +) + SET( devel_api_visual_factory_header_files ${devel_api_src_dir}/visual-factory/transition-data.h ${devel_api_src_dir}/visual-factory/visual-factory.h @@ -234,6 +239,7 @@ SET( DEVEL_API_HEADERS ${DEVEL_API_HEADERS} ${devel_api_navigation_view_header_files} ${devel_api_page_turn_view_header_files} ${devel_api_popup_header_files} + ${devel_api_progress_bar_header_files} ${devel_api_visual_factory_header_files} ${devel_api_visuals_header_files} ${devel_api_scene3d_view_header_files} diff --git a/dali-toolkit/internal/controls/progress-bar/progress-bar-impl.cpp b/dali-toolkit/internal/controls/progress-bar/progress-bar-impl.cpp index 2b89fed..4390792 100755 --- a/dali-toolkit/internal/controls/progress-bar/progress-bar-impl.cpp +++ b/dali-toolkit/internal/controls/progress-bar/progress-bar-impl.cpp @@ -28,6 +28,9 @@ #include #include #include +#include +#include +#include #include #include #include @@ -86,6 +89,35 @@ float DEFAULT_VALUE = 0.0f; float DEFAULT_LOWER_BOUND = 0.0f; float DEFAULT_UPPER_BOUND = 1.0f; float DEFAULT_FONT_SIZE = 12.0f; +const char* CIRCULAR_PROGRESS_BAR_STYLE_NAME = "CircularProgressBar"; + + +void BackupVisualProperties( const Control* control, Property::Index index, Property::Map& map ) +{ + Toolkit::Visual::Base visual = DevelControl::GetVisual( *control, index ); + + if( visual ) + { + map.Clear(); + visual.CreatePropertyMap( map ); + } +} + +void RestoreVisualProperties( Control* control, Property::Index index, Property::Map& map, int depth ) +{ + if( !map.Empty() ) + { + Toolkit::Visual::Base visual = DevelControl::GetVisual( *control, index ); + + Visual::Base& visualImpl = Toolkit::GetImplementation( visual ); + + visualImpl.SetProperties( map ); + + DevelControl::UnregisterVisual( *control, index ); + + DevelControl::RegisterVisual( *control, index, visual, true, depth ); + } +} } // Unnamed namespace @@ -93,14 +125,26 @@ float DEFAULT_FONT_SIZE = 12.0f; // ProgressBar /////////////////////////////////////////////////////////////////////////////////////////////////// -Dali::Toolkit::ProgressBar ProgressBar::New() +Dali::Toolkit::ProgressBar ProgressBar::New( DevelProgressBar::Style progressBarStyle ) { // Create the implementation ProgressBarPtr progressBar( new ProgressBar() ); - // Pass ownership to CustomActor via derived handle Dali::Toolkit::ProgressBar handle( *progressBar ); + switch( progressBarStyle ) + { + case DevelProgressBar::Style::CIRCULAR: + { + progressBar->SetStyleName( CIRCULAR_PROGRESS_BAR_STYLE_NAME ); + break; + } + default: + { + break; + } + } + // Second-phase init of the implementation // This can only be done after the CustomActor connection has been made... progressBar->Initialize(); @@ -133,8 +177,6 @@ void ProgressBar::OnRelayout( const Vector2& size, RelayoutContainer& container trackSize.width = std::max( 0.0f, size.width ); // Ensure we don't go negative Toolkit::Visual::Base trackVisual = DevelControl::GetVisual( *this, Toolkit::ProgressBar::Property::TRACK_VISUAL ); - Toolkit::Visual::Base secondProgressVisual = DevelControl::GetVisual( *this, Toolkit::ProgressBar::Property::SECONDARY_PROGRESS_VISUAL ); - Toolkit::Visual::Base progressVisual = DevelControl::GetVisual( *this, Toolkit::ProgressBar::Property::PROGRESS_VISUAL ); Toolkit::Visual::Base labelVisual = DevelControl::GetVisual( *this, Toolkit::ProgressBar::Property::LABEL_VISUAL ); Toolkit::Visual::Base indeterminateVisual = DevelControl::GetVisual( *this, Toolkit::ProgressBar::Property::INDETERMINATE_VISUAL ); @@ -149,29 +191,9 @@ void ProgressBar::OnRelayout( const Vector2& size, RelayoutContainer& container trackVisual.SetTransformAndSize( visualTransform, trackSize ); } - if( secondProgressVisual ) - { - Property::Map visualTransform; - - visualTransform.Add( Toolkit::Visual::Transform::Property::SIZE, Vector2( mDomain.from.x + mSecondaryProgressValue * ( mDomain.to.x - mDomain.from.x ), trackSize.height ) ) - .Add( Toolkit::Visual::Transform::Property::OFFSET_POLICY, Vector2( Toolkit::Visual::Transform::Policy::ABSOLUTE, Toolkit::Visual::Transform::Policy::ABSOLUTE ) ) - .Add( Toolkit::Visual::Transform::Property::SIZE_POLICY, Vector2( Toolkit::Visual::Transform::Policy::ABSOLUTE, Toolkit::Visual::Transform::Policy::ABSOLUTE ) ) - .Add( Toolkit::Visual::Transform::Property::ORIGIN, Toolkit::Align::TOP_BEGIN ) - .Add( Toolkit::Visual::Transform::Property::ANCHOR_POINT, Toolkit::Align::TOP_BEGIN ); - secondProgressVisual.SetTransformAndSize( visualTransform, trackSize ); - } - - if( progressVisual ) - { - Property::Map visualTransform; + ApplyProgressToVisualTransform( mSecondaryProgressValue, trackSize, Toolkit::ProgressBar::Property::SECONDARY_PROGRESS_VISUAL ); - visualTransform.Add( Toolkit::Visual::Transform::Property::SIZE, Vector2( mDomain.from.x + mProgressValue * ( mDomain.to.x - mDomain.from.x ), trackSize.height ) ) - .Add( Toolkit::Visual::Transform::Property::OFFSET_POLICY, Vector2( Toolkit::Visual::Transform::Policy::ABSOLUTE, Toolkit::Visual::Transform::Policy::ABSOLUTE ) ) - .Add( Toolkit::Visual::Transform::Property::SIZE_POLICY, Vector2( Toolkit::Visual::Transform::Policy::ABSOLUTE, Toolkit::Visual::Transform::Policy::ABSOLUTE ) ) - .Add( Toolkit::Visual::Transform::Property::ORIGIN, Toolkit::Align::TOP_BEGIN ) - .Add( Toolkit::Visual::Transform::Property::ANCHOR_POINT, Toolkit::Align::TOP_BEGIN ); - progressVisual.SetTransformAndSize( visualTransform, trackSize ); - } + ApplyProgressToVisualTransform( mProgressValue, trackSize, Toolkit::ProgressBar::Property::PROGRESS_VISUAL ); if( labelVisual ) { @@ -240,6 +262,8 @@ void ProgressBar::SetProgressValue( float value ) { mProgressValue = Clamp( value, DEFAULT_LOWER_BOUND, DEFAULT_UPPER_BOUND ); + ApplyProgressToVisual( mProgressValue, Toolkit::ProgressBar::Property::PROGRESS_VISUAL, ProgressDepthIndex::PROGRESS_VISUAL ); + Toolkit::ProgressBar self = Toolkit::ProgressBar::DownCast( Self() ); mValueChangedSignal.Emit( self, mProgressValue, mSecondaryProgressValue ); RelayoutRequest(); @@ -261,6 +285,8 @@ void ProgressBar::SetSecondaryProgressValue( float value ) { mSecondaryProgressValue = Clamp( value, DEFAULT_LOWER_BOUND, DEFAULT_UPPER_BOUND ); + ApplyProgressToVisual( mSecondaryProgressValue, Toolkit::ProgressBar::Property::SECONDARY_PROGRESS_VISUAL, ProgressDepthIndex::SECONDARY_PROGRESS_VISUAL ); + Toolkit::ProgressBar self = Toolkit::ProgressBar::DownCast( Self() ); mValueChangedSignal.Emit( self, mProgressValue, mSecondaryProgressValue ); @@ -292,6 +318,13 @@ void ProgressBar::SetIndeterminate( bool value ) { mIndeterminateVisualAni.Stop(); } + + // Restore previous visual data after animation finished. + RestoreVisualProperties( this, Toolkit::ProgressBar::Property::TRACK_VISUAL, mTrackVisualMap, ProgressDepthIndex::TRACK_VISUAL ); + RestoreVisualProperties( this, Toolkit::ProgressBar::Property::SECONDARY_PROGRESS_VISUAL, mSecondaryProgressVisualMap, ProgressDepthIndex::SECONDARY_PROGRESS_VISUAL ); + RestoreVisualProperties( this, Toolkit::ProgressBar::Property::PROGRESS_VISUAL, mProgressVisualMap, ProgressDepthIndex::PROGRESS_VISUAL ); + + RelayoutRequest(); } } @@ -311,6 +344,11 @@ void ProgressBar::SetIndeterminateVisualTransition( Toolkit::TransitionData tran void ProgressBar::PlayIndeterminateVisualTransition() { + // Store current visual data before animation changes it. + BackupVisualProperties( this, Toolkit::ProgressBar::Property::TRACK_VISUAL, mTrackVisualMap ); + BackupVisualProperties( this, Toolkit::ProgressBar::Property::SECONDARY_PROGRESS_VISUAL, mSecondaryProgressVisualMap ); + BackupVisualProperties( this, Toolkit::ProgressBar::Property::PROGRESS_VISUAL, mProgressVisualMap ); + if( mIndeterminateVisualAni ) { mIndeterminateVisualAni.Stop(); @@ -404,6 +442,47 @@ bool ProgressBar::GetPropertyMapForVisual( Property::Index visualIndex, Property return success; } + +void ProgressBar::ApplyProgressToVisual( float progress, Property::Index index, int depth ) +{ + Toolkit::Visual::Base visual = DevelControl::GetVisual( *this, index ); + + if( visual && static_cast( visual.GetType() ) == DevelVisual::ARC && !mIndeterminate ) + { + Visual::Base& visualImpl = Toolkit::GetImplementation( visual ); + + Property::Map map; + + map[ Toolkit::DevelArcVisual::Property::SWEEP_ANGLE ] = Property::Value( 360.0f * progress ); + + visualImpl.SetProperties( map ); + + DevelControl::UnregisterVisual( *this, index ); + DevelControl::RegisterVisual( *this, index, visual, true, depth ); + } +} + +void ProgressBar::ApplyProgressToVisualTransform( float progress, Vector2 trackSize, Property::Index index ) +{ + Toolkit::Visual::Base visual = DevelControl::GetVisual( *this, index ); + + if( visual ) + { + Property::Map visualTransform; + + if( static_cast( visual.GetType() ) != DevelVisual::ARC ) + { + visualTransform.Add( Toolkit::Visual::Transform::Property::SIZE, Vector2( mDomain.from.x + progress * ( mDomain.to.x - mDomain.from.x ), trackSize.height ) ) + .Add( Toolkit::Visual::Transform::Property::OFFSET_POLICY, Vector2( Toolkit::Visual::Transform::Policy::ABSOLUTE, Toolkit::Visual::Transform::Policy::ABSOLUTE ) ) + .Add( Toolkit::Visual::Transform::Property::SIZE_POLICY, Vector2( Toolkit::Visual::Transform::Policy::ABSOLUTE, Toolkit::Visual::Transform::Policy::ABSOLUTE ) ) + .Add( Toolkit::Visual::Transform::Property::ORIGIN, Toolkit::Align::TOP_BEGIN ) + .Add( Toolkit::Visual::Transform::Property::ANCHOR_POINT, Toolkit::Align::TOP_BEGIN ); + } + + visual.SetTransformAndSize( visualTransform, trackSize ); + } +} + // Static class method to support script connecting signals bool ProgressBar::DoConnectSignal( BaseObject* object, ConnectionTrackerInterface* tracker, const std::string& signalName, FunctorDelegate* functor ) { @@ -444,12 +523,14 @@ void ProgressBar::SetProperty( BaseObject* object, Property::Index propertyIndex case Toolkit::ProgressBar::Property::SECONDARY_PROGRESS_VISUAL: { progressBarImpl.CreateVisualsForComponent( propertyIndex, value, ProgressDepthIndex::SECONDARY_PROGRESS_VISUAL ); + progressBarImpl.ApplyProgressToVisual( progressBarImpl.mSecondaryProgressValue, propertyIndex, ProgressDepthIndex::SECONDARY_PROGRESS_VISUAL ); break; } case Toolkit::ProgressBar::Property::PROGRESS_VISUAL: { progressBarImpl.CreateVisualsForComponent( propertyIndex, value, ProgressDepthIndex::PROGRESS_VISUAL ); + progressBarImpl.ApplyProgressToVisual( progressBarImpl.mProgressValue, propertyIndex, ProgressDepthIndex::PROGRESS_VISUAL ); break; } diff --git a/dali-toolkit/internal/controls/progress-bar/progress-bar-impl.h b/dali-toolkit/internal/controls/progress-bar/progress-bar-impl.h index 5b0ffd2..31ae483 100755 --- a/dali-toolkit/internal/controls/progress-bar/progress-bar-impl.h +++ b/dali-toolkit/internal/controls/progress-bar/progress-bar-impl.h @@ -18,11 +18,11 @@ * */ - // INTERNAL INCLUDES #include #include #include +#include #include namespace Dali @@ -46,11 +46,11 @@ class ProgressBar : public Control public: /** - * Create a new ProgressBar. - * + * Create a new ProgressBar with predefined style. + * @param[in] progressBarStyle A style value that determines the shape of the progress bar. * @return A public handle to the newly allocated ProgressBar. */ - static Dali::Toolkit::ProgressBar New(); + static Dali::Toolkit::ProgressBar New( DevelProgressBar::Style progressBarStyle = DevelProgressBar::Style::LINEAR ); public: @@ -233,6 +233,16 @@ private: bool GetPropertyMapForVisual( Property::Index visualIndex, Property::Map& retreivedMap ) const; /** + * Apply progress value to visual + */ + void ApplyProgressToVisual( float progress, Property::Index index, int depth ); + + /** + * Apply progress value to visual transform + */ + void ApplyProgressToVisualTransform( float progress, Vector2 trackSize, Property::Index index ); + + /** * Check if we should start animating */ virtual void OnStageConnection( int depth ); @@ -256,6 +266,9 @@ private: float mProgressValue; ///< Current value of ProgressBar float mSecondaryProgressValue; ///< Current loading value of ProgressBar bool mIndeterminate; ///< Whether the progress state is determined or not + Property::Map mTrackVisualMap; ///< To backup visual properties when switching determinate/indeterminate. + Property::Map mProgressVisualMap; ///< To backup visual properties when switching determinate/indeterminate. + Property::Map mSecondaryProgressVisualMap; ///< To backup visual properties when switching determinate/indeterminate. }; } // namespace Internal diff --git a/dali-toolkit/public-api/controls/progress-bar/progress-bar.h b/dali-toolkit/public-api/controls/progress-bar/progress-bar.h index a7b87c2..407e026 100644 --- a/dali-toolkit/public-api/controls/progress-bar/progress-bar.h +++ b/dali-toolkit/public-api/controls/progress-bar/progress-bar.h @@ -158,7 +158,7 @@ public: public: /** - * @brief Creates the ProgressBar control. + * @brief Creates the ProgressBar control. It creates a horizontal linear shape of progress bar. * @SINCE_1_2.60 * @return A handle to the ProgressBar control */ diff --git a/dali-toolkit/styles/1920x1080/dali-toolkit-default-theme.json b/dali-toolkit/styles/1920x1080/dali-toolkit-default-theme.json index 43bd4e5..35dec78 100755 --- a/dali-toolkit/styles/1920x1080/dali-toolkit-default-theme.json +++ b/dali-toolkit/styles/1920x1080/dali-toolkit-default-theme.json @@ -268,6 +268,168 @@ "secondaryProgressValue":0.0, "indeterminate": false }, + "CircularProgressBar": + { + "size":[64,64], + "trackVisual":{ + "visualType":"ARC", + "mixColor":[0.0,0.165,0.302,1.0], + "thickness":4.0, + "startAngle":0.0, + "cap":"ROUND" + }, + "progressVisual":{ + "visualType":"ARC", + "mixColor":[0.0,0.549,1.0,1.0], + "thickness":4.0, + "startAngle":0.0, + "cap":"ROUND" + }, + "secondaryProgressVisual":{ + "visualType":"ARC", + "mixColor":[0.0,0.549,1.0,0.3], + "thickness":4.0, + "startAngle":0.0, + "cap":"ROUND" + }, + "indeterminateVisual":{ + "visualType":"ARC", + "mixColor":[0.02,0.71,0.525,1.0], + "thickness":4.0, + "startAngle":267.0, + "sweepAngle":75.0, + "cap":"ROUND" + }, + "indeterminateVisualAnimation": + [ + { + "target":"trackVisual", + "property":"opacity", + "targetValue": 0, + "animator": + { + "alphaFunction":"DEFAULT", + "timePeriod": + { + "duration":0, + "delay":0 + } + } + }, + { + "target":"secondaryProgressVisual", + "property":"opacity", + "targetValue": 0, + "animator": + { + "alphaFunction":"DEFAULT", + "timePeriod": + { + "duration":0, + "delay":0 + } + } + }, + { + "target":"progressVisual", + "property":"sweepAngle", + "initialValue": 75, + "targetValue": 180, + "animator": + { + "alphaFunction":[0.439, 0.0, 0.718, 0.428], + "timePeriod": + { + "duration":1.0, + "delay":0.0 + } + } + }, + { + "target":"progressVisual", + "property":"sweepAngle", + "targetValue": 75, + "animator": + { + "alphaFunction":[0.224, 0.571, 0.53, 1.0], + "timePeriod": + { + "duration":1.0, + "delay":2.0 + } + } + }, + { + "target":"progressVisual", + "property":"startAngle", + "initialValue": 87, + "targetValue": 1887, + "animator": + { + "alphaFunction":[0.33, 0.0, 0.3, 1.0], + "timePeriod": + { + "duration":3.0, + "delay":0.0 + } + } + }, + { + "target":"indeterminateVisual", + "property":"sweepAngle", + "initialValue": 75, + "targetValue": 180, + "animator": + { + "alphaFunction":[0.439, 0.0, 0.718, 0.428], + "timePeriod": + { + "duration":1.0, + "delay":0.0 + } + } + }, + { + "target":"indeterminateVisual", + "property":"sweepAngle", + "targetValue": 75, + "animator": + { + "alphaFunction":[0.224, 0.571, 0.53, 1.0], + "timePeriod": + { + "duration":1.0, + "delay":2.0 + } + } + }, + { + "target":"indeterminateVisual", + "property":"startAngle", + "initialValue": 267, + "targetValue": 2067, + "animator": + { + "alphaFunction":[0.33, 0.0, 0.3, 1.0], + "timePeriod": + { + "duration":3.0, + "delay":0.0 + } + } + } + ], + "labelVisual":{ + "visualType": "TEXT", + "textColor": [ 1.0, 1.0, 1.0, 1.0 ], + "pointSize" : 12.0, // Point size must always be provided to Text Visual + "horizontalAlignment": "CENTER", + "verticalAlignment": "CENTER" + }, + "progressValue": 0.2, + "secondaryProgressValue":0.4, + "indeterminate": false + }, "Button": { "styles":["Tooltip"], diff --git a/dali-toolkit/styles/2048x1080/dali-toolkit-default-theme.json b/dali-toolkit/styles/2048x1080/dali-toolkit-default-theme.json index 2028c16..d055427 100755 --- a/dali-toolkit/styles/2048x1080/dali-toolkit-default-theme.json +++ b/dali-toolkit/styles/2048x1080/dali-toolkit-default-theme.json @@ -266,6 +266,168 @@ "secondaryProgressValue":0.0, "indeterminate": false }, + "CircularProgressBar": + { + "size":[64,64], + "trackVisual":{ + "visualType":"ARC", + "mixColor":[0.0,0.165,0.302,1.0], + "thickness":4.0, + "startAngle":0.0, + "cap":"ROUND" + }, + "progressVisual":{ + "visualType":"ARC", + "mixColor":[0.0,0.549,1.0,1.0], + "thickness":4.0, + "startAngle":0.0, + "cap":"ROUND" + }, + "secondaryProgressVisual":{ + "visualType":"ARC", + "mixColor":[0.0,0.549,1.0,0.3], + "thickness":4.0, + "startAngle":0.0, + "cap":"ROUND" + }, + "indeterminateVisual":{ + "visualType":"ARC", + "mixColor":[0.02,0.71,0.525,1.0], + "thickness":4.0, + "startAngle":267.0, + "sweepAngle":75.0, + "cap":"ROUND" + }, + "indeterminateVisualAnimation": + [ + { + "target":"trackVisual", + "property":"opacity", + "targetValue": 0, + "animator": + { + "alphaFunction":"DEFAULT", + "timePeriod": + { + "duration":0, + "delay":0 + } + } + }, + { + "target":"secondaryProgressVisual", + "property":"opacity", + "targetValue": 0, + "animator": + { + "alphaFunction":"DEFAULT", + "timePeriod": + { + "duration":0, + "delay":0 + } + } + }, + { + "target":"progressVisual", + "property":"sweepAngle", + "initialValue": 75, + "targetValue": 180, + "animator": + { + "alphaFunction":[0.439, 0.0, 0.718, 0.428], + "timePeriod": + { + "duration":1.0, + "delay":0.0 + } + } + }, + { + "target":"progressVisual", + "property":"sweepAngle", + "targetValue": 75, + "animator": + { + "alphaFunction":[0.224, 0.571, 0.53, 1.0], + "timePeriod": + { + "duration":1.0, + "delay":2.0 + } + } + }, + { + "target":"progressVisual", + "property":"startAngle", + "initialValue": 87, + "targetValue": 1887, + "animator": + { + "alphaFunction":[0.33, 0.0, 0.3, 1.0], + "timePeriod": + { + "duration":3.0, + "delay":0.0 + } + } + }, + { + "target":"indeterminateVisual", + "property":"sweepAngle", + "initialValue": 75, + "targetValue": 180, + "animator": + { + "alphaFunction":[0.439, 0.0, 0.718, 0.428], + "timePeriod": + { + "duration":1.0, + "delay":0.0 + } + } + }, + { + "target":"indeterminateVisual", + "property":"sweepAngle", + "targetValue": 75, + "animator": + { + "alphaFunction":[0.224, 0.571, 0.53, 1.0], + "timePeriod": + { + "duration":1.0, + "delay":2.0 + } + } + }, + { + "target":"indeterminateVisual", + "property":"startAngle", + "initialValue": 267, + "targetValue": 2067, + "animator": + { + "alphaFunction":[0.33, 0.0, 0.3, 1.0], + "timePeriod": + { + "duration":3.0, + "delay":0.0 + } + } + } + ], + "labelVisual":{ + "visualType": "TEXT", + "textColor": [ 1.0, 1.0, 1.0, 1.0 ], + "pointSize" : 12.0, // Point size must always be provided to Text Visual + "horizontalAlignment": "CENTER", + "verticalAlignment": "CENTER" + }, + "progressValue": 0.2, + "secondaryProgressValue":0.4, + "indeterminate": false + }, "Button": { "styles":["Tooltip"], diff --git a/dali-toolkit/styles/360x360/dali-toolkit-default-theme.json b/dali-toolkit/styles/360x360/dali-toolkit-default-theme.json index 36db9a1..14fdc1e 100644 --- a/dali-toolkit/styles/360x360/dali-toolkit-default-theme.json +++ b/dali-toolkit/styles/360x360/dali-toolkit-default-theme.json @@ -293,6 +293,168 @@ "secondaryProgressValue":0.0, "indeterminate": false }, + "CircularProgressBar": + { + "size":[64,64], + "trackVisual":{ + "visualType":"ARC", + "mixColor":[0.0,0.165,0.302,1.0], + "thickness":4.0, + "startAngle":0.0, + "cap":"ROUND" + }, + "progressVisual":{ + "visualType":"ARC", + "mixColor":[0.0,0.549,1.0,1.0], + "thickness":4.0, + "startAngle":0.0, + "cap":"ROUND" + }, + "secondaryProgressVisual":{ + "visualType":"ARC", + "mixColor":[0.0,0.549,1.0,0.3], + "thickness":4.0, + "startAngle":0.0, + "cap":"ROUND" + }, + "indeterminateVisual":{ + "visualType":"ARC", + "mixColor":[0.02,0.71,0.525,1.0], + "thickness":4.0, + "startAngle":267.0, + "sweepAngle":75.0, + "cap":"ROUND" + }, + "indeterminateVisualAnimation": + [ + { + "target":"trackVisual", + "property":"opacity", + "targetValue": 0, + "animator": + { + "alphaFunction":"DEFAULT", + "timePeriod": + { + "duration":0, + "delay":0 + } + } + }, + { + "target":"secondaryProgressVisual", + "property":"opacity", + "targetValue": 0, + "animator": + { + "alphaFunction":"DEFAULT", + "timePeriod": + { + "duration":0, + "delay":0 + } + } + }, + { + "target":"progressVisual", + "property":"sweepAngle", + "initialValue": 75, + "targetValue": 180, + "animator": + { + "alphaFunction":[0.439, 0.0, 0.718, 0.428], + "timePeriod": + { + "duration":1.0, + "delay":0.0 + } + } + }, + { + "target":"progressVisual", + "property":"sweepAngle", + "targetValue": 75, + "animator": + { + "alphaFunction":[0.224, 0.571, 0.53, 1.0], + "timePeriod": + { + "duration":1.0, + "delay":2.0 + } + } + }, + { + "target":"progressVisual", + "property":"startAngle", + "initialValue": 87, + "targetValue": 1887, + "animator": + { + "alphaFunction":[0.33, 0.0, 0.3, 1.0], + "timePeriod": + { + "duration":3.0, + "delay":0.0 + } + } + }, + { + "target":"indeterminateVisual", + "property":"sweepAngle", + "initialValue": 75, + "targetValue": 180, + "animator": + { + "alphaFunction":[0.439, 0.0, 0.718, 0.428], + "timePeriod": + { + "duration":1.0, + "delay":0.0 + } + } + }, + { + "target":"indeterminateVisual", + "property":"sweepAngle", + "targetValue": 75, + "animator": + { + "alphaFunction":[0.224, 0.571, 0.53, 1.0], + "timePeriod": + { + "duration":1.0, + "delay":2.0 + } + } + }, + { + "target":"indeterminateVisual", + "property":"startAngle", + "initialValue": 267, + "targetValue": 2067, + "animator": + { + "alphaFunction":[0.33, 0.0, 0.3, 1.0], + "timePeriod": + { + "duration":3.0, + "delay":0.0 + } + } + } + ], + "labelVisual":{ + "visualType": "TEXT", + "textColor": [ 1.0, 1.0, 1.0, 1.0 ], + "pointSize" : 12.0, // Point size must always be provided to Text Visual + "horizontalAlignment": "CENTER", + "verticalAlignment": "CENTER" + }, + "progressValue": 0.2, + "secondaryProgressValue":0.4, + "indeterminate": false + }, "Button": { "initialAutoRepeatingDelay":2.0, diff --git a/dali-toolkit/styles/480x800/dali-toolkit-default-theme.json b/dali-toolkit/styles/480x800/dali-toolkit-default-theme.json index f35f988..a5d23aa 100644 --- a/dali-toolkit/styles/480x800/dali-toolkit-default-theme.json +++ b/dali-toolkit/styles/480x800/dali-toolkit-default-theme.json @@ -322,6 +322,168 @@ "secondaryProgressValue":0.0, "indeterminate": false }, + "CircularProgressBar": + { + "size":[64,64], + "trackVisual":{ + "visualType":"ARC", + "mixColor":[0.0,0.165,0.302,1.0], + "thickness":4.0, + "startAngle":0.0, + "cap":"ROUND" + }, + "progressVisual":{ + "visualType":"ARC", + "mixColor":[0.0,0.549,1.0,1.0], + "thickness":4.0, + "startAngle":0.0, + "cap":"ROUND" + }, + "secondaryProgressVisual":{ + "visualType":"ARC", + "mixColor":[0.0,0.549,1.0,0.3], + "thickness":4.0, + "startAngle":0.0, + "cap":"ROUND" + }, + "indeterminateVisual":{ + "visualType":"ARC", + "mixColor":[0.02,0.71,0.525,1.0], + "thickness":4.0, + "startAngle":267.0, + "sweepAngle":75.0, + "cap":"ROUND" + }, + "indeterminateVisualAnimation": + [ + { + "target":"trackVisual", + "property":"opacity", + "targetValue": 0, + "animator": + { + "alphaFunction":"DEFAULT", + "timePeriod": + { + "duration":0, + "delay":0 + } + } + }, + { + "target":"secondaryProgressVisual", + "property":"opacity", + "targetValue": 0, + "animator": + { + "alphaFunction":"DEFAULT", + "timePeriod": + { + "duration":0, + "delay":0 + } + } + }, + { + "target":"progressVisual", + "property":"sweepAngle", + "initialValue": 75, + "targetValue": 180, + "animator": + { + "alphaFunction":[0.439, 0.0, 0.718, 0.428], + "timePeriod": + { + "duration":1.0, + "delay":0.0 + } + } + }, + { + "target":"progressVisual", + "property":"sweepAngle", + "targetValue": 75, + "animator": + { + "alphaFunction":[0.224, 0.571, 0.53, 1.0], + "timePeriod": + { + "duration":1.0, + "delay":2.0 + } + } + }, + { + "target":"progressVisual", + "property":"startAngle", + "initialValue": 87, + "targetValue": 1887, + "animator": + { + "alphaFunction":[0.33, 0.0, 0.3, 1.0], + "timePeriod": + { + "duration":3.0, + "delay":0.0 + } + } + }, + { + "target":"indeterminateVisual", + "property":"sweepAngle", + "initialValue": 75, + "targetValue": 180, + "animator": + { + "alphaFunction":[0.439, 0.0, 0.718, 0.428], + "timePeriod": + { + "duration":1.0, + "delay":0.0 + } + } + }, + { + "target":"indeterminateVisual", + "property":"sweepAngle", + "targetValue": 75, + "animator": + { + "alphaFunction":[0.224, 0.571, 0.53, 1.0], + "timePeriod": + { + "duration":1.0, + "delay":2.0 + } + } + }, + { + "target":"indeterminateVisual", + "property":"startAngle", + "initialValue": 267, + "targetValue": 2067, + "animator": + { + "alphaFunction":[0.33, 0.0, 0.3, 1.0], + "timePeriod": + { + "duration":3.0, + "delay":0.0 + } + } + } + ], + "labelVisual":{ + "visualType": "TEXT", + "textColor": [ 1.0, 1.0, 1.0, 1.0 ], + "pointSize" : 12.0, // Point size must always be provided to Text Visual + "horizontalAlignment": "CENTER", + "verticalAlignment": "CENTER" + }, + "progressValue": 0.2, + "secondaryProgressValue":0.4, + "indeterminate": false + }, "Button": { "styles":["Tooltip"], diff --git a/dali-toolkit/styles/720x1280/dali-toolkit-default-theme.json b/dali-toolkit/styles/720x1280/dali-toolkit-default-theme.json index 1a9d7ab..3627ef4 100644 --- a/dali-toolkit/styles/720x1280/dali-toolkit-default-theme.json +++ b/dali-toolkit/styles/720x1280/dali-toolkit-default-theme.json @@ -288,6 +288,168 @@ "secondaryProgressValue":0.0, "indeterminate": false }, + "CircularProgressBar": + { + "size":[64,64], + "trackVisual":{ + "visualType":"ARC", + "mixColor":[0.0,0.165,0.302,1.0], + "thickness":4.0, + "startAngle":0.0, + "cap":"ROUND" + }, + "progressVisual":{ + "visualType":"ARC", + "mixColor":[0.0,0.549,1.0,1.0], + "thickness":4.0, + "startAngle":0.0, + "cap":"ROUND" + }, + "secondaryProgressVisual":{ + "visualType":"ARC", + "mixColor":[0.0,0.549,1.0,0.3], + "thickness":4.0, + "startAngle":0.0, + "cap":"ROUND" + }, + "indeterminateVisual":{ + "visualType":"ARC", + "mixColor":[0.02,0.71,0.525,1.0], + "thickness":4.0, + "startAngle":267.0, + "sweepAngle":75.0, + "cap":"ROUND" + }, + "indeterminateVisualAnimation": + [ + { + "target":"trackVisual", + "property":"opacity", + "targetValue": 0, + "animator": + { + "alphaFunction":"DEFAULT", + "timePeriod": + { + "duration":0, + "delay":0 + } + } + }, + { + "target":"secondaryProgressVisual", + "property":"opacity", + "targetValue": 0, + "animator": + { + "alphaFunction":"DEFAULT", + "timePeriod": + { + "duration":0, + "delay":0 + } + } + }, + { + "target":"progressVisual", + "property":"sweepAngle", + "initialValue": 75, + "targetValue": 180, + "animator": + { + "alphaFunction":[0.439, 0.0, 0.718, 0.428], + "timePeriod": + { + "duration":1.0, + "delay":0.0 + } + } + }, + { + "target":"progressVisual", + "property":"sweepAngle", + "targetValue": 75, + "animator": + { + "alphaFunction":[0.224, 0.571, 0.53, 1.0], + "timePeriod": + { + "duration":1.0, + "delay":2.0 + } + } + }, + { + "target":"progressVisual", + "property":"startAngle", + "initialValue": 87, + "targetValue": 1887, + "animator": + { + "alphaFunction":[0.33, 0.0, 0.3, 1.0], + "timePeriod": + { + "duration":3.0, + "delay":0.0 + } + } + }, + { + "target":"indeterminateVisual", + "property":"sweepAngle", + "initialValue": 75, + "targetValue": 180, + "animator": + { + "alphaFunction":[0.439, 0.0, 0.718, 0.428], + "timePeriod": + { + "duration":1.0, + "delay":0.0 + } + } + }, + { + "target":"indeterminateVisual", + "property":"sweepAngle", + "targetValue": 75, + "animator": + { + "alphaFunction":[0.224, 0.571, 0.53, 1.0], + "timePeriod": + { + "duration":1.0, + "delay":2.0 + } + } + }, + { + "target":"indeterminateVisual", + "property":"startAngle", + "initialValue": 267, + "targetValue": 2067, + "animator": + { + "alphaFunction":[0.33, 0.0, 0.3, 1.0], + "timePeriod": + { + "duration":3.0, + "delay":0.0 + } + } + } + ], + "labelVisual":{ + "visualType": "TEXT", + "textColor": [ 1.0, 1.0, 1.0, 1.0 ], + "pointSize" : 12.0, // Point size must always be provided to Text Visual + "horizontalAlignment": "CENTER", + "verticalAlignment": "CENTER" + }, + "progressValue": 0.2, + "secondaryProgressValue":0.4, + "indeterminate": false + }, "Button": { "initialAutoRepeatingDelay":2.0,