Peter M. Groen / dali-demo

/*
 * Copyright (c) 2018 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.
 *
 */

#include "flex-example.h"
#include <dali-toolkit/devel-api/visuals/image-visual-properties-devel.h>
#include <dali-toolkit/devel-api/visual-factory/visual-factory.h>
#include <dali-toolkit/devel-api/controls/control-devel.h>
#include <dali-toolkit/devel-api/layouting/flex-layout.h>

using namespace Dali;
using namespace Dali::Toolkit;

namespace
{
const char* const TITLE = "Flex Example";

// Button file names
const char* LTR_IMAGE( DEMO_IMAGE_DIR "icon-play.png" );
const char* LTR_SELECTED_IMAGE( DEMO_IMAGE_DIR "icon-play-selected.png" );

const char* RTL_IMAGE( DEMO_IMAGE_DIR "icon-reverse.png" );
const char* RTL_SELECTED_IMAGE( DEMO_IMAGE_DIR "icon-reverse-selected.png" );

const char* ROTATE_CLOCKWISE_IMAGE( DEMO_IMAGE_DIR "icon-reset.png" );
const char* ROTATE_CLOCKWISE_SELECTED_IMAGE( DEMO_IMAGE_DIR "icon-reset-selected.png" );

const char* WRAP_IMAGE( DEMO_IMAGE_DIR "icon-replace.png" );
const char* WRAP_SELECTED_IMAGE( DEMO_IMAGE_DIR "icon-replace-selected.png" );

const char* JUSTIFY_IMAGE( DEMO_IMAGE_DIR "icon-item-view-layout-grid.png" );
const char* JUSTIFY_SELECTED_IMAGE( DEMO_IMAGE_DIR "icon-item-view-layout-grid-selected.png" );

// Child image filenames
const char* IMAGE_PATH[] = {
  DEMO_IMAGE_DIR "application-icon-101.png",
  DEMO_IMAGE_DIR "application-icon-102.png",
  DEMO_IMAGE_DIR "application-icon-103.png",
  DEMO_IMAGE_DIR "application-icon-104.png",
  DEMO_IMAGE_DIR "application-icon-105.png",
  DEMO_IMAGE_DIR "application-icon-106.png",
  DEMO_IMAGE_DIR "application-icon-107.png",
  DEMO_IMAGE_DIR "application-icon-108.png",
  DEMO_IMAGE_DIR "application-icon-109.png",
  DEMO_IMAGE_DIR "application-icon-110.png"

};

const unsigned int NUMBER_OF_RESOURCES = sizeof(IMAGE_PATH) / sizeof(char*);

// Helper function to create ImageViews with given filename and size.
void CreateChildImageView( ImageView& imageView, const char* filename, Size size )
{
  imageView = ImageView::New();
  Property::Map imagePropertyMap;
  imagePropertyMap[ Toolkit::Visual::Property::TYPE ] = Toolkit::Visual::IMAGE;
  imagePropertyMap[ Toolkit::ImageVisual::Property::URL ] = filename;
  imagePropertyMap[ ImageVisual::Property::DESIRED_WIDTH ] = size.width;
  imagePropertyMap[ ImageVisual::Property::DESIRED_HEIGHT ] = size.height;
  imageView.SetProperty( Toolkit::ImageView::Property::IMAGE , imagePropertyMap );
  imageView.SetName("ImageView");
  imageView.SetAnchorPoint( AnchorPoint::TOP_LEFT );
  imageView.SetResizePolicy( ResizePolicy::FIXED, Dimension::ALL_DIMENSIONS );
}

}  // namespace

namespace Demo
{

FlexExample::FlexExample()
: Example( TITLE ),
  mLTRDirection(true)
{

}

void FlexExample::Create()
{
  // The Init signal is received once (only) during the Application lifetime
  auto stage = Stage::GetCurrent();

  mDirectionButton = PushButton::New();
  mDirectionButton.SetProperty( PushButton::Property::UNSELECTED_ICON, RTL_IMAGE );
  mDirectionButton.SetProperty( PushButton::Property::SELECTED_ICON, RTL_SELECTED_IMAGE );
  mDirectionButton.ClickedSignal().Connect( this, &FlexExample::OnDirectionClicked );
  mDirectionButton.SetParentOrigin( Vector3(0.2f, 1.0f, 0.5f ) );
  mDirectionButton.SetAnchorPoint( AnchorPoint::BOTTOM_CENTER );
  mDirectionButton.SetSize(75, 75);
  stage.Add( mDirectionButton );

  mWrapButton = Toolkit::PushButton::New();
  mWrapButton.SetProperty( PushButton::Property::UNSELECTED_ICON, WRAP_IMAGE );
  mWrapButton.SetProperty( PushButton::Property::SELECTED_ICON, WRAP_SELECTED_IMAGE );
  mWrapButton.ClickedSignal().Connect( this, &FlexExample::OnWrapClicked );
  mWrapButton.SetParentOrigin( Vector3(0.4f, 1.0f, 0.5f ));
  mWrapButton.SetAnchorPoint( AnchorPoint::BOTTOM_CENTER );
  mWrapButton.SetSize(75, 75);
  stage.Add( mWrapButton );

  mJustifyButton = Toolkit::PushButton::New();
  mJustifyButton.SetProperty( PushButton::Property::UNSELECTED_ICON, JUSTIFY_IMAGE );
  mJustifyButton.SetProperty( PushButton::Property::SELECTED_ICON, JUSTIFY_SELECTED_IMAGE );
  mJustifyButton.ClickedSignal().Connect( this, &FlexExample::OnJustifyClicked );
  mJustifyButton.SetParentOrigin( Vector3(0.6f, 1.0f, 0.5f ));
  mJustifyButton.SetAnchorPoint( AnchorPoint::BOTTOM_CENTER );
  mJustifyButton.SetSize(75, 75);
  stage.Add( mJustifyButton );

  mRotateButton = PushButton::New();
  mRotateButton.SetProperty( PushButton::Property::UNSELECTED_ICON, ROTATE_CLOCKWISE_IMAGE );
  mRotateButton.SetProperty( PushButton::Property::SELECTED_ICON, ROTATE_CLOCKWISE_SELECTED_IMAGE );
  mRotateButton.ClickedSignal().Connect( this, &FlexExample::OnRotateClicked );
  mRotateButton.SetParentOrigin( Vector3(0.8f, 1.0f, 0.5f ));
  mRotateButton.SetAnchorPoint( AnchorPoint::BOTTOM_CENTER );
  mRotateButton.SetSize(75, 75);
  stage.Add( mRotateButton );

  // Create a flex container
  mFlexContainer = Control::New();

  auto layout = FlexLayout::New();
  layout.SetAnimateLayout( true );
  layout.SetFlexDirection( Toolkit::FlexLayout::FlexDirection::ROW );
  layout.SetFlexWrap( Toolkit::FlexLayout::WrapType::NO_WRAP );
  layout.SetFlexJustification( Toolkit::FlexLayout::Justification::FLEX_START );
  layout.SetFlexAlignment( Toolkit::FlexLayout::Alignment::FLEX_START );

  DevelControl::SetLayout( mFlexContainer, layout );

  mFlexContainer.SetParentOrigin( ParentOrigin::CENTER );
  mFlexContainer.SetAnchorPoint( AnchorPoint::CENTER );
  mFlexContainer.SetName( "FlexExample" );
  mFlexContainer.SetProperty( Toolkit::LayoutItem::ChildProperty::WIDTH_SPECIFICATION, ChildLayoutData::MATCH_PARENT );
  mFlexContainer.SetProperty( Toolkit::LayoutItem::ChildProperty::HEIGHT_SPECIFICATION, ChildLayoutData::MATCH_PARENT );
  mFlexContainer.SetAnchorPoint( AnchorPoint::CENTER );
  mFlexContainer.SetProperty( Actor::Property::LAYOUT_DIRECTION, LayoutDirection::LEFT_TO_RIGHT );

  for( unsigned int x = 0; x < NUMBER_OF_RESOURCES; ++x )
  {
    Toolkit::ImageView imageView;
    CreateChildImageView( imageView, IMAGE_PATH[ x ], Size(100.0f, 100.0f) );
    imageView.SetProperty( Toolkit::Control::Property::PADDING, Extents(0.f, 0.f, 0.f, 0.f) );
    imageView.SetProperty( Toolkit::Control::Property::MARGIN, Extents(2.0f, 2.0f, 2.0f, 2.0f) );
    imageView.SetProperty( Toolkit::FlexLayout::ChildProperty::ALIGN_SELF, Toolkit::FlexLayout::Alignment::CENTER );
    imageView.SetProperty( Toolkit::FlexLayout::ChildProperty::FLEX, 0.f );
    mFlexContainer.Add( imageView );
  }
  stage.Add( mFlexContainer );
}

// Remove controls added by this example from stage
void FlexExample::Remove()
{
  if ( mFlexContainer )
  {
    UnparentAndReset( mDirectionButton );
    UnparentAndReset( mWrapButton );
    UnparentAndReset( mJustifyButton );
    UnparentAndReset( mRotateButton );
    UnparentAndReset( mFlexContainer);
  }
}

// Mirror items in layout
bool FlexExample::OnDirectionClicked( Button button )
{
  mLTRDirection = !mLTRDirection;
  if( mLTRDirection )
  {
    mDirectionButton.SetProperty( PushButton::Property::UNSELECTED_ICON, LTR_IMAGE );
    mDirectionButton.SetProperty( PushButton::Property::SELECTED_ICON, LTR_SELECTED_IMAGE );
    mFlexContainer.SetProperty( Actor::Property::LAYOUT_DIRECTION, LayoutDirection::LEFT_TO_RIGHT );
  }
  else
  {
    mDirectionButton.SetProperty( PushButton::Property::UNSELECTED_ICON, RTL_IMAGE );
    mDirectionButton.SetProperty( PushButton::Property::SELECTED_ICON, RTL_SELECTED_IMAGE );
    mFlexContainer.SetProperty( Actor::Property::LAYOUT_DIRECTION, LayoutDirection::RIGHT_TO_LEFT );
  }
  return true;
}

// Rotate layout by changing layout
bool FlexExample::OnRotateClicked( Button button )
{
  auto layout = FlexLayout::DownCast(DevelControl::GetLayout( mFlexContainer ));
  if( layout.GetFlexDirection() == Toolkit::FlexLayout::FlexDirection::COLUMN )
  {
    layout.SetFlexDirection( Toolkit::FlexLayout::FlexDirection::ROW );
  }
  else
  {
    layout.SetFlexDirection( Toolkit::FlexLayout::FlexDirection::COLUMN );
  }
  return true;
}

// Alternates the layout wrapping from wrapping to none
bool FlexExample::OnWrapClicked( Button button )
{
  auto layout = FlexLayout::DownCast(DevelControl::GetLayout( mFlexContainer ));
  if ( layout.GetFlexWrap() == Toolkit::FlexLayout::WrapType::NO_WRAP )
  {
    layout.SetFlexWrap( Toolkit::FlexLayout::WrapType::WRAP );
    layout.SetFlexAlignment( Toolkit::FlexLayout::Alignment::CENTER );
    mFlexContainer.SetProperty( Toolkit::Control::Property::PADDING, Extents(0.0f, 0.0f, 45.0f, 75.0f) );
  }
  else
  {
    layout.SetFlexWrap( Toolkit::FlexLayout::WrapType::NO_WRAP );
    layout.SetFlexAlignment( Toolkit::FlexLayout::Alignment::FLEX_START );
    mFlexContainer.SetProperty( Toolkit::Control::Property::PADDING, Extents(0.0f, 0.0f, 0.0f, 0.0f) );
  }
  return true;
}

// Alternates the layout to justify space between items or not
bool FlexExample::OnJustifyClicked( Button button )
{
   auto layout = FlexLayout::DownCast(DevelControl::GetLayout( mFlexContainer ));
   if ( layout.GetFlexJustification() == Toolkit::FlexLayout::Justification::FLEX_START )
   {
     layout.SetFlexJustification( Toolkit::FlexLayout::Justification::SPACE_BETWEEN);
   }
   else
   {
     layout.SetFlexJustification( Toolkit::FlexLayout::Justification::FLEX_START );
   }
   return true;
}

} // namespace Demo