You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@flex.apache.org by jm...@apache.org on 2014/08/23 06:45:25 UTC
[18/50] [abbrv] git commit: [flex-utilities] [refs/heads/master] -
Added more spark examples
Added more spark examples
Project: http://git-wip-us.apache.org/repos/asf/flex-utilities/repo
Commit: http://git-wip-us.apache.org/repos/asf/flex-utilities/commit/d4e368dc
Tree: http://git-wip-us.apache.org/repos/asf/flex-utilities/tree/d4e368dc
Diff: http://git-wip-us.apache.org/repos/asf/flex-utilities/diff/d4e368dc
Branch: refs/heads/master
Commit: d4e368dce6dca399b938360a62cf8b0519da27ec
Parents: e39606c
Author: Justin Mclean <jm...@apache.org>
Authored: Sun Aug 10 21:19:39 2014 +1000
Committer: Justin Mclean <jm...@apache.org>
Committed: Sun Aug 10 21:19:39 2014 +1000
----------------------------------------------------------------------
.../src/spark/charts/AreaChartExample.mxml | 3 +-
.../src/spark/charts/BarChartExample.mxml | 3 +-
.../src/spark/charts/BubbleChartExample.mxml | 3 +-
.../spark/charts/CandleStickChartExample.mxml | 3 +-
.../src/spark/charts/ColumnChartExample.mxml | 3 +-
.../src/spark/charts/HLOCChartExample.mxml | 3 +-
.../src/spark/charts/LineChartExample.mxml | 3 +-
.../src/spark/charts/PieChartExample.mxml | 3 +-
.../src/spark/charts/PlotChartExample.mxml | 3 +-
.../spark/charts/SeriesInterpolateExample.mxml | 3 +-
.../src/spark/charts/SeriesSlideExample.mxml | 3 +-
.../src/spark/charts/SeriesZoomExample.mxml | 3 +-
.../src/spark/containers/BorderExample.mxml | 71 +++
.../TourDeFlex3/src/spark/containers/Contact.as | 34 ++
.../src/spark/containers/GroupExample.mxml | 75 +++
.../src/spark/containers/PanelExample.mxml | 79 +++
.../SampleVerticalHorizontalAlign.mxml | 2 +-
.../SkinableDataContainerExample.mxml | 2 +-
.../spark/containers/TabNavigator1Example.mxml | 116 +++++
.../spark/containers/TabNavigator2Example.mxml | 110 ++++
.../src/spark/containers/TileGroupExample.mxml | 2 +-
.../src/spark/containers/personIcon.png | Bin 0 -> 3859 bytes
.../skins/CustomTabBarButtonSkin.mxml | 264 ++++++++++
.../containers/skins/CustomTabBarSkin.mxml | 97 ++++
.../src/spark/controls/ButtonBarExample.mxml | 106 ++++
.../src/spark/controls/ButtonExample.mxml | 65 +++
.../src/spark/controls/CheckboxExample.mxml | 78 +++
.../src/spark/controls/CustomDataGridSkin.mxml | 375 ++++++++++++++
.../controls/DataGridCustomRendererExample.mxml | 62 +++
.../DataGridCustomRendererPrepareExample.mxml | 68 +++
.../controls/DataGridCustomSkinExample.mxml | 39 ++
.../src/spark/controls/DataGridExample2.mxml | 47 ++
.../controls/DataGridSimpleColumnsExample.mxml | 49 ++
.../controls/DataGridSimpleNoWrapExample.mxml | 37 ++
.../spark/controls/DataGridSizingExample.mxml | 47 ++
.../src/spark/controls/DropdownExample.mxml | 90 ++++
.../TourDeFlex3/src/spark/controls/Item.as | 62 +++
.../spark/controls/ListDataPagingExample.mxml | 80 +++
.../src/spark/controls/ListExample.mxml | 102 ++++
.../src/spark/controls/MyListItemRenderer.mxml | 39 ++
.../spark/controls/NumericStepperExample.mxml | 92 ++++
.../src/spark/controls/OSMFExample.mxml | 27 +
.../TourDeFlex3/src/spark/controls/PagedList.as | 510 +++++++++++++++++++
.../src/spark/controls/PopUpAnchor1Example.mxml | 81 +++
.../src/spark/controls/PopUpAnchor2Example.mxml | 80 +++
.../src/spark/controls/RadioButtonExample.mxml | 95 ++++
.../spark/controls/SampleHelpFormExample.mxml | 44 ++
.../controls/SampleSequenceFormExample.mxml | 37 ++
.../spark/controls/SampleSimpleFormExample.mxml | 38 ++
.../controls/SampleStackedFormExample.mxml | 38 ++
.../src/spark/controls/ScrollBarExample.mxml | 90 ++++
.../src/spark/controls/Scroller1Example.mxml | 75 +++
.../src/spark/controls/Scroller2Example.mxml | 83 +++
.../src/spark/controls/SliderExample.mxml | 67 +++
.../src/spark/controls/SpinnerExample.mxml | 50 ++
.../spark/controls/ToggleButton2Example.mxml | 146 ++++++
.../spark/controls/ToggleButtonBarExample.mxml | 7 +-
.../src/spark/controls/ToggleButtonExample.mxml | 111 ++++
.../src/spark/controls/VideoPlayerExample.mxml | 68 +++
.../controls/assets/control_pause_blue.png | Bin 0 -> 721 bytes
.../spark/controls/assets/control_play_blue.png | Bin 0 -> 717 bytes
.../spark/controls/assets/control_stop_blue.png | Bin 0 -> 695 bytes
.../src/spark/controls/assets/icon_close.png | Bin 0 -> 59707 bytes
.../src/spark/controls/iconclose.gif | Bin 0 -> 340 bytes
.../TourDeFlex3/src/spark/controls/iconinfo.gif | Bin 0 -> 227 bytes
.../spark/controls/skins/CloseButtonSkin.mxml | 184 +++++++
.../src/spark/controls/skins/MyPanelSkin.mxml | 99 ++++
.../src/spark/css/CSSIDSelectorExample.mxml | 68 +++
.../spark/effects/AnimatePropertiesExample.mxml | 88 ++++
.../spark/effects/AnimateTransformExample.mxml | 116 +++++
.../src/spark/effects/CrossFadeExample.mxml | 68 +++
.../src/spark/effects/FadeExample.mxml | 60 +++
.../src/spark/effects/Rotate3DExample.mxml | 114 +++++
.../src/spark/effects/Scale3DExample.mxml | 118 +++++
.../src/spark/effects/assets/ApacheFlexIcon.png | Bin 0 -> 7983 bytes
.../src/spark/effects/assets/images/2.jpg | Bin 0 -> 549 bytes
.../src/spark/effects/assets/images/3.jpg | Bin 0 -> 418 bytes
.../src/spark/effects/assets/images/4.jpg | Bin 0 -> 911 bytes
.../src/spark/effects/assets/images/5.jpg | Bin 0 -> 1617 bytes
.../src/spark/effects/assets/images/6.jpg | Bin 0 -> 1061 bytes
.../src/spark/effects/assets/images/7.jpg | Bin 0 -> 1754 bytes
.../src/spark/effects/assets/images/8.jpg | Bin 0 -> 1716 bytes
.../src/spark/effects/assets/images/9.jpg | Bin 0 -> 1552 bytes
.../src/spark/events/EventExample1.mxml | 3 +-
.../src/spark/events/EventExample2.mxml | 3 +-
.../src/spark/events/EventExample3.mxml | 3 +-
.../src/spark/events/EventExample4.mxml | 3 +-
.../src/spark/events/EventExample5.mxml | 3 +-
.../src/spark/events/EventExample6.mxml | 3 +-
.../formatters/CurrencyFormatterExample.mxml | 3 +-
.../spark/formatters/DateFormatterExample.mxml | 3 +-
.../formatters/NumberFormatterExample.mxml | 3 +-
.../spark/formatters/PhoneFormatterExample.mxml | 3 +-
.../formatters/SwitchFormatterExample.mxml | 3 +-
.../formatters/ZipCodeFormatterExample.mxml | 3 +-
.../src/spark/fxg/DropShadowGraphicExample.mxml | 66 +++
.../src/spark/fxg/EllipseTransformExample.mxml | 66 +++
.../fxg/LinearGradientsSpreadMethodExample.mxml | 63 +++
.../src/spark/fxg/OrangeCrayonStar.fxg | 47 ++
.../src/spark/fxg/StaticFXGExample.mxml | 51 ++
.../src/spark/fxg/assets/ApacheFlexIcon.png | Bin 0 -> 7983 bytes
.../src/spark/i18n/SparkCollator2Example.mxml | 3 +-
.../src/spark/i18n/SparkCollatorExample.mxml | 3 +-
.../i18n/SparkCurrencyFormatter2Example.mxml | 2 +-
.../i18n/SparkCurrencyFormatterExample.mxml | 2 +-
.../i18n/SparkCurrencyValidator2Example.mxml | 2 +-
.../i18n/SparkCurrencyValidatorExample.mxml | 2 +-
.../i18n/SparkDateTimeFormatter2Example.mxml | 2 +-
.../i18n/SparkDateTimeFormatterExample.mxml | 2 +-
.../src/spark/i18n/SparkFormatterExample.mxml | 58 +++
.../spark/i18n/SparkNumberFormatterExample.mxml | 2 +-
.../i18n/SparkNumberValidator2Example.mxml | 2 +-
.../spark/i18n/SparkNumberValidatorExample.mxml | 2 +-
.../i18n/SparkSortandSortField2Example.mxml | 2 +-
.../i18n/SparkSortandSortFieldExample.mxml | 2 +-
.../src/spark/i18n/SparkStringToolsExample.mxml | 2 +-
.../TourDeFlex3/src/spark/itemRenderers/Item.as | 62 +++
.../itemRenderers/ListItemRendererExample.mxml | 102 ++++
.../spark/itemRenderers/MyListItemRenderer.mxml | 39 ++
.../src/spark/modules/ModuleExample.mxml | 3 +-
.../other/BidirectionalBinding1Example.mxml | 45 ++
.../other/BidirectionalBinding2Example.mxml | 111 ++++
.../TourDeFlex3/src/spark/other/Contact.as | 37 ++
.../spark/other/ControllingViewportExample.mxml | 44 ++
.../src/spark/other/Cursor1Example.mxml | 3 +-
.../src/spark/other/Cursor2Example.mxml | 3 +-
.../src/spark/other/DragAndDrop1Example.mxml | 3 +-
.../src/spark/other/DragAndDrop2Example.mxml | 3 +-
.../src/spark/other/FilterExample.mxml | 3 +-
.../src/spark/other/RepeaterExample.mxml | 3 +-
.../src/spark/other/ScrollBarsExample.mxml | 2 +-
.../src/spark/other/assets/ApacheFlexLogo.png | Bin 0 -> 71228 bytes
.../other/skins/CustomTabBarButtonSkin.mxml | 262 ++++++++++
.../src/spark/other/skins/CustomTabBarSkin.mxml | 97 ++++
.../spark/skinning/ButtonWithIconExample.mxml | 49 ++
.../skinning/SkinningApplication1Example.mxml | 44 ++
.../skinning/SkinningApplication2Example.mxml | 43 ++
.../skinning/SkinningApplication3Example.mxml | 48 ++
.../skinning/SkinningContainerExample.mxml | 49 ++
.../src/spark/skinning/assets/arrow_icon_sm.png | Bin 0 -> 527 bytes
.../src/spark/skinning/assets/icon_add.png | Bin 0 -> 737 bytes
.../src/spark/skinning/assets/icon_check.png | Bin 0 -> 481 bytes
.../src/spark/skinning/assets/icon_close16.png | Bin 0 -> 59709 bytes
.../src/spark/skinning/assets/icon_plus.png | Bin 0 -> 58539 bytes
.../src/spark/skinning/assets/icon_remove.png | Bin 0 -> 693 bytes
.../src/spark/skinning/assets/wood-bg.png | Bin 0 -> 628195 bytes
.../src/spark/skinning/skins/AddButtonSkin.mxml | 183 +++++++
.../skinning/skins/BackgroundImageAppSkin.mxml | 41 ++
.../spark/skinning/skins/CloseButtonSkin.mxml | 184 +++++++
.../skinning/skins/CustomControlBarAppSkin.mxml | 106 ++++
.../skins/CustomSkinnableContainerSkin.mxml | 55 ++
.../spark/skinning/skins/FancyButtonSkin.mxml | 271 ++++++++++
.../skins/GradientBackgroundAppSkin.mxml | 53 ++
.../skinning/skins/IconTextButtonSkin.mxml | 195 +++++++
.../src/spark/skinning/skins/MyPanelSkin.mxml | 101 ++++
.../src/spark/skinning/skins/TDFPanelSkin.mxml | 171 +++++++
.../src/spark/tlf/TextLayoutEditorSample.mxml | 2 +-
.../validators/CurrencyValidatorExample.mxml | 3 +-
.../spark/validators/DateValidatorExample.mxml | 3 +-
.../spark/validators/EmailValidatorExample.mxml | 3 +-
.../spark/validators/FormValidatorExample.mxml | 3 +-
.../validators/NumberValidatorExample.mxml | 3 +-
.../validators/RegExpValidatorExample.mxml | 3 +-
.../SocialSecurityValidatorExample.mxml | 3 +-
.../validators/StringValidatorExample.mxml | 3 +-
.../validators/ZipCodeValidatorExample.mxml | 3 +-
166 files changed, 7644 insertions(+), 105 deletions(-)
----------------------------------------------------------------------
http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d4e368dc/TourDeFlex/TourDeFlex3/src/spark/charts/AreaChartExample.mxml
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex3/src/spark/charts/AreaChartExample.mxml b/TourDeFlex/TourDeFlex3/src/spark/charts/AreaChartExample.mxml
index dda5d88..f504b6c 100644
--- a/TourDeFlex/TourDeFlex3/src/spark/charts/AreaChartExample.mxml
+++ b/TourDeFlex/TourDeFlex3/src/spark/charts/AreaChartExample.mxml
@@ -20,8 +20,7 @@
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
- skinClass="TDFGradientBackgroundSkin"
- viewSourceURL="srcview/index.html">
+ skinClass="TDFGradientBackgroundSkin">
<fx:Script>
<![CDATA[
http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d4e368dc/TourDeFlex/TourDeFlex3/src/spark/charts/BarChartExample.mxml
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex3/src/spark/charts/BarChartExample.mxml b/TourDeFlex/TourDeFlex3/src/spark/charts/BarChartExample.mxml
index f33173c..554ce88 100644
--- a/TourDeFlex/TourDeFlex3/src/spark/charts/BarChartExample.mxml
+++ b/TourDeFlex/TourDeFlex3/src/spark/charts/BarChartExample.mxml
@@ -20,8 +20,7 @@
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
- skinClass="TDFGradientBackgroundSkin"
- viewSourceURL="srcview/index.html">
+ skinClass="TDFGradientBackgroundSkin">
<fx:Script>
<![CDATA[
http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d4e368dc/TourDeFlex/TourDeFlex3/src/spark/charts/BubbleChartExample.mxml
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex3/src/spark/charts/BubbleChartExample.mxml b/TourDeFlex/TourDeFlex3/src/spark/charts/BubbleChartExample.mxml
index 4bb4b3d..365df88 100644
--- a/TourDeFlex/TourDeFlex3/src/spark/charts/BubbleChartExample.mxml
+++ b/TourDeFlex/TourDeFlex3/src/spark/charts/BubbleChartExample.mxml
@@ -20,8 +20,7 @@
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
- skinClass="TDFGradientBackgroundSkin"
- viewSourceURL="srcview/index.html">
+ skinClass="TDFGradientBackgroundSkin">
<fx:Script>
<![CDATA[
http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d4e368dc/TourDeFlex/TourDeFlex3/src/spark/charts/CandleStickChartExample.mxml
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex3/src/spark/charts/CandleStickChartExample.mxml b/TourDeFlex/TourDeFlex3/src/spark/charts/CandleStickChartExample.mxml
index 8caa800..b39be2e 100644
--- a/TourDeFlex/TourDeFlex3/src/spark/charts/CandleStickChartExample.mxml
+++ b/TourDeFlex/TourDeFlex3/src/spark/charts/CandleStickChartExample.mxml
@@ -20,8 +20,7 @@
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
- skinClass="TDFGradientBackgroundSkin"
- viewSourceURL="srcview/index.html">
+ skinClass="TDFGradientBackgroundSkin">
<fx:Script>
<![CDATA[
http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d4e368dc/TourDeFlex/TourDeFlex3/src/spark/charts/ColumnChartExample.mxml
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex3/src/spark/charts/ColumnChartExample.mxml b/TourDeFlex/TourDeFlex3/src/spark/charts/ColumnChartExample.mxml
index ca36f42..f3ba41d 100644
--- a/TourDeFlex/TourDeFlex3/src/spark/charts/ColumnChartExample.mxml
+++ b/TourDeFlex/TourDeFlex3/src/spark/charts/ColumnChartExample.mxml
@@ -20,8 +20,7 @@
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
- skinClass="TDFGradientBackgroundSkin"
- viewSourceURL="srcview/index.html">
+ skinClass="TDFGradientBackgroundSkin">
<fx:Script>
<![CDATA[
http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d4e368dc/TourDeFlex/TourDeFlex3/src/spark/charts/HLOCChartExample.mxml
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex3/src/spark/charts/HLOCChartExample.mxml b/TourDeFlex/TourDeFlex3/src/spark/charts/HLOCChartExample.mxml
index 38cd01b..73fe34d 100644
--- a/TourDeFlex/TourDeFlex3/src/spark/charts/HLOCChartExample.mxml
+++ b/TourDeFlex/TourDeFlex3/src/spark/charts/HLOCChartExample.mxml
@@ -20,8 +20,7 @@
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
- skinClass="TDFGradientBackgroundSkin"
- viewSourceURL="srcview/index.html">
+ skinClass="TDFGradientBackgroundSkin">
<fx:Script>
<![CDATA[
http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d4e368dc/TourDeFlex/TourDeFlex3/src/spark/charts/LineChartExample.mxml
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex3/src/spark/charts/LineChartExample.mxml b/TourDeFlex/TourDeFlex3/src/spark/charts/LineChartExample.mxml
index 432a064..5f61ee0 100644
--- a/TourDeFlex/TourDeFlex3/src/spark/charts/LineChartExample.mxml
+++ b/TourDeFlex/TourDeFlex3/src/spark/charts/LineChartExample.mxml
@@ -20,8 +20,7 @@
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
- skinClass="TDFGradientBackgroundSkin"
- viewSourceURL="srcview/index.html">
+ skinClass="TDFGradientBackgroundSkin">
<fx:Script>
<![CDATA[
http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d4e368dc/TourDeFlex/TourDeFlex3/src/spark/charts/PieChartExample.mxml
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex3/src/spark/charts/PieChartExample.mxml b/TourDeFlex/TourDeFlex3/src/spark/charts/PieChartExample.mxml
index 2ad6001..f14e5c9 100644
--- a/TourDeFlex/TourDeFlex3/src/spark/charts/PieChartExample.mxml
+++ b/TourDeFlex/TourDeFlex3/src/spark/charts/PieChartExample.mxml
@@ -20,8 +20,7 @@
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
- skinClass="TDFGradientBackgroundSkin"
- viewSourceURL="srcview/index.html">
+ skinClass="TDFGradientBackgroundSkin">
<fx:Script>
<![CDATA[
http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d4e368dc/TourDeFlex/TourDeFlex3/src/spark/charts/PlotChartExample.mxml
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex3/src/spark/charts/PlotChartExample.mxml b/TourDeFlex/TourDeFlex3/src/spark/charts/PlotChartExample.mxml
index 3a60d4f..8b1b581 100644
--- a/TourDeFlex/TourDeFlex3/src/spark/charts/PlotChartExample.mxml
+++ b/TourDeFlex/TourDeFlex3/src/spark/charts/PlotChartExample.mxml
@@ -20,8 +20,7 @@
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
- skinClass="TDFGradientBackgroundSkin"
- viewSourceURL="srcview/index.html">
+ skinClass="TDFGradientBackgroundSkin">
<fx:Script>
<![CDATA[
http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d4e368dc/TourDeFlex/TourDeFlex3/src/spark/charts/SeriesInterpolateExample.mxml
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex3/src/spark/charts/SeriesInterpolateExample.mxml b/TourDeFlex/TourDeFlex3/src/spark/charts/SeriesInterpolateExample.mxml
index 16a51bf..554f633 100644
--- a/TourDeFlex/TourDeFlex3/src/spark/charts/SeriesInterpolateExample.mxml
+++ b/TourDeFlex/TourDeFlex3/src/spark/charts/SeriesInterpolateExample.mxml
@@ -20,8 +20,7 @@
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
- skinClass="TDFGradientBackgroundSkin"
- viewSourceURL="srcview/index.html">
+ skinClass="TDFGradientBackgroundSkin">
<fx:Script>
<![CDATA[
http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d4e368dc/TourDeFlex/TourDeFlex3/src/spark/charts/SeriesSlideExample.mxml
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex3/src/spark/charts/SeriesSlideExample.mxml b/TourDeFlex/TourDeFlex3/src/spark/charts/SeriesSlideExample.mxml
index 58f88a4..4d24782 100644
--- a/TourDeFlex/TourDeFlex3/src/spark/charts/SeriesSlideExample.mxml
+++ b/TourDeFlex/TourDeFlex3/src/spark/charts/SeriesSlideExample.mxml
@@ -20,8 +20,7 @@
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
- skinClass="TDFGradientBackgroundSkin"
- viewSourceURL="srcview/index.html">
+ skinClass="TDFGradientBackgroundSkin">
<fx:Script>
<![CDATA[
http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d4e368dc/TourDeFlex/TourDeFlex3/src/spark/charts/SeriesZoomExample.mxml
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex3/src/spark/charts/SeriesZoomExample.mxml b/TourDeFlex/TourDeFlex3/src/spark/charts/SeriesZoomExample.mxml
index d5b85d2..d94c176 100644
--- a/TourDeFlex/TourDeFlex3/src/spark/charts/SeriesZoomExample.mxml
+++ b/TourDeFlex/TourDeFlex3/src/spark/charts/SeriesZoomExample.mxml
@@ -20,8 +20,7 @@
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
- skinClass="TDFGradientBackgroundSkin"
- viewSourceURL="srcview/index.html">
+ skinClass="TDFGradientBackgroundSkin">
<fx:Script>
<![CDATA[
http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d4e368dc/TourDeFlex/TourDeFlex3/src/spark/containers/BorderExample.mxml
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex3/src/spark/containers/BorderExample.mxml b/TourDeFlex/TourDeFlex3/src/spark/containers/BorderExample.mxml
new file mode 100644
index 0000000..c64b094
--- /dev/null
+++ b/TourDeFlex/TourDeFlex3/src/spark/containers/BorderExample.mxml
@@ -0,0 +1,71 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+
+ Licensed to the Apache Software Foundation (ASF) under one or more
+ contributor license agreements. See the NOTICE file distributed with
+ this work for additional information regarding copyright ownership.
+ The ASF licenses this file to You 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.
+
+-->
+<!-- http://blog.flexexamples.com/2009/09/04/setting-the-corner-radius-on-a-spark-border-container-in-flex-4/ -->
+<s:Application name="Spark_Border_cornerRadius_test"
+ xmlns:fx="http://ns.adobe.com/mxml/2009"
+ xmlns:mx="library://ns.adobe.com/flex/mx"
+ xmlns:s="library://ns.adobe.com/flex/spark" viewSourceURL="srcview/index.html">
+
+ <s:Panel width="100%" height="100%" title="BorderContainer Sample"
+ skinClass="skins.TDFPanelSkin">
+
+ <s:VGroup id="mainGroup" width="100%"
+ horizontalCenter="50" top="10">
+ <s:HGroup gap="50" paddingBottom="15">
+ <s:VGroup>
+ <s:HGroup verticalAlign="middle">
+ <s:Label text="Corner Radius:"/>
+ <s:HSlider id="slider"
+ minimum="0"
+ maximum="100"
+ value="2" />
+ </s:HGroup>
+ <s:HGroup verticalAlign="middle">
+ <s:Label text="Border Weight:"/>
+ <s:NumericStepper id="weight" value="3"/>
+ </s:HGroup>
+ <s:HGroup verticalAlign="middle">
+ <s:Label text="Border Color:"/>
+ <mx:ColorPicker id="color" color="0x000000"/>
+ </s:HGroup>
+ <s:HGroup verticalAlign="middle">
+ <s:Label text="Drop Shadow:"/>
+ <s:CheckBox id="chkShadow" selected="true"/>
+ </s:HGroup>
+ </s:VGroup>
+
+ <s:BorderContainer id="brdr" width="200"
+ cornerRadius="{slider.value}" borderWeight="{weight.value}"
+ borderColor="{color.selectedColor}" dropShadowVisible="{chkShadow.selected}"
+ backgroundColor="0x3399ff">
+ </s:BorderContainer>
+ </s:HGroup>
+
+ <s:Label bottom="10" horizontalCenter="0" width="95%" verticalAlign="justify" color="#323232"
+ text="The Border class provides a container class that can be styled with a border and
+a background fill or image. It has many of the same styles as HaloBorder and is used in a similar way to the
+Halo container classes such as Box and Canvas. Examples of styles that are supported are borderWeight, borderColor,
+backgroundColor, backgroundImage, cornerRadius and dropShadowVisible."/>
+ </s:VGroup>
+
+ </s:Panel>
+
+
+</s:Application>
\ No newline at end of file
http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d4e368dc/TourDeFlex/TourDeFlex3/src/spark/containers/Contact.as
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex3/src/spark/containers/Contact.as b/TourDeFlex/TourDeFlex3/src/spark/containers/Contact.as
new file mode 100644
index 0000000..838a300
--- /dev/null
+++ b/TourDeFlex/TourDeFlex3/src/spark/containers/Contact.as
@@ -0,0 +1,34 @@
+////////////////////////////////////////////////////////////////////////////////
+//
+// Licensed to the Apache Software Foundation (ASF) under one or more
+// contributor license agreements. See the NOTICE file distributed with
+// this work for additional information regarding copyright ownership.
+// The ASF licenses this file to You 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.
+//
+////////////////////////////////////////////////////////////////////////////////
+package
+{
+ [Bindable]
+ public class Contact
+ {
+ public var name:String;
+ public var address:String;
+ public var city:String;
+ public var state:String;
+ public var zip:String;
+
+ public function Contact()
+ {
+ }
+ }
+}
\ No newline at end of file
http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d4e368dc/TourDeFlex/TourDeFlex3/src/spark/containers/GroupExample.mxml
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex3/src/spark/containers/GroupExample.mxml b/TourDeFlex/TourDeFlex3/src/spark/containers/GroupExample.mxml
new file mode 100644
index 0000000..52a579d
--- /dev/null
+++ b/TourDeFlex/TourDeFlex3/src/spark/containers/GroupExample.mxml
@@ -0,0 +1,75 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+
+ Licensed to the Apache Software Foundation (ASF) under one or more
+ contributor license agreements. See the NOTICE file distributed with
+ this work for additional information regarding copyright ownership.
+ The ASF licenses this file to You 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.
+
+-->
+<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
+ xmlns:s="library://ns.adobe.com/flex/spark"
+ xmlns:mx="library://ns.adobe.com/flex/halo" viewSourceURL="srcview/index.html">
+
+ <s:layout>
+ <s:BasicLayout id="bl"/>
+ </s:layout>
+
+ <!-- Note: Panel has a BasicLayout by default. The BasicLayout means that components will be
+ arranged according to their individual constraint settings, independent of each-other -->
+ <s:Panel id="mainPanel" width="100%" height="100%" top="0" left="5"
+ title="Panel Sample"
+ skinClass="skins.TDFPanelSkin">
+
+ <!-- Note: main panel is BasicLayout by default. So each inner panel will be layed out
+ according to it's constraints specified individually. -->
+ <s:Panel title="Basic Layout Panel" top="0" left="5">
+ <!-- Default layout is basic, therefore constraints are used for placement -->
+ <s:Label text="Apples" top="0"/>
+ <s:Label text="Oranges" top="13"/>
+ <s:Label text="Bananas" top="26"/>
+ </s:Panel>
+
+ <s:Panel id="horizontalPanel" title="Horizontal Layout Panel"
+ top="0" left="250">
+ <s:layout>
+ <s:HorizontalLayout/>
+ </s:layout>
+ <!-- Note: constraints to top left on items here, but will not matter because we
+ specified a HorizontalLayout -->
+ <s:Label text="Apples" top="0"/>
+ <s:Label text="Oranges" top="13"/>
+ <s:Label text="Bananas" top="26"/>
+ </s:Panel>
+ <s:Panel id="vericalPanel" title="Vertical Layout Panel"
+ top="0" right="5">
+ <s:layout>
+ <s:VerticalLayout/>
+ </s:layout>
+ <!-- Note: constraints to top left on items here, but will not matter because we
+ specified a VerticalLayout -->
+ <s:Label text="Apples" top="0"/>
+ <s:Label text="Oranges" top="13"/>
+ <s:Label text="Bananas" top="26"/>
+ </s:Panel>
+ <s:Label color="0x323232" verticalAlign="justify"
+ left="3" bottom="30" width="100%"
+ text="The Panel class defines a container that includes a title bar, a caption, a border, and a content area for its children.
+The Panel has a basic layout by default, which means it lays out elements within the panel by
+their individual constraints. You can specify a different layout to use within the panel such
+as shown in the inner panels (basic, horizontal and vertical layout panels. In that case the
+individual constraints on the Text items are ignored, as shown here."/>
+
+ </s:Panel>
+
+</s:Application>
http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d4e368dc/TourDeFlex/TourDeFlex3/src/spark/containers/PanelExample.mxml
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex3/src/spark/containers/PanelExample.mxml b/TourDeFlex/TourDeFlex3/src/spark/containers/PanelExample.mxml
new file mode 100644
index 0000000..76369f5
--- /dev/null
+++ b/TourDeFlex/TourDeFlex3/src/spark/containers/PanelExample.mxml
@@ -0,0 +1,79 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+
+ Licensed to the Apache Software Foundation (ASF) under one or more
+ contributor license agreements. See the NOTICE file distributed with
+ this work for additional information regarding copyright ownership.
+ The ASF licenses this file to You 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.
+
+-->
+<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
+ xmlns:s="library://ns.adobe.com/flex/spark"
+ xmlns:mx="library://ns.adobe.com/flex/mx" viewSourceURL="srcview/index.html">
+
+ <!-- Note: Panel has a BasicLayout by default. The BasicLayout means that components will be
+ arranged according to their individual constraint settings, independent of each-other -->
+ <s:Panel id="mainPanel" width="100%" height="100%"
+ title="Panel Sample"
+ skinClass="skins.TDFPanelSkin">
+
+
+ <s:HGroup horizontalCenter="0">
+
+ <!-- Note: main panel is BasicLayout by default, so each inner panel will be layed out
+ according to it's constraints specified individually. -->
+ <s:Panel title="Basic Layout Panel" top="0" left="5">
+ <!-- Default layout is basic, therefore constraints are used for placement -->
+ <mx:Text text="Apples" top="0"/>
+ <mx:Text text="Oranges" top="15"/>
+ <mx:Text text="Bananas" top="30"/>
+ </s:Panel>
+
+ <s:Panel title="Horizontal Layout Panel"
+ top="0" left="250">
+ <s:layout>
+ <s:HorizontalLayout/>
+ </s:layout>
+ <!-- Note: constraints to top left on items here, but will not matter because we
+ specified a HorizontalLayout -->
+ <mx:Text text="Apples" top="0"/>
+ <mx:Text text="Oranges" top="15"/>
+ <mx:Text text="Bananas" top="30"/>
+ </s:Panel>
+
+ <s:Panel title="Vertical Layout Panel"
+ top="0" right="5">
+ <s:layout>
+ <s:VerticalLayout/>
+ </s:layout>
+
+ <!-- Note: constraints to top left on items here, but will not matter because we
+ specified a VeritcalLayout -->
+ <mx:Text text="Apples" top="0"/>
+ <mx:Text text="Oranges" top="15"/>
+ <mx:Text text="Bananas" top="30"/>
+ </s:Panel>
+ </s:HGroup>
+ <s:Group bottom="5" width="100%">
+
+ <s:Label color="0x323232" verticalAlign="justify"
+ left="5" bottom="15" width="95%"
+ text="The Panel class defines a container that includes a title bar, a caption, a border, and a content area for its children.
+The Panel has a basic layout by default, which means it lays out elements within the panel by their individual constraints. You can specify a different layout to use within the panel such
+as shown in the inner panels (basic, horizontal and vertical layout) panels. In that case the individual constraints on the Text items are ignored, as shown here."/>
+ </s:Group>
+
+
+ </s:Panel>
+
+</s:Application>
http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d4e368dc/TourDeFlex/TourDeFlex3/src/spark/containers/SampleVerticalHorizontalAlign.mxml
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex3/src/spark/containers/SampleVerticalHorizontalAlign.mxml b/TourDeFlex/TourDeFlex3/src/spark/containers/SampleVerticalHorizontalAlign.mxml
index a30bc57..abfb346 100644
--- a/TourDeFlex/TourDeFlex3/src/spark/containers/SampleVerticalHorizontalAlign.mxml
+++ b/TourDeFlex/TourDeFlex3/src/spark/containers/SampleVerticalHorizontalAlign.mxml
@@ -20,7 +20,7 @@
<!-- http://evtimmy.com/2010/01/verticalalign-for-vgroup-and-horizontalalign-for-hgroup/ -->
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
- xmlns:mx="library://ns.adobe.com/flex/mx" backgroundColor="0x323232" color="0xFFFFFF" viewSourceURL="srcview/index.html">
+ xmlns:mx="library://ns.adobe.com/flex/mx" backgroundColor="0x323232" color="0xFFFFFF">
<s:VGroup verticalAlign="middle" width="526" height="230" top="57" left="10">
<s:HGroup verticalAlign="middle" height="100%" color="0x000000">
http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d4e368dc/TourDeFlex/TourDeFlex3/src/spark/containers/SkinableDataContainerExample.mxml
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex3/src/spark/containers/SkinableDataContainerExample.mxml b/TourDeFlex/TourDeFlex3/src/spark/containers/SkinableDataContainerExample.mxml
index e2c9414..09fb38c 100644
--- a/TourDeFlex/TourDeFlex3/src/spark/containers/SkinableDataContainerExample.mxml
+++ b/TourDeFlex/TourDeFlex3/src/spark/containers/SkinableDataContainerExample.mxml
@@ -19,7 +19,7 @@
-->
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
- xmlns:mx="library://ns.adobe.com/flex/mx" viewSourceURL="srcview/index.html">
+ xmlns:mx="library://ns.adobe.com/flex/mx">
<s:Panel width="100%" height="100%" title="SkinnableDataContainer" skinClass="skins.TDFPanelSkin">
<s:layout><s:HorizontalLayout paddingLeft="8" paddingTop="8" paddingRight="12"/></s:layout>
http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d4e368dc/TourDeFlex/TourDeFlex3/src/spark/containers/TabNavigator1Example.mxml
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex3/src/spark/containers/TabNavigator1Example.mxml b/TourDeFlex/TourDeFlex3/src/spark/containers/TabNavigator1Example.mxml
new file mode 100644
index 0000000..e23b033
--- /dev/null
+++ b/TourDeFlex/TourDeFlex3/src/spark/containers/TabNavigator1Example.mxml
@@ -0,0 +1,116 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+
+ Licensed to the Apache Software Foundation (ASF) under one or more
+ contributor license agreements. See the NOTICE file distributed with
+ this work for additional information regarding copyright ownership.
+ The ASF licenses this file to You 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.
+
+-->
+<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
+ xmlns:s="library://ns.adobe.com/flex/spark"
+ xmlns:mx="library://ns.adobe.com/flex/mx" xmlns:local="*" viewSourceURL="srcview/index.html">
+
+ <fx:Script>
+ <![CDATA[
+ import mx.events.ListEvent;
+
+ [Bindable]
+ private var contact:Contact = new Contact();
+
+ protected function submitBtn_clickHandler(event:MouseEvent):void
+ {
+ contact.name = nameTxt.text;
+ contact.address = address.text;
+ contact.city = city.text;
+ contact.state = state.text;
+ contact.zip = zip.text;
+ trace(contacts.contains(contact));
+
+ if (!contacts.contains(contact))
+ contacts.addItem(contact);
+ contact = new Contact();
+ }
+
+ protected function dg_itemClickHandler(event:ListEvent):void
+ {
+ contact = dg.selectedItem as Contact;
+ }
+
+ ]]>
+ </fx:Script>
+
+ <fx:Declarations>
+ <s:ArrayCollection id="contacts"/>
+ </fx:Declarations>
+
+ <s:Panel width="100%" height="100%" skinClass="skins.TDFPanelSkin" title="TabBar Sample" >
+ <s:TabBar id="tabs" left="8" y="2" dataProvider="{vs}"/>
+ <mx:ViewStack id="vs" width="95%" height="85%" left="8" y="23">
+ <s:NavigatorContent label="Contact Info" width="100%" height="100%">
+ <s:BorderContainer width="100%" height="100%" borderWeight="2" cornerRadius="3" dropShadowVisible="true">
+ <s:backgroundFill>
+ <s:LinearGradient rotation="90">
+ <s:GradientEntry color="0xE2E2E2" />
+ <s:GradientEntry color="0x323232" />
+ </s:LinearGradient>
+ </s:backgroundFill>
+ <mx:Form id="contactForm" defaultButton="{submitBtn}" width="100%" height="100%">
+ <mx:FormItem label="Name:">
+ <s:TextInput id="nameTxt" text="{contact.name}"/>
+ </mx:FormItem>
+ <mx:FormItem label="Address:">
+ <s:TextInput id="address" text="{contact.address}"/>
+ </mx:FormItem>
+ <mx:FormItem label="City:">
+ <s:TextInput id="city" text="{contact.city}"/>
+ </mx:FormItem>
+ <mx:FormItem label="State:">
+ <s:TextInput id="state" text="{contact.state}"/>
+ </mx:FormItem>
+ <mx:FormItem label="Zip:">
+ <s:TextInput id="zip" text="{contact.zip}" maxChars="5"/>
+ </mx:FormItem>
+ <mx:FormItem>
+ <s:Button id="submitBtn" label="Submit" click="submitBtn_clickHandler(event)"/>
+ </mx:FormItem>
+ </mx:Form>
+ </s:BorderContainer>
+ </s:NavigatorContent>
+ <s:NavigatorContent label="Contact List" width="100%" height="100%" >
+ <s:BorderContainer width="100%" height="100%" borderWeight="2"
+ cornerRadius="3" dropShadowVisible="true">
+ <s:backgroundFill>
+ <s:LinearGradient rotation="90">
+ <s:GradientEntry color="0xE2E2E2" />
+ <s:GradientEntry color="0x323232" />
+ </s:LinearGradient>
+ </s:backgroundFill>
+ <mx:DataGrid id="dg" dataProvider="{contacts}" x="5" y="5" doubleClickEnabled="true"
+ doubleClick="{tabs.selectedIndex=0}" itemClick="dg_itemClickHandler(event)">
+ <mx:columns>
+ <mx:DataGridColumn headerText="Name" dataField="name"/>
+ <mx:DataGridColumn headerText="Address" dataField="address"/>
+ <mx:DataGridColumn headerText="City" dataField="city"/>
+ <mx:DataGridColumn headerText="State" dataField="state"/>
+ <mx:DataGridColumn headerText="Zip" dataField="zip"/>
+ </mx:columns>
+ </mx:DataGrid>
+ </s:BorderContainer>
+
+ </s:NavigatorContent>
+
+ </mx:ViewStack>
+
+ </s:Panel>
+</s:Application>
http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d4e368dc/TourDeFlex/TourDeFlex3/src/spark/containers/TabNavigator2Example.mxml
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex3/src/spark/containers/TabNavigator2Example.mxml b/TourDeFlex/TourDeFlex3/src/spark/containers/TabNavigator2Example.mxml
new file mode 100644
index 0000000..7bc0b35
--- /dev/null
+++ b/TourDeFlex/TourDeFlex3/src/spark/containers/TabNavigator2Example.mxml
@@ -0,0 +1,110 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+
+ Licensed to the Apache Software Foundation (ASF) under one or more
+ contributor license agreements. See the NOTICE file distributed with
+ this work for additional information regarding copyright ownership.
+ The ASF licenses this file to You 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.
+
+-->
+<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
+ xmlns:s="library://ns.adobe.com/flex/spark"
+ xmlns:mx="library://ns.adobe.com/flex/mx" xmlns:local="*">
+
+ <fx:Script>
+ <![CDATA[
+ import mx.events.ListEvent;
+
+ [Bindable]
+ private var contact:Contact = new Contact();
+
+ protected function submitBtn_clickHandler(event:MouseEvent):void
+ {
+ // Note: this sample uses bidirectional data binding, so we do not have to
+ // explicitly set the contact fields to save them!
+ if (!contacts.contains(contact))
+ contacts.addItem(contact);
+ contact = new Contact();
+ }
+
+ protected function dg_itemClickHandler(event:ListEvent):void
+ {
+ contact = dg.selectedItem as Contact;
+ }
+
+ ]]>
+ </fx:Script>
+
+ <fx:Declarations>
+ <s:ArrayCollection id="contacts"/>
+ </fx:Declarations>
+
+ <s:Panel width="100%" height="100%" skinClass="skins.TDFPanelSkin" title="TabBar Sample with Custom Skin and Bidirectional Binding" >
+ <s:TabBar id="tabs" left="8" y="2" dataProvider="{vs}" skinClass="skins.CustomTabBarSkin" cornerRadius="4"/>
+ <mx:ViewStack id="vs" width="95%" height="85%" left="8" y="23">
+ <s:NavigatorContent label="Contact Info" width="100%" height="100%">
+ <s:BorderContainer borderColor="0xCC0000" width="100%" height="100%" borderWeight="2" cornerRadius="3"
+ dropShadowVisible="true">
+ <!-- This background fill could also be specified in a custom skin to apply to other containers as well -->
+ <s:backgroundFill>
+ <s:LinearGradient rotation="90">
+ <s:GradientEntry color="0xE2E2E2"/>
+ <s:GradientEntry color="0xCC0000" alpha=".5" />
+ </s:LinearGradient>
+ </s:backgroundFill>
+ <mx:Form id="contactForm" defaultButton="{submitBtn}" width="100%" height="100%">
+ <mx:FormItem label="Name:">
+ <s:TextInput id="nameTxt" text="@{contact.name}"/>
+ </mx:FormItem>
+ <mx:FormItem label="Address:">
+ <s:TextInput id="address" text="@{contact.address}"/>
+ </mx:FormItem>
+ <mx:FormItem label="City:">
+ <s:TextInput id="city" text="@{contact.city}"/>
+ </mx:FormItem>
+ <mx:FormItem label="State:">
+ <s:TextInput id="state" text="@{contact.state}"/>
+ </mx:FormItem>
+ <mx:FormItem label="Zip:">
+ <s:TextInput id="zip" text="@{contact.zip}" maxChars="5"/>
+ </mx:FormItem>
+ <mx:FormItem>
+ <s:Button id="submitBtn" label="Submit" click="submitBtn_clickHandler(event)"/>
+ </mx:FormItem>
+ </mx:Form>
+ </s:BorderContainer>
+ </s:NavigatorContent>
+ <s:NavigatorContent label="Contact List" width="100%" height="100%" >
+ <s:BorderContainer borderColor="0xCC0000" width="100%" height="100%" borderWeight="2" cornerRadius="3"
+ dropShadowVisible="true">
+ <s:backgroundFill>
+ <s:LinearGradient rotation="90">
+ <s:GradientEntry color="0xCC0000" />
+ <s:GradientEntry color="0xE2E2E2" />
+ </s:LinearGradient>
+ </s:backgroundFill>
+ <mx:DataGrid id="dg" dataProvider="{contacts}" x="5" y="5" doubleClickEnabled="true"
+ doubleClick="{tabs.selectedIndex=0}" itemClick="dg_itemClickHandler(event)">
+ <mx:columns>
+ <mx:DataGridColumn headerText="Name" dataField="name"/>
+ <mx:DataGridColumn headerText="Address" dataField="address"/>
+ <mx:DataGridColumn headerText="City" dataField="city"/>
+ <mx:DataGridColumn headerText="State" dataField="state"/>
+ <mx:DataGridColumn headerText="Zip" dataField="zip"/>
+ </mx:columns>
+ </mx:DataGrid>
+ </s:BorderContainer>
+ </s:NavigatorContent>
+ </mx:ViewStack>
+ </s:Panel>
+</s:Application>
http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d4e368dc/TourDeFlex/TourDeFlex3/src/spark/containers/TileGroupExample.mxml
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex3/src/spark/containers/TileGroupExample.mxml b/TourDeFlex/TourDeFlex3/src/spark/containers/TileGroupExample.mxml
index 9fa4af7..c68120f 100644
--- a/TourDeFlex/TourDeFlex3/src/spark/containers/TileGroupExample.mxml
+++ b/TourDeFlex/TourDeFlex3/src/spark/containers/TileGroupExample.mxml
@@ -19,7 +19,7 @@
-->
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
- xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600" viewSourceURL="srcview/index.html">
+ xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600">
<fx:Declarations>
<fx:Array id="orientArray">
http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d4e368dc/TourDeFlex/TourDeFlex3/src/spark/containers/personIcon.png
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex3/src/spark/containers/personIcon.png b/TourDeFlex/TourDeFlex3/src/spark/containers/personIcon.png
new file mode 100644
index 0000000..f9d76c6
Binary files /dev/null and b/TourDeFlex/TourDeFlex3/src/spark/containers/personIcon.png differ
http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d4e368dc/TourDeFlex/TourDeFlex3/src/spark/containers/skins/CustomTabBarButtonSkin.mxml
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex3/src/spark/containers/skins/CustomTabBarButtonSkin.mxml b/TourDeFlex/TourDeFlex3/src/spark/containers/skins/CustomTabBarButtonSkin.mxml
new file mode 100644
index 0000000..3bbff44
--- /dev/null
+++ b/TourDeFlex/TourDeFlex3/src/spark/containers/skins/CustomTabBarButtonSkin.mxml
@@ -0,0 +1,264 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+
+ Licensed to the Apache Software Foundation (ASF) under one or more
+ contributor license agreements. See the NOTICE file distributed with
+ this work for additional information regarding copyright ownership.
+ The ASF licenses this file to You 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.
+
+-->
+
+
+<!---
+The default skin class for Spark TabBar buttons.
+
+@langversion 3.0
+@playerversion Flash 10
+@playerversion AIR 1.5
+@productversion Flex 4
+-->
+
+<s:SparkSkin
+ xmlns:fx="http://ns.adobe.com/mxml/2009"
+ xmlns:s="library://ns.adobe.com/flex/spark"
+ xmlns:fb="http://ns.adobe.com/flashbuilder/2009"
+ minWidth="21" minHeight="21" alpha.disabledStates="0.5">
+
+ <!-- host component -->
+ <fx:Metadata>
+ <![CDATA[
+ /**
+ * @copy spark.skins.spark.ApplicationSkin#hostComponent
+ */
+ [HostComponent("spark.components.ButtonBarButton")]
+ ]]>
+ </fx:Metadata>
+
+ <fx:Script fb:purpose="styling" >
+
+ import spark.components.TabBar;
+
+ static private const exclusions:Array = ["labelDisplay"];
+
+ /**
+ * @private
+ */
+ override public function get colorizeExclusions():Array {return exclusions;}
+
+ /**
+ * @private
+ */
+ override protected function initializationComplete():void
+ {
+ //useBaseColor = true;
+ super.initializationComplete();
+ }
+
+ private var cornerRadius:Number = 4
+
+ /**
+ * @private
+ * The borderTop s:Path is just a s:Rect with the bottom edge left out.
+ * Given the rounded corners per the cornerRadius style, the result is
+ * roughly an inverted U with the specified width, height, and cornerRadius.
+ *
+ * Circular arcs are drawn with two curves per flash.display.Graphics.GraphicsUtil.
+ */
+ private function updateBorderTop(width:Number, height:Number):void
+ {
+ var left:Number = -0.5;
+ var right:Number = width - 0.5;
+ var top:Number = 0.5;
+ var bottom:Number = height;
+
+ var a:Number = cornerRadius * 0.292893218813453;
+ var s:Number = cornerRadius * 0.585786437626905;
+
+ var path:String = "";
+ path += "M " + left + " " + bottom;
+ path += " L " + left + " " + (top + cornerRadius);
+ path += " Q " + left + " " + (top + s) + " " + (left + a) + " " + (top + a);
+ path += " Q " + (left + s) + " " + top + " " + (left + cornerRadius) + " " + top;
+ path += " L " + (right - cornerRadius) + " " + top;
+ path += " Q " + (right - s) + " " + top + " " + (right - a) + " " + (top + a);
+ path += " Q " + right + " " + (top + s) + " " + right + " " + (top + cornerRadius);
+ path += " L " + right + " " + bottom;
+ borderTop.data = path;
+ }
+
+ /**
+ * @private
+ * The cornerRadius style is specified by the TabBar, not the button itself.
+ *
+ * Rather than bind the corner radius properties of the s:Rect's in the markup
+ * below to hostComponent.owner.getStyle("cornerRadius"), we reset them here,
+ * each time a change in the value of the style is detected. Note that each
+ * corner radius property is explicitly initialized to the default value of
+ * the style; the initial value of the private cornerRadius property.
+ */
+ private function updateCornerRadius():void
+ {
+ var cr:Number = getStyle("cornerRadius");
+ if (cornerRadius != cr)
+ {
+ cornerRadius = cr;
+ fill.topLeftRadiusX = cornerRadius;
+ fill.topRightRadiusX = cornerRadius;
+ lowlight.radiusX = cornerRadius;
+ highlight.radiusX = cornerRadius;
+ highlightStroke.topLeftRadiusX = cornerRadius;
+ highlightStroke.topRightRadiusX = cornerRadius;
+ }
+ }
+
+ /**
+ * @private
+ */
+ override protected function updateDisplayList(unscaledWidth:Number, unscaleHeight:Number):void
+ {
+ updateCornerRadius();
+ updateBorderTop(unscaledWidth, unscaledHeight);
+ super.updateDisplayList(unscaledWidth, unscaledHeight);
+ }
+ </fx:Script>
+
+ <!-- states -->
+ <s:states>
+ <s:State name="up" />
+ <s:State name="over" stateGroups="overStates" />
+ <s:State name="down" stateGroups="downStates" />
+ <s:State name="disabled" stateGroups="disabledStates" />
+ <s:State name="upAndSelected" stateGroups="selectedStates, selectedUpStates" />
+ <s:State name="overAndSelected" stateGroups="overStates, selectedStates" />
+ <s:State name="downAndSelected" stateGroups="downStates, selectedStates" />
+ <s:State name="disabledAndSelected" stateGroups="selectedUpStates, disabledStates, selectedStates" />
+ </s:states>
+
+ <s:Group left="-1" right="0" top="-1" bottom="-1">
+
+ <!-- layer 2: fill -->
+ <s:Rect id="fill" left="2" right="1" top="2" bottom="2" topLeftRadiusX="4" topRightRadiusX="4" width="69" height="21">
+ <s:fill>
+ <s:LinearGradient rotation="90">
+ <s:GradientEntry color="0xFFFFFF"
+ color.selectedUpStates="0xFFFFFF"
+ color.overStates="0xCC0000"
+ color.downStates="0xCC0000"
+ alpha="0.85"
+ alpha.overAndSelected="1" />
+ <s:GradientEntry color="0xCCCCCC"
+ color.selectedUpStates="0x9FA0A1"
+ color.over="0xCC0000"
+ color.overAndSelected="0xFFFFFF"
+ color.downStates="0xCC0000"
+ alpha="0.85"
+ alpha.overAndSelected="1" />
+ </s:LinearGradient>
+ </s:fill>
+ </s:Rect>
+
+ <!-- layer 3: fill lowlight -->
+ <s:Rect id="lowlight" left="2" right="1" bottom="2" height="9" radiusX="4">
+ <s:fill>
+ <s:LinearGradient rotation="90">
+ <s:GradientEntry color="0xCC0000" alpha="0.0099" />
+ <s:GradientEntry color="0xCC0000" alpha="0.0627" />
+ </s:LinearGradient>
+ </s:fill>
+ </s:Rect>
+
+ <!-- layer 4: fill highlight -->
+ <s:Rect id="highlight" left="2" right="1" top="2" height="9" radiusX="4">
+ <s:fill>
+ <s:SolidColor color="0xCC0000"
+ alpha="0.33"
+ alpha.selectedUpStates="0.22"
+ alpha.overStates="0.22"
+ alpha.downStates="0.12" />
+ </s:fill>
+ </s:Rect>
+
+ <!-- layer 5: highlight stroke (all states except down) -->
+ <s:Rect id="highlightStroke" left="2" right="1" top="2" bottom="2" topLeftRadiusX="4" topRightRadiusX="4">
+ <s:stroke>
+ <s:LinearGradientStroke rotation="90" weight="1">
+ <s:GradientEntry color="0xCC0000" alpha.overStates="0.22" alpha.selectedUpStates="0.33" />
+ </s:LinearGradientStroke>
+ </s:stroke>
+ </s:Rect>
+
+ <!-- layer 6: highlight stroke (down state only) -->
+ <s:Rect left="2" top="2" bottom="2" width="1" includeIn="downStates, selectedUpStates, overAndSelected">
+ <s:fill>
+ <s:SolidColor color="0xCC0000" alpha="0.07" />
+ </s:fill>
+ </s:Rect>
+ <s:Rect right="1" top="2" bottom="2" width="1" includeIn="downStates, selectedUpStates, overAndSelected">
+ <s:fill>
+ <s:SolidColor color="0xCC0000" alpha="0.07" />
+ </s:fill>
+ </s:Rect>
+ <s:Rect left="3" top="2" right="1" height="1" includeIn="downStates, selectedUpStates, overAndSelected">
+ <s:fill>
+ <s:SolidColor color="0xCC0000" alpha="0.25" />
+ </s:fill>
+ </s:Rect>
+ <s:Rect left="2" top="3" right="1" height="1" includeIn="downStates, selectedUpStates, overAndSelected">
+ <s:fill>
+ <s:SolidColor color="0xCC0000" alpha="0.09" />
+ </s:fill>
+ </s:Rect>
+
+ <!-- layer 7: border - put on top of the fill so it doesn't disappear when scale is less than 1 -->
+ <s:Line id="borderBottom" left="1" right="0" bottom="1">
+ <s:stroke>
+ <s:SolidColorStroke weight="1"
+ color="0xCC0000"
+ color.selectedStates="0x434343"
+ alpha="0.75"
+ alpha.down="0.85"
+ alpha.selectedStates="0.5" />
+ </s:stroke>
+ </s:Line>
+ <s:Path id="borderTop" left="1" right="0" top="1" bottom="1" width="69" height="21">
+ <s:stroke>
+ <s:LinearGradientStroke rotation="90" weight="1">
+ <s:GradientEntry color="0xCC0000"
+ alpha="0.5625"
+ />
+ <s:GradientEntry color="0xFFFFFF"
+ color.selectedUpStates="0xFFFFFF"
+ color.overStates="0xFFFFFF"
+ color.downStates="0xCC0000"
+ alpha="0.85"
+ alpha.overAndSelected="1" />
+ </s:LinearGradientStroke>
+ </s:stroke>
+ </s:Path>
+ </s:Group>
+
+ <!-- layer 8: text -->
+ <!--- The defines the appearance of the label for the first button in the ButtonBar component. -->
+ <s:Group left="2" top="2">
+ <s:BitmapImage source="@Embed('../personIcon.png')" width="16" height="16"/>
+
+ <s:Label id="labelDisplay"
+ textAlign="right"
+ verticalAlign="middle"
+ maxDisplayedLines="1"
+ horizontalCenter="7" verticalCenter="1"
+ left="10" right="10" top="2" bottom="2" color.down="#FFFFFF">
+ </s:Label>
+ </s:Group>
+
+</s:SparkSkin>
\ No newline at end of file
http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d4e368dc/TourDeFlex/TourDeFlex3/src/spark/containers/skins/CustomTabBarSkin.mxml
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex3/src/spark/containers/skins/CustomTabBarSkin.mxml b/TourDeFlex/TourDeFlex3/src/spark/containers/skins/CustomTabBarSkin.mxml
new file mode 100644
index 0000000..3621cac
--- /dev/null
+++ b/TourDeFlex/TourDeFlex3/src/spark/containers/skins/CustomTabBarSkin.mxml
@@ -0,0 +1,97 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+
+ Licensed to the Apache Software Foundation (ASF) under one or more
+ contributor license agreements. See the NOTICE file distributed with
+ this work for additional information regarding copyright ownership.
+ The ASF licenses this file to You 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.
+
+-->
+
+
+<!---
+
+The default skin class for the Spark TabBar component. The ButtonBarButtons
+created by the TabBar component use the TabBarButtonSkin class.
+
+@see spark.components.TabBar
+@see spark.components.ButtonBarButton
+
+@langversion 3.0
+@playerversion Flash 10
+@playerversion AIR 1.5
+@productversion Flex 4
+
+-->
+
+<s:Skin
+ xmlns:fx="http://ns.adobe.com/mxml/2009"
+ xmlns:s="library://ns.adobe.com/flex/spark"
+ xmlns:fb="http://ns.adobe.com/flashbuilder/2009"
+ alpha.disabled="0.5">
+
+ <fx:Metadata>
+ <![CDATA[
+ /**
+ * @copy spark.skins.spark.ApplicationSkin#hostComponent
+ */
+ [HostComponent("spark.components.TabBar")]
+ ]]>
+ </fx:Metadata>
+
+ <fx:Script fb:purpose="styling" >
+ <![CDATA[
+
+ import mx.core.UIComponent;
+
+ /**
+ * @private
+ * Push the cornerRadius style to the item renderers.
+ */
+ override protected function updateDisplayList(unscaledWidth:Number, unscaleHeight:Number):void
+ {
+ const numElements:int = dataGroup.numElements;
+ const cornerRadius:int = hostComponent.getStyle("cornerRadius");
+ for (var i:int = 0; i < numElements; i++)
+ {
+ var elt:UIComponent = dataGroup.getElementAt(i) as UIComponent;
+ if (elt)
+ elt.setStyle("cornerRadius", cornerRadius);
+ }
+
+ super.updateDisplayList(unscaledWidth, unscaledHeight);
+ }
+
+ ]]>
+ </fx:Script>
+
+ <s:states>
+ <s:State name="normal" />
+ <s:State name="disabled" />
+ </s:states>
+
+ <!---
+ @copy spark.components.SkinnableDataContainer#dataGroup
+ -->
+ <s:DataGroup id="dataGroup" width="100%" height="100%">
+ <s:layout>
+ <s:ButtonBarHorizontalLayout gap="-1"/>
+ </s:layout>
+ <s:itemRenderer>
+ <fx:Component>
+ <s:ButtonBarButton skinClass="skins.CustomTabBarButtonSkin" />
+ </fx:Component>
+ </s:itemRenderer>
+ </s:DataGroup>
+
+</s:Skin>
\ No newline at end of file
http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d4e368dc/TourDeFlex/TourDeFlex3/src/spark/controls/ButtonBarExample.mxml
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex3/src/spark/controls/ButtonBarExample.mxml b/TourDeFlex/TourDeFlex3/src/spark/controls/ButtonBarExample.mxml
new file mode 100644
index 0000000..928fe77
--- /dev/null
+++ b/TourDeFlex/TourDeFlex3/src/spark/controls/ButtonBarExample.mxml
@@ -0,0 +1,106 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+
+ Licensed to the Apache Software Foundation (ASF) under one or more
+ contributor license agreements. See the NOTICE file distributed with
+ this work for additional information regarding copyright ownership.
+ The ASF licenses this file to You 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.
+
+-->
+<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
+ xmlns:s="library://ns.adobe.com/flex/spark"
+ xmlns:mx="library://ns.adobe.com/flex/mx" viewSourceURL="srcview/index.html">
+
+ <fx:Style>
+ @namespace "library://ns.adobe.com/flex/spark";
+
+ ButtonBar ToggleButton:upAndSelected,
+ ButtonBar ToggleButton:overAndSelected,
+ ButtonBar ToggleButton:downAndSelected,
+ ButtonBar ToggleButton:disabledAndSelected {
+ baseColor: #FFFFFF;
+ color: #323232;
+ }
+ ButtonBar {
+ baseColor: #000000;
+ color: #FFFFFF;
+ }
+ </fx:Style>
+
+ <fx:Script>
+ <![CDATA[
+ import spark.events.IndexChangeEvent;
+
+ /**
+ * Index change handler will be called each time a button is clicked
+ * and the event will provide information needed such as the previous
+ * index clicked.
+ **/
+ protected function indexChangeHandler(event:IndexChangeEvent):void
+ {
+ myTextArea.text = "Button Bar index clicked = " + event.newIndex
+ myTextArea.text = myTextArea.text + "\nButton Bar previous index = " + event.oldIndex;
+ myTextArea.text = myTextArea.text + "\nButton Bar label clicked = " + myButtonBar.selectedItem;
+ if (myButtonBar.selectedItem=="Red") {
+ txtColor.setStyle("color","red");
+ txtColor.text="Red selected!";
+ }
+ else if (myButtonBar.selectedItem=="Green") {
+ txtColor.setStyle("color","green");
+ txtColor.text="Green selected!";
+ }
+ else if (myButtonBar.selectedItem=="Blue") {
+ txtColor.setStyle("color","blue");
+ txtColor.text="Blue selected!";
+ }
+ else {
+ txtColor.setStyle("color","yellow");
+ txtColor.text="Yellow selected!";
+ }
+ }
+ protected function resetButtonBar(event:MouseEvent):void
+ {
+ myButtonBar.selectedIndex = -1;
+ myTextArea.text = "";
+ }
+ ]]>
+ </fx:Script>
+
+ <!-- Note: A custom panel skin is used for the Tour de Flex samples and is included in the
+ source tabs for each sample. -->
+ <s:Panel title="ButtonBar Sample"
+ width="100%" height="100%"
+ horizontalCenter="0"
+ skinClass="skins.TDFPanelSkin">
+
+ <s:HGroup left="5" top="5" width="100%" height="100%">
+ <s:Label width="50%" fontSize="13" color="0x323232" verticalAlign="justify"
+ text="The ButtonBar component behaves like a series of toggle buttons, where one button remains selected
+and only one button in the ButtonBar control can be in the selected state. That means when you select a button in a ButtonBar
+control, the button stays in the selected state until you select a different button."/>
+ <s:VGroup left="10" top="5" color="0x000000" horizontalAlign="center">
+ <s:ButtonBar id="myButtonBar" change="indexChangeHandler(event)">
+ <mx:ArrayCollection>
+ <fx:String>Red</fx:String>
+ <fx:String>Green</fx:String>
+ <fx:String>Blue</fx:String>
+ <fx:String>Yellow</fx:String>
+ </mx:ArrayCollection>
+ </s:ButtonBar>
+ <s:TextArea id="myTextArea" width="{myButtonBar.width}" height="150"/>
+ <s:Button id="myButton" label="Reset Selection" click="resetButtonBar(event)"/>
+ <s:Label id="txtColor" fontSize="16"/>
+ </s:VGroup>
+ </s:HGroup>
+ </s:Panel>
+</s:Application>
http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d4e368dc/TourDeFlex/TourDeFlex3/src/spark/controls/ButtonExample.mxml
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex3/src/spark/controls/ButtonExample.mxml b/TourDeFlex/TourDeFlex3/src/spark/controls/ButtonExample.mxml
new file mode 100644
index 0000000..838c419
--- /dev/null
+++ b/TourDeFlex/TourDeFlex3/src/spark/controls/ButtonExample.mxml
@@ -0,0 +1,65 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+
+ Licensed to the Apache Software Foundation (ASF) under one or more
+ contributor license agreements. See the NOTICE file distributed with
+ this work for additional information regarding copyright ownership.
+ The ASF licenses this file to You 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.
+
+-->
+<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
+ xmlns:s="library://ns.adobe.com/flex/spark"
+ xmlns:mx="library://ns.adobe.com/flex/mx"
+ viewSourceURL="srcview/index.html">
+
+ <fx:Script>
+ <![CDATA[
+ import flash.events.Event;
+
+ protected function buttonClickHandler(event:Event):void
+ {
+ repeatText.text += event.target.label + " pressed!" + "\n";
+ }
+ ]]>
+ </fx:Script>
+
+ <!-- Note: A custom panel skin is used for the Tour de Flex samples and is included in the
+ source tabs for each sample. -->
+ <s:Panel width="100%" height="100%"
+ horizontalCenter="0"
+ title="Button Sample"
+ skinClass="skins.TDFPanelSkin">
+
+ <s:HGroup left="5" top="5" width="100%" height="100%">
+ <s:Label width="50%" fontSize="13" color="0x323232" verticalAlign="justify"
+ text="The Button component is a commonly used rectangular button. The Button
+component looks like it can be pressed. The default skin has a text label."/>
+
+ <s:VGroup right="10" bottom="5" color="0x000000" horizontalAlign="center">
+ <s:Label text="Output"/>
+ <s:TextArea id="repeatText" top="5" right="50" width="180" height="100"/>
+ <s:Button id="standardBtn" label="Standard Button"
+ click="buttonClickHandler(event)"
+ fontWeight="normal"/>
+ <s:Button id="disabledBtn" label="Disabled Button" enabled="false"/>
+ <s:Button id="repeatBtn" label="Repeat Button"
+ buttonDown="buttonClickHandler(event)"
+ autoRepeat="true"/>
+ <s:Label verticalAlign="justify"
+ text="Hold down on repeat button to see autoRepeat behavior."/>
+
+ </s:VGroup>
+ </s:HGroup>
+ </s:Panel>
+
+</s:Application>
http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d4e368dc/TourDeFlex/TourDeFlex3/src/spark/controls/CheckboxExample.mxml
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex3/src/spark/controls/CheckboxExample.mxml b/TourDeFlex/TourDeFlex3/src/spark/controls/CheckboxExample.mxml
new file mode 100644
index 0000000..77de6bb
--- /dev/null
+++ b/TourDeFlex/TourDeFlex3/src/spark/controls/CheckboxExample.mxml
@@ -0,0 +1,78 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+
+ Licensed to the Apache Software Foundation (ASF) under one or more
+ contributor license agreements. See the NOTICE file distributed with
+ this work for additional information regarding copyright ownership.
+ The ASF licenses this file to You 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.
+
+-->
+<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
+ xmlns:s="library://ns.adobe.com/flex/spark"
+ xmlns:mx="library://ns.adobe.com/flex/mx"
+ viewSourceURL="srcview/index.html">
+
+ <fx:Script>
+ <![CDATA[
+ [Bindable]
+ public var totalCost:Number = 4.50;
+
+ // This event handler adds/removes the cost of condiments to/from the total cost.
+ private function modifyBurger(evt:MouseEvent):void {
+ // Add 0.25 to the total cost for every condiment. Delete 0.25 for
+ // every condiment removed.
+ if(CheckBox(evt.target).selected) {
+ totalCost += 0.25;
+ } else {
+ totalCost -= 0.25;
+ }
+ // Format the totalCost and then display it in a label.
+ totalString.text = usdFormatter.format(totalCost);
+ }
+ ]]>
+ </fx:Script>
+ <fx:Declarations>
+ <mx:CurrencyFormatter id="usdFormatter" precision="2" currencySymbol="$"
+ decimalSeparatorFrom="." decimalSeparatorTo="."
+ useNegativeSign="true"
+ useThousandsSeparator="true" alignSymbol="left"/>
+ </fx:Declarations>
+
+ <!-- Note: A custom panel skin is used for the Tour de Flex samples and is included in the
+ source tabs for each sample. -->
+ <s:Panel title="CheckBox Sample"
+ width="100%" height="100%"
+ skinClass="skins.TDFPanelSkin">
+ <s:VGroup left="10" right="10" top="10" bottom="10">
+ <s:Label text="Hamburger Base Price: $4.50" />
+ <s:Label text="Select condiments for your hamburger (0.25 each):" />
+
+ <s:CheckBox id="lettuceCB" label="Pickles" click="modifyBurger(event);"/>
+ <s:CheckBox id="tomatoCB" label="Tomato" click="modifyBurger(event);"/>
+ <s:CheckBox id="pickleCB" label="Lettuce" click="modifyBurger(event);"/>
+ <s:CheckBox id="mayoCB" label="Mayonnaise" click="modifyBurger(event);"/>
+
+ <mx:Spacer height="10" />
+ <s:HGroup>
+ <s:Label text="Total Price: " color="0x336699" fontWeight="bold"/>
+ <s:Label id="totalString" text="$4.50" color="0x336699" fontWeight="bold"/>
+ </s:HGroup>
+ </s:VGroup>
+ <s:Label top="10" right="10" width="250" verticalAlign="justify" color="#323232"
+ text="The CheckBox control is a commonly used graphical control that can
+contain a check mark or not. You can use CheckBox controls to gather a
+set of true or false values that aren’t mutually exclusive."/>
+ </s:Panel>
+
+
+</s:Application>
http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d4e368dc/TourDeFlex/TourDeFlex3/src/spark/controls/CustomDataGridSkin.mxml
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex3/src/spark/controls/CustomDataGridSkin.mxml b/TourDeFlex/TourDeFlex3/src/spark/controls/CustomDataGridSkin.mxml
new file mode 100644
index 0000000..b3da2b7
--- /dev/null
+++ b/TourDeFlex/TourDeFlex3/src/spark/controls/CustomDataGridSkin.mxml
@@ -0,0 +1,375 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+
+ Licensed to the Apache Software Foundation (ASF) under one or more
+ contributor license agreements. See the NOTICE file distributed with
+ this work for additional information regarding copyright ownership.
+ The ASF licenses this file to You 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.
+
+-->
+
+<s:SparkSkin
+ xmlns:fx="http://ns.adobe.com/mxml/2009"
+ xmlns:s="library://ns.adobe.com/flex/spark"
+ xmlns:mx="library://ns.adobe.com/flex/mx"
+ xmlns:fb="http://ns.adobe.com/flashbuilder/2009"
+ alpha.disabled="0.5" minWidth="89" minHeight="84">
+
+ <fx:Metadata>
+ <![CDATA[
+ /**
+ * @copy spark.skins.spark.ApplicationSkin#hostComponent
+ @langversion 3.0
+ @playerversion Flash 10
+ @playerversion AIR 1.5
+ @productversion Flex 4
+ */
+ [HostComponent("spark.components.DataGrid")]
+ ]]>
+ </fx:Metadata>
+
+ <s:states>
+ <s:State name="normal" />
+ <s:State name="disabled" />
+ </s:states>
+
+ <fx:Declarations>
+ <!--- @private -->
+ <fx:Component id="alternatingRowColorsBackground">
+ <s:Rect implements="spark.components.gridClasses.IGridVisualElement">
+ <fx:Script>
+ <![CDATA[
+ import spark.components.DataGrid;
+ import spark.components.Grid;
+
+ /**
+ * @private
+ */
+ public function prepareGridVisualElement(grid:Grid, rowIndex:int, columnIndex:int):void
+ {
+ const dataGrid:DataGrid = grid.dataGrid;
+ if (!dataGrid)
+ return;
+
+ const colors:Array = dataGrid.getStyle("alternatingRowColors");
+ if (colors && (colors.length > 0))
+ {
+ dataGrid.styleManager.getColorNames(colors); // lazily replace color names with ints
+ rowBackgroundFillColor.color = colors[rowIndex % colors.length];
+ }
+ else
+ {
+ // This should be the same as bgFill.color.
+ rowBackgroundFillColor.color = 0xFFFFFF;
+ }
+ }
+ ]]>
+ </fx:Script>
+ <s:fill>
+ <!--- @private -->
+ <s:SolidColor id="rowBackgroundFillColor" color="0xFFFFFF"/>
+ </s:fill>
+ </s:Rect>
+ </fx:Component>
+
+ <!--- @private -->
+ <fx:Component id="caretIndicator">
+ <s:Rect implements="spark.components.gridClasses.IGridVisualElement">
+ <fx:Script>
+ <![CDATA[
+ import spark.components.DataGrid;
+ import spark.components.Grid;
+
+ /**
+ * @private
+ */
+ public function prepareGridVisualElement(grid:Grid, rowIndex:int, columnIndex:int):void
+ {
+ const dataGrid:DataGrid = grid.dataGrid;
+ if (!dataGrid)
+ return;
+
+ const color:uint = dataGrid.getStyle("caretColor");
+ caretIndicatorFill.color = color;
+ }
+ ]]>
+ </fx:Script>
+
+ <s:stroke>
+ <!--- @private -->
+ <s:SolidColorStroke id="caretIndicatorFill" color="0x0167FF" weight="1"/>
+ </s:stroke>
+ </s:Rect>
+ </fx:Component>
+
+ <!--- @private -->
+ <fx:Component id="columnSeparator">
+ <s:Line>
+ <s:stroke>
+ <s:SolidColorStroke color="0xE6E6E6" weight="1" caps="square"/>
+ </s:stroke>
+ </s:Line>
+ </fx:Component>
+
+ <!--- Defines the value of the columnSeparator property for the columnHeaderGroup. -->
+ <fx:Component id="headerColumnSeparator">
+ <s:Line>
+ <s:stroke>
+ <s:SolidColorStroke color="0x696969" weight="1" caps="square"/>
+ </s:stroke>
+ </s:Line>
+ </fx:Component>
+
+ <!--- Defines the value of the headerRenderer property for the columnHeaderGroup.
+ The default is spark.skins.spark.DefaultGridHeaderRenderer -->
+ <fx:Component id="headerRenderer">
+ <s:DefaultGridHeaderRenderer />
+ </fx:Component>
+
+ <!--- @private -->
+ <fx:Component id="hoverIndicator">
+ <s:Rect implements="spark.components.gridClasses.IGridVisualElement">
+ <fx:Script>
+ <![CDATA[
+ import spark.components.DataGrid;
+ import spark.components.Grid;
+
+ /**
+ * @private
+ */
+ public function prepareGridVisualElement(grid:Grid, rowIndex:int, columnIndex:int):void
+ {
+ const dataGrid:DataGrid = grid.dataGrid;
+ if (!dataGrid)
+ return;
+
+ const color:uint = dataGrid.getStyle("rollOverColor");
+ hoverIndicatorFill.color = color;
+ }
+ ]]>
+ </fx:Script>
+
+ <s:fill>
+ <!--- @private -->
+ <s:SolidColor id="hoverIndicatorFill" color="0xCEDBEF"/>
+ </s:fill>
+ </s:Rect>
+ </fx:Component>
+
+ <!--- @private -->
+ <fx:Component id="rowSeparator">
+ <s:Line>
+ <s:stroke>
+ <s:SolidColorStroke color="0xE6E6E6" weight="1" caps="square"/>
+ </s:stroke>
+ </s:Line>
+ </fx:Component>
+
+ <!--- @private -->
+ <fx:Component id="selectionIndicator">
+ <s:Rect implements="spark.components.gridClasses.IGridVisualElement">
+ <fx:Script>
+ <![CDATA[
+ import spark.components.DataGrid;
+ import spark.components.Grid;
+
+ /**
+ * @private
+ */
+ public function prepareGridVisualElement(grid:Grid, rowIndex:int, columnIndex:int):void
+ {
+ const dataGrid:DataGrid = grid.dataGrid;
+ if (!dataGrid)
+ return;
+
+ const color:uint = dataGrid.getStyle("selectionColor");
+ selectionIndicatorFill.color = color;
+ }
+ ]]>
+ </fx:Script>
+
+ <s:fill>
+ <!--- @private -->
+ <s:SolidColor id="selectionIndicatorFill" color="0xA8C6EE"/>
+ </s:fill>
+ </s:Rect>
+ </fx:Component>
+
+ <!--- @private -->
+ <fx:Component id="editorIndicator">
+ <s:Rect>
+ <s:fill>
+ <s:SolidColor color="0xFFFFFF"/>
+ </s:fill>
+ </s:Rect>
+ </fx:Component>
+
+ </fx:Declarations>
+
+ <fx:Script fb:purpose="styling">
+ <![CDATA[
+ static private const exclusions:Array = ["scroller", "background", "columnHeaderGroup"];
+ static private const contentFill:Array = ["bgFill"];
+
+ /**
+ * @private
+ */
+ override public function get colorizeExclusions():Array {return exclusions;}
+
+ /**
+ * @private
+ */
+ override public function get contentItems():Array {return contentFill};
+
+ /**
+ * @private
+ */
+ override protected function initializationComplete():void
+ {
+ useChromeColor = true;
+ super.initializationComplete();
+ }
+
+ /**
+ * @private
+ */
+ override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void
+ {
+ if (getStyle("borderVisible") == true)
+ {
+ border.visible = true;
+ background.left = background.top = background.right = background.bottom = 1;
+ scroller.minViewportInset = 1;
+ }
+ else
+ {
+ border.visible = false;
+ background.left = background.top = background.right = background.bottom = 0;
+ scroller.minViewportInset = 0;
+ }
+
+ borderStroke.color = getStyle("borderColor");
+ borderStroke.alpha = getStyle("borderAlpha");
+
+ super.updateDisplayList(unscaledWidth, unscaledHeight);
+ }
+ ]]>
+ </fx:Script>
+
+ <!-- column header, content -->
+ <s:VGroup horizontalAlign="justify" gap="0" left="0" right="0" top="0" bottom="0">
+
+ <!--- @private -->
+ <s:GridColumnHeaderGroup id="columnHeaderGroup"
+ paddingLeft="1" paddingTop="1" paddingRight="1" minHeight="21"
+ columnSeparator="{headerColumnSeparator}"
+ headerRenderer="{headerRenderer}"/>
+
+ <s:Group height="100%">
+
+ <!--- @private -->
+ <s:Rect id="background" left="1" right="1" top="1" bottom="1" >
+ <s:fill>
+ <!--- Defines the color of the background. The default color is 0xFFFFFF. -->
+ <s:SolidColor id="bgFill" color="0xFFFFFF" />
+ </s:fill>
+ </s:Rect>
+
+ <!-- header separator, scroller and grid -->
+ <s:VGroup horizontalAlign="justify" height="100%" width="100%" gap="-1">
+ <!--- @private -->
+ <s:Line id="headerSeparator">
+ <s:stroke>
+ <s:SolidColorStroke color="0x696969" weight="1" caps="square"/>
+ </s:stroke>
+ </s:Line>
+
+ <!--- @private -->
+ <s:Scroller id="scroller" minViewportInset="1" hasFocusableChildren="false" height="100%">
+ <s:Grid id="grid" itemRenderer="spark.skins.spark.DefaultGridItemRenderer">
+ <!--
+ <s:itemRenderer>
+ <fx:Component>
+ <s:GridItemRenderer>
+ <s:Label id="labelDisplay" paddingLeft="7" paddingRight="7" paddingBottom="5" paddingTop="9" width="100%" height="100%"/>
+ </s:GridItemRenderer>
+ </fx:Component>
+ </s:itemRenderer>
+ -->
+
+ <s:caretIndicator>
+ <fx:Component>
+ <s:Rect>
+ <s:stroke>
+ <s:SolidColorStroke color="0xff0000" weight="1"/>
+ </s:stroke>
+ </s:Rect>
+ </fx:Component>
+ </s:caretIndicator>
+
+ <s:selectionIndicator>
+ <fx:Component>
+ <s:Rect>
+ <s:fill>
+ <s:SolidColor color="0x00ff00"/>
+ </s:fill>
+ </s:Rect>
+ </fx:Component>
+ </s:selectionIndicator>
+
+ <s:columnSeparator>
+ <fx:Component>
+ <s:Line>
+ <s:stroke>
+ <s:SolidColorStroke color="0xE6E6E6" weight="1"/>
+ </s:stroke>
+ </s:Line>
+ </fx:Component>
+ </s:columnSeparator>
+ <s:rowSeparator>
+ <fx:Component>
+ <s:Line>
+ <s:stroke>
+ <s:SolidColorStroke color="0xE6E6E6" weight="1"/>
+ </s:stroke>
+ </s:Line>
+ </fx:Component>
+ </s:rowSeparator>
+
+ <s:hoverIndicator>
+ <fx:Component>
+ <s:Rect>
+ <s:fill>
+ <s:SolidColor color="0x0000ff"/>
+ </s:fill>
+ </s:Rect>
+ </fx:Component>
+ </s:hoverIndicator>
+ </s:Grid>
+ </s:Scroller>
+ </s:VGroup>
+
+ </s:Group>
+
+ </s:VGroup>
+
+ <!-- border -->
+ <!--- @private -->
+ <s:Rect left="0" right="0" top="0" bottom="0" id="border">
+ <s:stroke>
+ <!--- @private -->
+ <s:SolidColorStroke id="borderStroke" weight="1"/>
+ </s:stroke>
+ </s:Rect>
+
+</s:SparkSkin>