Commit df6b2d6fe20310eddd269892dcef84aca24bc409
1 parent
94209fff
Absolute layout demo
Change-Id: I5b722e7aadcbbd4b308d07b61d19e78891f5eddd
Showing
5 changed files
with
240 additions
and
7 deletions
examples/layouting/absolute-example.cpp
0 → 100644
| 1 | +/* | |
| 2 | + * Copyright (c) 2017 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 "absolute-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/absolute-layout.h> | |
| 24 | + | |
| 25 | +using namespace Dali; | |
| 26 | +using namespace Dali::Toolkit; | |
| 27 | + | |
| 28 | + | |
| 29 | +namespace | |
| 30 | +{ | |
| 31 | + | |
| 32 | +struct ImageDetails | |
| 33 | +{ | |
| 34 | + const char * name; | |
| 35 | + Vector2 position; | |
| 36 | + Size size; | |
| 37 | +}; | |
| 38 | + | |
| 39 | +ImageDetails IMAGES[] = | |
| 40 | +{ | |
| 41 | + { DEMO_IMAGE_DIR "gallery-small-23.jpg", Vector2( 0.0f, 0.0f ), Size( 100.0f, 100.0f ) }, | |
| 42 | + { DEMO_IMAGE_DIR "gallery-small-23.jpg", Vector2( 100.0f, 0.0f ), Size( 100.0f, 100.0f ) }, | |
| 43 | + { DEMO_IMAGE_DIR "gallery-small-23.jpg", Vector2( 0.0f, 100.0f ), Size( 100.0f, 100.0f ) }, | |
| 44 | + { DEMO_IMAGE_DIR "gallery-small-23.jpg", Vector2( 200.0f, 200.0f ), Size( 100.0f, 100.0f ) }, | |
| 45 | +}; | |
| 46 | +unsigned int IMAGE_COUNT=sizeof(IMAGES)/sizeof(IMAGES[0]); | |
| 47 | + | |
| 48 | +// Helper function to create ImageViews with given filename and size. | |
| 49 | +void CreateChildImageView( ImageView& imageView, unsigned imageIndex ) | |
| 50 | +{ | |
| 51 | + imageView = ImageView::New(); | |
| 52 | + Property::Map imagePropertyMap; | |
| 53 | + imagePropertyMap[ Visual::Property::TYPE ] = Toolkit::Visual::IMAGE; | |
| 54 | + imagePropertyMap[ ImageVisual::Property::URL ] = IMAGES[imageIndex].name; | |
| 55 | + imagePropertyMap[ ImageVisual::Property::DESIRED_WIDTH ] = IMAGES[imageIndex].size.width ; | |
| 56 | + imagePropertyMap[ ImageVisual::Property::DESIRED_HEIGHT ] = IMAGES[imageIndex].size.height; | |
| 57 | + imageView.SetProperty( ImageView::Property::IMAGE , imagePropertyMap ); | |
| 58 | + imageView.SetName("ImageView"); | |
| 59 | + imageView.SetAnchorPoint( AnchorPoint::TOP_LEFT ); | |
| 60 | + imageView.SetResizePolicy( ResizePolicy::FIXED, Dimension::ALL_DIMENSIONS ); | |
| 61 | + imageView.SetProperty( Dali::Actor::Property::POSITION, Vector3( IMAGES[imageIndex].position ) ); | |
| 62 | +} | |
| 63 | + | |
| 64 | +} // namespace | |
| 65 | + | |
| 66 | +namespace Demo | |
| 67 | +{ | |
| 68 | + | |
| 69 | +AbsoluteExample::AbsoluteExample() | |
| 70 | +: mRootLayoutControl(), | |
| 71 | + mAbsoluteLayoutContainer(), | |
| 72 | + mLayoutSizeToggleStatus( true ), | |
| 73 | + mToggleButton() | |
| 74 | +{ | |
| 75 | + | |
| 76 | +} | |
| 77 | + | |
| 78 | +void AbsoluteExample::Create() | |
| 79 | +{ | |
| 80 | + // Create a root layout, ideally Dali would have a default layout in the root layer. | |
| 81 | + // Without this root layer the mAbsoluteLayout (or any other layout) will not | |
| 82 | + // honour WIDTH_SPECIFICATION or HEIGHT_SPECIFICATION settings. | |
| 83 | + // It uses the default stage size and ideally should have a layout added to it. | |
| 84 | + auto stage = Stage::GetCurrent(); | |
| 85 | + mRootLayoutControl = Control::New(); | |
| 86 | + auto rootLayout = AbsoluteLayout::New(); | |
| 87 | + DevelControl::SetLayout( mRootLayoutControl, rootLayout ); | |
| 88 | + mRootLayoutControl.SetAnchorPoint( AnchorPoint::CENTER ); | |
| 89 | + mRootLayoutControl.SetParentOrigin( ParentOrigin::CENTER ); | |
| 90 | + stage.Add( mRootLayoutControl ); | |
| 91 | + | |
| 92 | + // Create an Absolute Layout to show ImageViews at explictly provided positions. | |
| 93 | + mAbsoluteLayoutContainer = Control::New(); | |
| 94 | + mAbsoluteLayoutContainer.SetBackgroundColor( Color::WHITE ); | |
| 95 | + auto absoluteLayout = AbsoluteLayout::New(); | |
| 96 | + DevelControl::SetLayout( mAbsoluteLayoutContainer, absoluteLayout ); | |
| 97 | + mAbsoluteLayoutContainer.SetName("AbsoluteLayout"); | |
| 98 | + | |
| 99 | + mAbsoluteLayoutContainer.SetAnchorPoint( AnchorPoint::CENTER ); | |
| 100 | + mAbsoluteLayoutContainer.SetParentOrigin( ParentOrigin::CENTER ); | |
| 101 | + | |
| 102 | + // Initially absolute layout to use these specifications, toggle button will alter them. | |
| 103 | + mAbsoluteLayoutContainer.SetProperty( LayoutItem::ChildProperty::WIDTH_SPECIFICATION, ChildLayoutData::WRAP_CONTENT ); | |
| 104 | + mAbsoluteLayoutContainer.SetProperty( LayoutItem::ChildProperty::HEIGHT_SPECIFICATION, ChildLayoutData::WRAP_CONTENT ); | |
| 105 | + | |
| 106 | + mRootLayoutControl.Add( mAbsoluteLayoutContainer ); | |
| 107 | + | |
| 108 | + for( unsigned int x = 0; x < NUMBER_OF_IMAGE_VIEWS; x++ ) | |
| 109 | + { | |
| 110 | + CreateChildImageView( mImageViews[x], x%IMAGE_COUNT ); | |
| 111 | + mAbsoluteLayoutContainer.Add( mImageViews[x] ); | |
| 112 | + } | |
| 113 | + | |
| 114 | + // Button toggles the size of the layout | |
| 115 | + mToggleButton = PushButton::New(); | |
| 116 | + mToggleButton.SetProperty( Toolkit::Button::Property::LABEL, "Change layout size" ); | |
| 117 | + mToggleButton.SetParentOrigin( ParentOrigin::BOTTOM_CENTER ); | |
| 118 | + mToggleButton.SetAnchorPoint( AnchorPoint::BOTTOM_CENTER ); | |
| 119 | + mToggleButton.ClickedSignal().Connect( this, &Demo::AbsoluteExample::ChangeSizeClicked ); | |
| 120 | + mToggleButton.SetResizePolicy( ResizePolicy::FILL_TO_PARENT, Dimension::WIDTH ); | |
| 121 | + mToggleButton.SetResizePolicy( ResizePolicy::USE_NATURAL_SIZE, Dimension::HEIGHT ); | |
| 122 | + | |
| 123 | + stage.Add( mToggleButton ); | |
| 124 | + | |
| 125 | +} | |
| 126 | + | |
| 127 | +void AbsoluteExample::Remove() | |
| 128 | +{ | |
| 129 | + UnparentAndReset( mAbsoluteLayoutContainer ); | |
| 130 | + UnparentAndReset( mToggleButton ); | |
| 131 | + UnparentAndReset( mRootLayoutControl ); | |
| 132 | +} | |
| 133 | + | |
| 134 | +bool AbsoluteExample::ChangeSizeClicked( Toolkit::Button button ) | |
| 135 | +{ | |
| 136 | + if ( true == mLayoutSizeToggleStatus ) | |
| 137 | + { | |
| 138 | + mAbsoluteLayoutContainer.SetProperty( LayoutItem::ChildProperty::WIDTH_SPECIFICATION, 480 ); | |
| 139 | + mAbsoluteLayoutContainer.SetProperty( LayoutItem::ChildProperty::HEIGHT_SPECIFICATION, 700 ); | |
| 140 | + mLayoutSizeToggleStatus = false; | |
| 141 | + } | |
| 142 | + else | |
| 143 | + { | |
| 144 | + mAbsoluteLayoutContainer.SetProperty( LayoutItem::ChildProperty::WIDTH_SPECIFICATION, ChildLayoutData::WRAP_CONTENT ); | |
| 145 | + mAbsoluteLayoutContainer.SetProperty( LayoutItem::ChildProperty::HEIGHT_SPECIFICATION, ChildLayoutData::WRAP_CONTENT ); | |
| 146 | + mLayoutSizeToggleStatus = true; | |
| 147 | + } | |
| 148 | + | |
| 149 | + return true; | |
| 150 | +} | |
| 151 | + | |
| 152 | +} // namespace Demo | |
| 0 | 153 | \ No newline at end of file | ... | ... |
examples/layouting/absolute-example.h
0 → 100644
| 1 | +#ifndef DALI_DEMO_ABSOLUTE_EXAMPLE_H | |
| 2 | +#define DALI_DEMO_ABSOLUTE_EXAMPLE_H | |
| 3 | + | |
| 4 | +/* | |
| 5 | + * Copyright (c) 2017 Samsung Electronics Co., Ltd. | |
| 6 | + * | |
| 7 | + * Licensed under the Apache License, Version 2.0 (the "License"); | |
| 8 | + * you may not use this file except in compliance with the License. | |
| 9 | + * You may obtain a copy of the License at | |
| 10 | + * | |
| 11 | + * http://www.apache.org/licenses/LICENSE-2.0 | |
| 12 | + * | |
| 13 | + * Unless required by applicable law or agreed to in writing, software | |
| 14 | + * distributed under the License is distributed on an "AS IS" BASIS, | |
| 15 | + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. | |
| 16 | + * See the License for the specific language governing permissions and | |
| 17 | + * limitations under the License. | |
| 18 | + * | |
| 19 | + */ | |
| 20 | + | |
| 21 | +#include <string> | |
| 22 | +#include <dali/dali.h> | |
| 23 | +#include <dali-toolkit/dali-toolkit.h> | |
| 24 | +#include "example.h" | |
| 25 | + | |
| 26 | +using namespace Dali; | |
| 27 | +using namespace Dali::Toolkit; | |
| 28 | + | |
| 29 | +namespace Demo | |
| 30 | +{ | |
| 31 | + | |
| 32 | +/** | |
| 33 | + * @file absolute-example.hcpp | |
| 34 | + * @brief Example of a Linear Layout with padding applied, enables updating of padding values for | |
| 35 | + * one of the children. | |
| 36 | + */ | |
| 37 | +class AbsoluteExample: public ConnectionTracker, public Example | |
| 38 | +{ | |
| 39 | +public: | |
| 40 | + static const unsigned int NUMBER_OF_IMAGE_VIEWS = 4; | |
| 41 | + | |
| 42 | + AbsoluteExample(); | |
| 43 | + | |
| 44 | + // Creates a Absolute Layout Example and displays it. | |
| 45 | + virtual void Create() override; | |
| 46 | + | |
| 47 | + // Remove and destroy this layout | |
| 48 | + virtual void Remove() override; | |
| 49 | + | |
| 50 | +private: | |
| 51 | + | |
| 52 | + | |
| 53 | + // Callback when change size button is pressed | |
| 54 | + bool ChangeSizeClicked( Toolkit::Button button ); | |
| 55 | + | |
| 56 | +private: | |
| 57 | + | |
| 58 | + Toolkit::Control mRootLayoutControl; | |
| 59 | + Toolkit::Control mAbsoluteLayoutContainer; | |
| 60 | + Toolkit::ImageView mImageViews[ NUMBER_OF_IMAGE_VIEWS ]; | |
| 61 | + bool mLayoutSizeToggleStatus; | |
| 62 | + Toolkit::PushButton mToggleButton; | |
| 63 | +}; | |
| 64 | + | |
| 65 | +} // namespace Demo | |
| 66 | + | |
| 67 | +#endif // DALI_DEMO_ABSOLUTE_EXAMPLE_H | ... | ... |
examples/layouting/layouting-examples.cpp
| ... | ... | @@ -27,6 +27,7 @@ |
| 27 | 27 | #include "linear-example.h" |
| 28 | 28 | #include "padding-example.h" |
| 29 | 29 | #include "example.h" |
| 30 | +#include "absolute-example.h" | |
| 30 | 31 | |
| 31 | 32 | using namespace Dali; |
| 32 | 33 | using namespace Dali::Toolkit; |
| ... | ... | @@ -47,6 +48,7 @@ void CreateExamples( ExampleContainer& container ) |
| 47 | 48 | { |
| 48 | 49 | container.push_back( ExamplePointer( new Demo::LinearExample ) ); |
| 49 | 50 | container.push_back( ExamplePointer( new Demo::PaddingExample ) ); |
| 51 | + container.push_back( ExamplePointer( new Demo::AbsoluteExample ) ); | |
| 50 | 52 | } |
| 51 | 53 | |
| 52 | 54 | } // anonymous namespace | ... | ... |
examples/layouting/linear-example.cpp
examples/layouting/padding-example.cpp
| ... | ... | @@ -21,6 +21,7 @@ |
| 21 | 21 | #include <dali-toolkit/devel-api/visual-factory/visual-factory.h> |
| 22 | 22 | #include <dali-toolkit/devel-api/controls/control-devel.h> |
| 23 | 23 | #include <dali-toolkit/devel-api/layouting/hbox-layout.h> |
| 24 | +#include <dali-toolkit/devel-api/layouting/absolute-layout.h> | |
| 24 | 25 | |
| 25 | 26 | using namespace Dali; |
| 26 | 27 | using namespace Dali::Toolkit; |
| ... | ... | @@ -53,9 +54,19 @@ void PaddingExample::Create() |
| 53 | 54 | { |
| 54 | 55 | // The Init signal is received once (only) during the Application lifetime |
| 55 | 56 | |
| 56 | - // Creates a default view with a default tool bar. | |
| 57 | - // The view is added to the stage. | |
| 57 | + // Create a root layout, ideally Dali would have a default layout in the root layer. | |
| 58 | + // Without this root layer the mAbsoluteLayout (or any other layout) will not | |
| 59 | + // honour WIDTH_SPECIFICATION or HEIGHT_SPECIFICATION settings. | |
| 60 | + // It uses the default stage size and ideally should have a layout added to it. | |
| 58 | 61 | auto stage = Stage::GetCurrent(); |
| 62 | + auto rootLayoutControl = Control::New(); | |
| 63 | + rootLayoutControl.SetName( "AbsoluteLayout"); | |
| 64 | + auto rootLayout = AbsoluteLayout::New(); | |
| 65 | + DevelControl::SetLayout( rootLayoutControl, rootLayout ); | |
| 66 | + rootLayoutControl.SetAnchorPoint( AnchorPoint::CENTER ); | |
| 67 | + rootLayoutControl.SetParentOrigin( ParentOrigin::CENTER ); | |
| 68 | + stage.Add( rootLayoutControl ); | |
| 69 | + | |
| 59 | 70 | // Create a table view to show a pair of buttons above each image. |
| 60 | 71 | mHorizontalBox = Control::New(); |
| 61 | 72 | |
| ... | ... | @@ -63,11 +74,13 @@ void PaddingExample::Create() |
| 63 | 74 | auto hboxLayout = HboxLayout::New(); |
| 64 | 75 | DevelControl::SetLayout( mHorizontalBox, hboxLayout ); |
| 65 | 76 | mHorizontalBox.SetName("HBox"); |
| 66 | - | |
| 77 | + mHorizontalBox.SetBackgroundColor( Color::WHITE ); | |
| 78 | + mHorizontalBox.SetProperty( LayoutItem::ChildProperty::WIDTH_SPECIFICATION, 480 ); | |
| 79 | + mHorizontalBox.SetProperty( LayoutItem::ChildProperty::HEIGHT_SPECIFICATION, 700 ); | |
| 67 | 80 | mHorizontalBox.SetAnchorPoint( AnchorPoint::CENTER ); |
| 68 | 81 | mHorizontalBox.SetParentOrigin( ParentOrigin::CENTER ); |
| 69 | 82 | |
| 70 | - stage.Add( mHorizontalBox ); | |
| 83 | + rootLayoutControl.Add( mHorizontalBox ); | |
| 71 | 84 | |
| 72 | 85 | mToggleButton = Toolkit::PushButton::New(); |
| 73 | 86 | mToggleButton.SetProperty( Toolkit::Button::Property::LABEL, "Toggle Padding on #2" ); |
| ... | ... | @@ -86,13 +99,13 @@ void PaddingExample::Create() |
| 86 | 99 | // Set Padding for second ImageView |
| 87 | 100 | if( 1 == x ) |
| 88 | 101 | { |
| 89 | - mImageViews[x].SetProperty(Toolkit::Control::Property::PADDING, Extents(10.0f,10.0f,5.0f, 5.0f)); | |
| 102 | + mImageViews[x].SetProperty(Toolkit::Control::Property::PADDING, Extents( 10.0f,10.0f,5.0f, 5.0f)); | |
| 90 | 103 | } |
| 91 | 104 | |
| 92 | 105 | // Set margin for first ImageView |
| 93 | 106 | if( 0 == x ) |
| 94 | 107 | { |
| 95 | - mImageViews[x].SetProperty(Toolkit::Control::Property::MARGIN, Extents(10.0f,10.0f,0.0f, 0.0f)); | |
| 108 | + mImageViews[x].SetProperty(Toolkit::Control::Property::MARGIN, Extents( 10.0f,10.0f,0.0f, 0.0f)); | |
| 96 | 109 | } |
| 97 | 110 | |
| 98 | 111 | mHorizontalBox.Add( mImageViews[x] ); | ... | ... |