# Build the Dali Toolkit library
-toolkit_images_dir = ../../../dali-toolkit/images
+toolkit_images_dir = ../../../dali-toolkit/images-common
toolkit_sounds_dir = ../../../dali-toolkit/sounds
toolkit_src_dir = ../../../dali-toolkit/internal
public_api_src_dir = ../../../dali-toolkit/public-api
devel_api_src_dir = ../../../dali-toolkit/devel-api
toolkit_styles_dir = $(STYLE_DIR)
+toolkit_style_images_dir = $(STYLE_DIR)/images
-include ../../../dali-toolkit/images/file.list
+include ../../../dali-toolkit/images-common/file.list
include ../../../dali-toolkit/sounds/file.list
include ../../../dali-toolkit/styles/file.list
include ../../../dali-toolkit/internal/file.list
dalistyledir = ${dataReadOnlyDir}/toolkit/styles/
dalistyle_DATA = ${dali_toolkit_style_files}
+dalistyleimagesdir = ${dataReadOnlyDir}/toolkit/styles/images/
+dalistyleimages_DATA = ${dali_toolkit_style_images}
+
libdali_toolkit_la_DEPENDENCIES =
libdali_toolkit_la_CXXFLAGS = -DDALI_COMPILATION \
-DDALI_IMAGE_DIR="\"${daliimagedir}\"" \
-DDALI_SOUND_DIR="\"${dalisounddir}\"" \
-DDALI_STYLE_DIR="\"${dalistyledir}\"" \
+ -DDALI_STYLE_IMAGE_DIR="\"${dalistyleimagesdir}\"" \
-DDALI_DATA_READ_ONLY_DIR="\"${dataReadOnlyDir}\"" \
-Werror -Wall \
-I../../../ \
defaultDirs[ TOKEN_STRING(DALI_IMAGE_DIR) ] = DALI_IMAGE_DIR;
defaultDirs[ TOKEN_STRING(DALI_SOUND_DIR) ] = DALI_SOUND_DIR;
defaultDirs[ TOKEN_STRING(DALI_STYLE_DIR) ] = DALI_STYLE_DIR;
+ defaultDirs[ TOKEN_STRING(DALI_STYLE_IMAGE_DIR) ] = DALI_STYLE_IMAGE_DIR;
AddConstants( defaultDirs );
}
"secondary-cursor-color":[0.0,0.72,0.9,1.0],
"cursor-width":1,
"selection-highlight-color":[0.75,0.96,1.0,1.0],
- "grab-handle-image" : "{DALI_IMAGE_DIR}cursor_handler_drop_center.png",
- "selection-handle-image-left" : {"filename":"{DALI_IMAGE_DIR}selection_handle_drop_left.png" },
- "selection-handle-image-right": {"filename":"{DALI_IMAGE_DIR}selection_handle_drop_right.png" }
+ "grab-handle-image" : "{DALI_STYLE_IMAGE_DIR}cursor_handler_drop_center.png",
+ "selection-handle-image-left" : {"filename":"{DALI_STYLE_IMAGE_DIR}selection_handle_drop_left.png" },
+ "selection-handle-image-right": {"filename":"{DALI_STYLE_IMAGE_DIR}selection_handle_drop_right.png" }
},
"textfield-font-size-0":
"secondary-cursor-color":[0.0,0.72,0.9,1.0],
"cursor-width":3,
"selection-highlight-color":[0.75,0.96,1.0,1.0],
- "grab-handle-image" : "{DALI_IMAGE_DIR}cursor_handler_drop_center.png",
- "selection-handle-image-left" : {"filename":"{DALI_IMAGE_DIR}selection_handle_drop_left.png" },
- "selection-handle-image-right": {"filename":"{DALI_IMAGE_DIR}selection_handle_drop_right.png" }
+ "grab-handle-image" : "{DALI_STYLE_IMAGE_DIR}cursor_handler_drop_center.png",
+ "selection-handle-image-left" : {"filename":"{DALI_STYLE_IMAGE_DIR}selection_handle_drop_left.png" },
+ "selection-handle-image-right": {"filename":"{DALI_STYLE_IMAGE_DIR}selection_handle_drop_right.png" }
},
"textfield-font-size-0":
dali_toolkit_style_files =\
$(toolkit_styles_dir)/*.json
+
+dali_toolkit_style_images =\
+ $(toolkit_style_images_dir)/*.png
+ [Relative To Constraint](@ref constraints-relative-to)
+ [Multi-threading Notes](@ref animation-multi-threading-notes)
+ [Shader Animation](@ref animation-shader)
+ + [Styling](@ref styling)
### Resources
+ [Resource Image](@ref resource-image)
--- /dev/null
+/*! \page styling Styling
+ *
+@section styling-controls Styling Controls
+
+DALi Controls can be styled to look and behaviour differently.
+
+There are 2 ways to style a control, 1 is recommended.
+
+1) json markup in one of the style files.
+
+~~~
+ ...
+ "control":
+ {
+ "filename":"{IMAGES}file_name.png"
+ },
+ ...
+~~~
+
+or 2) via code using SetProperty
+
+@code
+Dali::Toolkit::Control control = Dali::Toolkit::Control::New();
+control.SetProperty( Control::BACKGROUND, "file_name.png" );
+@endcode
+
+By setting the properties in the json file and not in code it prevents the need to edit code and recompile if changes required.
+
+In the example above, if the png file needs to be changed, method 1 only requires the json file to be changed and no actual code change.
+
+@section choosing-style-at-build Choosing Style files at build time
+
+When building for a target, a style selector should be specified.
+
+The selectors are resolution biased e.g; 720 and 480.
+
+Below can be added to configure to select a style
+
+@code
+./configure --with-style=480
+@endcode
+
+@code
+./configure --with-style=720
+@endcode
+
+
+or for gbs the below define added to the build command
+
+@code
+--define "dali_style 480x800"
+@endcode
+
+@section resources-for-styling Style specific resources
+
+Each style selector can have resource folders associated with it.
+
+Images for that style should be in their own folder named images.
+
+Common images not specific for a particular style will be in the dali-toolkit common images folder.
+*
+*/