Commit f0460f9dfeb9a6719f6e90ed016c1a75ba6205c2
Committed by
Adeel Kazmi
1 parent
7d3f96ae
Simple example to show off layouts and transitions
Change-Id: I62365ce561fc9f699aea1b8f2d5b56b43f380b78
Showing
5 changed files
with
222 additions
and
0 deletions
examples/layouting/layouting-example.cpp
0 → 100644
| 1 | +/* | ||
| 2 | + * Copyright (c) 2018 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 "shared/view.h" | ||
| 20 | +#include <dali/dali.h> | ||
| 21 | +#include <dali-toolkit/dali-toolkit.h> | ||
| 22 | +#include <dali-toolkit/devel-api/visuals/image-visual-properties-devel.h> | ||
| 23 | +#include <dali-toolkit/devel-api/visual-factory/visual-factory.h> | ||
| 24 | +#include <dali-toolkit/devel-api/controls/control-devel.h> | ||
| 25 | +#include <dali-toolkit/devel-api/layouting/hbox-layout.h> | ||
| 26 | +#include <dali-toolkit/devel-api/layouting/vbox-layout.h> | ||
| 27 | + | ||
| 28 | +using namespace Dali; | ||
| 29 | +using namespace Dali::Toolkit; | ||
| 30 | + | ||
| 31 | +namespace | ||
| 32 | +{ | ||
| 33 | + | ||
| 34 | +const char* BACKGROUND_IMAGE( DEMO_IMAGE_DIR "lake_front.jpg" ); | ||
| 35 | +const char* TOOLBAR_IMAGE( DEMO_IMAGE_DIR "top-bar.png" ); | ||
| 36 | + | ||
| 37 | +const char* LTR_IMAGE( DEMO_IMAGE_DIR "icon-play.png" ); | ||
| 38 | +const char* LTR_SELECTED_IMAGE( DEMO_IMAGE_DIR "icon-play-selected.png" ); | ||
| 39 | + | ||
| 40 | +const char* RTL_IMAGE( DEMO_IMAGE_DIR "icon-reverse.png" ); | ||
| 41 | +const char* RTL_SELECTED_IMAGE( DEMO_IMAGE_DIR "icon-reverse-selected.png" ); | ||
| 42 | + | ||
| 43 | +const char* ROTATE_CLOCKWISE_IMAGE( DEMO_IMAGE_DIR "icon-reset.png" ); | ||
| 44 | +const char* ROTATE_CLOCKWISE_SELECTED_IMAGE( DEMO_IMAGE_DIR "icon-reset-selected.png" ); | ||
| 45 | + | ||
| 46 | +//const char* ROTATE_ANTICLOCKWISE_IMAGE( DEMO_IMAGE_DIR "icon-rotate-anticlockwise.png" ); | ||
| 47 | +//const char* ROTATE_ANTICLOCKWISE_SELECTED_IMAGE( DEMO_IMAGE_DIR "icon-rotate-anticlockwise-selected.png" ); | ||
| 48 | + | ||
| 49 | + | ||
| 50 | +const char* APPLICATION_TITLE( "Layout tester" ); | ||
| 51 | + | ||
| 52 | +const char* IMAGE_PATH[] = { | ||
| 53 | + DEMO_IMAGE_DIR "application-icon-101.png", | ||
| 54 | + DEMO_IMAGE_DIR "application-icon-102.png", | ||
| 55 | + DEMO_IMAGE_DIR "application-icon-103.png", | ||
| 56 | + DEMO_IMAGE_DIR "application-icon-104.png" | ||
| 57 | +}; | ||
| 58 | +const unsigned int NUMBER_OF_RESOURCES = sizeof(IMAGE_PATH) / sizeof(char*); | ||
| 59 | + | ||
| 60 | +} // namespace | ||
| 61 | + | ||
| 62 | +class LayoutingExample: public ConnectionTracker | ||
| 63 | +{ | ||
| 64 | + public: | ||
| 65 | + | ||
| 66 | + LayoutingExample( Application& application ) | ||
| 67 | + : mApplication( application ), | ||
| 68 | + mDirection( false ) | ||
| 69 | + { | ||
| 70 | + // Connect to the Application's Init signal | ||
| 71 | + mApplication.InitSignal().Connect( this, &LayoutingExample::Create ); | ||
| 72 | + } | ||
| 73 | + | ||
| 74 | + ~LayoutingExample() | ||
| 75 | + { | ||
| 76 | + // Nothing to do here | ||
| 77 | + } | ||
| 78 | + | ||
| 79 | + void Create( Application& application ) | ||
| 80 | + { | ||
| 81 | + // The Init signal is received once (only) during the Application lifetime | ||
| 82 | + auto stage = Stage::GetCurrent(); | ||
| 83 | + | ||
| 84 | + auto bg = ImageView::New( BACKGROUND_IMAGE ); | ||
| 85 | + bg.SetParentOrigin( ParentOrigin::CENTER ); | ||
| 86 | + stage.Add( bg ); | ||
| 87 | + auto toolbar = ImageView::New( TOOLBAR_IMAGE ); | ||
| 88 | + toolbar.SetParentOrigin( ParentOrigin::TOP_CENTER ); | ||
| 89 | + toolbar.SetAnchorPoint( AnchorPoint::TOP_CENTER ); | ||
| 90 | + toolbar.SetResizePolicy( ResizePolicy::FILL_TO_PARENT, Dimension::WIDTH ); | ||
| 91 | + toolbar.SetProperty( Actor::Property::SIZE_HEIGHT, 50.0f); | ||
| 92 | + | ||
| 93 | + stage.Add( toolbar ); | ||
| 94 | + | ||
| 95 | + auto title = TextLabel::New( APPLICATION_TITLE ); | ||
| 96 | + title.SetParentOrigin( ParentOrigin::CENTER ); | ||
| 97 | + title.SetAnchorPoint( AnchorPoint::CENTER ); | ||
| 98 | + title.SetProperty( TextLabel::Property::TEXT_COLOR, Color::BLUE ); | ||
| 99 | + title.SetProperty( TextLabel::Property::HORIZONTAL_ALIGNMENT, HorizontalAlignment::CENTER ); | ||
| 100 | + toolbar.Add( title ); | ||
| 101 | + | ||
| 102 | + mDirectionButton = PushButton::New(); | ||
| 103 | + mDirectionButton.SetProperty( PushButton::Property::UNSELECTED_ICON, RTL_IMAGE ); | ||
| 104 | + mDirectionButton.SetProperty( PushButton::Property::SELECTED_ICON, RTL_SELECTED_IMAGE ); | ||
| 105 | + mDirectionButton.ClickedSignal().Connect( this, &LayoutingExample::OnDirectionClicked ); | ||
| 106 | + mDirectionButton.SetParentOrigin( Vector3(0.33f, 1.0f, 0.5f ) ); | ||
| 107 | + mDirectionButton.SetAnchorPoint( AnchorPoint::BOTTOM_CENTER ); | ||
| 108 | + mDirectionButton.SetSize(75, 75); | ||
| 109 | + stage.Add( mDirectionButton ); | ||
| 110 | + | ||
| 111 | + mRotateButton = PushButton::New(); | ||
| 112 | + mRotateButton.SetProperty( PushButton::Property::UNSELECTED_ICON, ROTATE_CLOCKWISE_IMAGE ); | ||
| 113 | + mRotateButton.SetProperty( PushButton::Property::SELECTED_ICON, ROTATE_CLOCKWISE_SELECTED_IMAGE ); | ||
| 114 | + mRotateButton.ClickedSignal().Connect( this, &LayoutingExample::OnRotateClicked ); | ||
| 115 | + mRotateButton.SetParentOrigin( Vector3(0.66f, 1.0f, 0.5f )); | ||
| 116 | + mRotateButton.SetAnchorPoint( Vector3(0.5f, 1.0f, 0.5f)); | ||
| 117 | + mRotateButton.SetSize(75, 75); | ||
| 118 | + stage.Add( mRotateButton ); | ||
| 119 | + | ||
| 120 | + // Create a hbox layout | ||
| 121 | + mLinearContainer = Control::New(); | ||
| 122 | + mIsHorizontal = false; | ||
| 123 | + | ||
| 124 | + auto layout = VboxLayout::New(); | ||
| 125 | + layout.SetAnimateLayout(true); | ||
| 126 | + DevelControl::SetLayout( mLinearContainer, layout ); | ||
| 127 | + | ||
| 128 | + mLinearContainer.SetParentOrigin( ParentOrigin::CENTER ); | ||
| 129 | + mLinearContainer.SetAnchorPoint( AnchorPoint::CENTER ); | ||
| 130 | + mLinearContainer.SetName( "linearContainer" ); | ||
| 131 | + stage.Add( mLinearContainer ); | ||
| 132 | + mLinearContainer.SetProperty( Toolkit::LayoutBase::ChildProperty::WIDTH_SPECIFICATION, ChildLayoutData::MATCH_PARENT ); | ||
| 133 | + mLinearContainer.SetProperty( Toolkit::LayoutBase::ChildProperty::HEIGHT_SPECIFICATION, ChildLayoutData::MATCH_PARENT ); | ||
| 134 | + mLinearContainer.SetProperty( Actor::Property::LAYOUT_DIRECTION, LayoutDirection::LEFT_TO_RIGHT ); | ||
| 135 | + | ||
| 136 | + for( unsigned int x = 0; x < NUMBER_OF_RESOURCES; ++x ) | ||
| 137 | + { | ||
| 138 | + mImageViews[x] = Toolkit::ImageView::New(); | ||
| 139 | + Property::Map imagePropertyMap; | ||
| 140 | + imagePropertyMap[ Toolkit::Visual::Property::TYPE ] = Toolkit::Visual::IMAGE; | ||
| 141 | + imagePropertyMap[ Toolkit::ImageVisual::Property::URL ] = IMAGE_PATH[ x ]; | ||
| 142 | + imagePropertyMap[ ImageVisual::Property::DESIRED_WIDTH ] = 100.0f; | ||
| 143 | + imagePropertyMap[ ImageVisual::Property::DESIRED_HEIGHT ] = 100.0f; | ||
| 144 | + | ||
| 145 | + mImageViews[x].SetProperty(Toolkit::ImageView::Property::IMAGE , imagePropertyMap ); | ||
| 146 | + mImageViews[x].SetName("ImageView"); | ||
| 147 | + mImageViews[x].SetAnchorPoint( AnchorPoint::TOP_LEFT ); | ||
| 148 | + mImageViews[x].SetResizePolicy( ResizePolicy::FIXED, Dimension::ALL_DIMENSIONS ); | ||
| 149 | + mLinearContainer.Add( mImageViews[x] ); | ||
| 150 | + } | ||
| 151 | + | ||
| 152 | + Stage::GetCurrent().KeyEventSignal().Connect(this, &LayoutingExample::OnKeyEvent); | ||
| 153 | + } | ||
| 154 | + | ||
| 155 | +private: | ||
| 156 | + /** | ||
| 157 | + * Main key event handler | ||
| 158 | + */ | ||
| 159 | + void OnKeyEvent(const KeyEvent& event) | ||
| 160 | + { | ||
| 161 | + if(event.state == KeyEvent::Down) | ||
| 162 | + { | ||
| 163 | + if( IsKey( event, DALI_KEY_ESCAPE) || IsKey( event, DALI_KEY_BACK ) ) | ||
| 164 | + { | ||
| 165 | + mApplication.Quit(); | ||
| 166 | + } | ||
| 167 | + } | ||
| 168 | + } | ||
| 169 | + | ||
| 170 | + bool OnDirectionClicked( Button button ) | ||
| 171 | + { | ||
| 172 | + if( mDirection ) | ||
| 173 | + { | ||
| 174 | + mDirectionButton.SetProperty( PushButton::Property::UNSELECTED_ICON, LTR_IMAGE ); | ||
| 175 | + mDirectionButton.SetProperty( PushButton::Property::SELECTED_ICON, LTR_SELECTED_IMAGE ); | ||
| 176 | + mLinearContainer.SetProperty( Actor::Property::LAYOUT_DIRECTION, LayoutDirection::LEFT_TO_RIGHT ); | ||
| 177 | + } | ||
| 178 | + else | ||
| 179 | + { | ||
| 180 | + mDirectionButton.SetProperty( PushButton::Property::UNSELECTED_ICON, RTL_IMAGE ); | ||
| 181 | + mDirectionButton.SetProperty( PushButton::Property::SELECTED_ICON, RTL_SELECTED_IMAGE ); | ||
| 182 | + mLinearContainer.SetProperty( Actor::Property::LAYOUT_DIRECTION, LayoutDirection::RIGHT_TO_LEFT ); | ||
| 183 | + } | ||
| 184 | + mDirection = !mDirection; | ||
| 185 | + return true; | ||
| 186 | + } | ||
| 187 | + | ||
| 188 | + bool OnRotateClicked( Button button ) | ||
| 189 | + { | ||
| 190 | + mIsHorizontal = !mIsHorizontal; | ||
| 191 | + if( mIsHorizontal ) | ||
| 192 | + { | ||
| 193 | + auto hboxLayout = HboxLayout::New(); | ||
| 194 | + hboxLayout.SetAnimateLayout(true); | ||
| 195 | + DevelControl::SetLayout( mLinearContainer, hboxLayout ); | ||
| 196 | + } | ||
| 197 | + else | ||
| 198 | + { | ||
| 199 | + auto vboxLayout = VboxLayout::New(); | ||
| 200 | + vboxLayout.SetAnimateLayout(true); | ||
| 201 | + DevelControl::SetLayout( mLinearContainer, vboxLayout ); | ||
| 202 | + } | ||
| 203 | + return true; | ||
| 204 | + } | ||
| 205 | + | ||
| 206 | +private: | ||
| 207 | + Application& mApplication; | ||
| 208 | + Toolkit::ImageView mImageViews[ NUMBER_OF_RESOURCES ]; | ||
| 209 | + PushButton mDirectionButton; | ||
| 210 | + PushButton mRotateButton; | ||
| 211 | + Control mLinearContainer; | ||
| 212 | + bool mDirection; | ||
| 213 | + bool mIsHorizontal = true; | ||
| 214 | +}; | ||
| 215 | + | ||
| 216 | +int DALI_EXPORT_API main( int argc, char **argv ) | ||
| 217 | +{ | ||
| 218 | + Application application = Application::New( &argc, &argv, DEMO_THEME_PATH ); | ||
| 219 | + LayoutingExample test( application ); | ||
| 220 | + application.MainLoop(); | ||
| 221 | + return 0; | ||
| 222 | +} |
resources/images/icon-reverse-selected.png
0 → 100644
1.79 KB
resources/images/icon-reverse.png
0 → 100644
1.68 KB
resources/images/icon-rotate-anticlockwise-selected.png
0 → 100644
2.03 KB
resources/images/icon-rotate-anticlockwise.png
0 → 100644
2.06 KB