Added ToggleSwitch UI control to Mobile project.
Project: http://git-wip-us.apache.org/repos/asf/flex-asjs/repo Commit: http://git-wip-us.apache.org/repos/asf/flex-asjs/commit/1c4d36c0 Tree: http://git-wip-us.apache.org/repos/asf/flex-asjs/tree/1c4d36c0 Diff: http://git-wip-us.apache.org/repos/asf/flex-asjs/diff/1c4d36c0 Branch: refs/heads/spark Commit: 1c4d36c086434d36f05e54588e1bdb55fe755fd7 Parents: 1c69a39 Author: Peter Ent <[email protected]> Authored: Wed Mar 9 16:21:19 2016 -0500 Committer: Peter Ent <[email protected]> Committed: Wed Mar 9 16:21:19 2016 -0500 ---------------------------------------------------------------------- .../projects/HTML/src/main/flex/HTMLClasses.as | 2 +- .../Mobile/src/main/flex/MobileClasses.as | 3 + .../flex/org/apache/flex/mobile/ToggleSwitch.as | 105 +++++++++++ .../flex/mobile/beads/ToggleSwitchView.as | 180 +++++++++++++++++++ .../controllers/ToggleSwitchMouseController.as | 120 +++++++++++++ .../src/main/resources/basic-manifest.xml | 1 + .../Mobile/src/main/resources/defaults.css | 9 + 7 files changed, 419 insertions(+), 1 deletion(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/1c4d36c0/frameworks/projects/HTML/src/main/flex/HTMLClasses.as ---------------------------------------------------------------------- diff --git a/frameworks/projects/HTML/src/main/flex/HTMLClasses.as b/frameworks/projects/HTML/src/main/flex/HTMLClasses.as index e5171d4..ad3ba4b 100644 --- a/frameworks/projects/HTML/src/main/flex/HTMLClasses.as +++ b/frameworks/projects/HTML/src/main/flex/HTMLClasses.as @@ -107,9 +107,9 @@ internal class HTMLClasses } import org.apache.flex.html.beads.models.TextModel; TextModel; import org.apache.flex.html.beads.models.TitleBarModel; TitleBarModel; + import org.apache.flex.html.beads.models.ToggleButtonModel; ToggleButtonModel; COMPILE::AS3 { - import org.apache.flex.html.beads.models.ToggleButtonModel; ToggleButtonModel; import org.apache.flex.html.beads.models.ValueToggleButtonModel; ValueToggleButtonModel; } import org.apache.flex.html.beads.models.ViewportModel; ViewportModel; http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/1c4d36c0/frameworks/projects/Mobile/src/main/flex/MobileClasses.as ---------------------------------------------------------------------- diff --git a/frameworks/projects/Mobile/src/main/flex/MobileClasses.as b/frameworks/projects/Mobile/src/main/flex/MobileClasses.as index 5a85f94..b1e6dae 100644 --- a/frameworks/projects/Mobile/src/main/flex/MobileClasses.as +++ b/frameworks/projects/Mobile/src/main/flex/MobileClasses.as @@ -29,10 +29,13 @@ internal class MobileClasses { import org.apache.flex.mobile.ManagerBase; ManagerBase; + import org.apache.flex.mobile.ToggleSwitch; ToggleSwitch; import org.apache.flex.mobile.ViewManagerBase; ViewManagerBase; import org.apache.flex.mobile.beads.StackedViewManagerView; StackedViewManagerView; import org.apache.flex.mobile.beads.TabbedViewManagerView; TabbedViewManagerView; import org.apache.flex.mobile.beads.ViewManagerView; ViewManagerView; + import org.apache.flex.mobile.beads.ToggleSwitchView; ToggleSwitchView; + import org.apache.flex.mobile.beads.controllers.ToggleSwitchMouseController; ToggleSwitchMouseController; import org.apache.flex.mobile.chrome.NavigationBar; NavigationBar; import org.apache.flex.mobile.chrome.TabBar; TabBar; import org.apache.flex.mobile.chrome.ToolBar; ToolBar; http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/1c4d36c0/frameworks/projects/Mobile/src/main/flex/org/apache/flex/mobile/ToggleSwitch.as ---------------------------------------------------------------------- diff --git a/frameworks/projects/Mobile/src/main/flex/org/apache/flex/mobile/ToggleSwitch.as b/frameworks/projects/Mobile/src/main/flex/org/apache/flex/mobile/ToggleSwitch.as new file mode 100644 index 0000000..e5f83fb --- /dev/null +++ b/frameworks/projects/Mobile/src/main/flex/org/apache/flex/mobile/ToggleSwitch.as @@ -0,0 +1,105 @@ +//////////////////////////////////////////////////////////////////////////////// +// +// 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 org.apache.flex.mobile +{ + import org.apache.flex.core.IBead; + import org.apache.flex.core.IBeadController; + import org.apache.flex.core.IToggleButtonModel; + import org.apache.flex.core.UIBase; + import org.apache.flex.core.ValuesManager; + + /** + * The ToggleSwitch is a UI control that displays on/off or yes/no states. + * + * @langversion 3.0 + * @playerversion Flash 10.2 + * @playerversion AIR 2.6 + * @productversion FlexJS 0.0 + */ + public class ToggleSwitch extends UIBase + { + /** + * Constructor + * + * @langversion 3.0 + * @playerversion Flash 10.2 + * @playerversion AIR 2.6 + * @productversion FlexJS 0.0 + */ + public function ToggleSwitch() + { + super(); + + COMPILE::JS { + setWidthAndHeight(40.0, 25.0, false); + } + } + + [Bindable("change")] + /** + * <code>true</code> if the switch is selected. + * + * @langversion 3.0 + * @playerversion Flash 10.2 + * @playerversion AIR 2.6 + * @productversion FlexJS 0.0 + */ + public function get selected():Boolean + { + return IToggleButtonModel(model).selected; + } + + /** + * @private + */ + public function set selected(value:Boolean):void + { + IToggleButtonModel(model).selected = value; + } + + private var _controller:IBeadController; + + /** + * Get the controller for the view. + * + * @flexjsignorecoercion Class + * + * @langversion 3.0 + * @playerversion Flash 10.2 + * @playerversion AIR 2.6 + * @productversion FlexJS 0.0 + */ + public function get controller():IBeadController + { + if (_controller == null) { + _controller = getBeadByType(IBeadController) as IBeadController; + if (_controller == null) { + var c:Class = ValuesManager.valuesImpl.getValue(this, "iBeadController") as Class; + _controller = new c() as IBeadController; + addBead(_controller); + } + } + return _controller; + } + public function set controller(value:IBeadController):void + { + _controller = value; + } + } +} \ No newline at end of file http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/1c4d36c0/frameworks/projects/Mobile/src/main/flex/org/apache/flex/mobile/beads/ToggleSwitchView.as ---------------------------------------------------------------------- diff --git a/frameworks/projects/Mobile/src/main/flex/org/apache/flex/mobile/beads/ToggleSwitchView.as b/frameworks/projects/Mobile/src/main/flex/org/apache/flex/mobile/beads/ToggleSwitchView.as new file mode 100644 index 0000000..fe35d45 --- /dev/null +++ b/frameworks/projects/Mobile/src/main/flex/org/apache/flex/mobile/beads/ToggleSwitchView.as @@ -0,0 +1,180 @@ +//////////////////////////////////////////////////////////////////////////////// +// +// 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 org.apache.flex.mobile.beads +{ + import org.apache.flex.core.IStrand; + import org.apache.flex.core.IBeadView; + import org.apache.flex.core.IToggleButtonModel; + import org.apache.flex.core.IUIBase; + import org.apache.flex.core.UIBase; + import org.apache.flex.core.graphics.Rect; + import org.apache.flex.core.graphics.SolidColor; + import org.apache.flex.core.graphics.SolidColorStroke; + import org.apache.flex.events.Event; + + /** + * The ToggleSwitchView creates the element used to display the ToggleSwitch + * interface. + * + * @langversion 3.0 + * @playerversion Flash 10.2 + * @playerversion AIR 2.6 + * @productversion FlexJS 0.0 + */ + public class ToggleSwitchView implements IBeadView + { + /** + * Constructor. + * + * @langversion 3.0 + * @playerversion Flash 10.2 + * @playerversion AIR 2.6 + * @productversion FlexJS 0.0 + */ + public function ToggleSwitchView() + { + super(); + } + + /** + * @private + */ + public var boundingBox:Rect; + + /** + * @private + */ + public var actualSwitch:Rect; + + /** + * @private + */ + public function get host():IUIBase + { + return _strand as IUIBase; + } + public function set host(value:IUIBase):void + { + // not implemented; getter only. + } + + private var _strand:IStrand; + + /** + * @private + */ + public function get strand():IStrand + { + return _strand; + } + public function set strand(value:IStrand):void + { + _strand = value; + UIBase(_strand).addEventListener("sizeChanged", sizeChangedHandler); + UIBase(_strand).addEventListener("widthChanged", sizeChangedHandler); + UIBase(_strand).addEventListener("heightChanged", sizeChangedHandler); + + var model:IToggleButtonModel = value.getBeadByType(IToggleButtonModel) as IToggleButtonModel; + model.addEventListener("selectedChange", toggleChangedHandler); + + boundingBox = new Rect(); + UIBase(host).addElement(boundingBox, false); + + actualSwitch = new Rect(); + UIBase(host).addElement(actualSwitch, false); + + layoutChromeElements(); + } + + /** + * @private + */ + protected function toggleChangedHandler(event:Event):void + { + layoutChromeElements(); + } + + /** + * @private + */ + protected function sizeChangedHandler(event:Event):void + { + layoutChromeElements(); + } + + /** + * @private + */ + protected function layoutChromeElements():void + { + sizeViewsToFitContentArea(); + } + + /** + * @private + */ + protected function sizeViewsToFitContentArea():void + { + var model:IToggleButtonModel = _strand.getBeadByType(IToggleButtonModel) as IToggleButtonModel; + + boundingBox.x = 0; + boundingBox.y = 0; + boundingBox.setWidthAndHeight(host.width, host.height, false); + + actualSwitch.y = 2; + actualSwitch.setWidthAndHeight(host.width/2 - 2, host.height-4, false); + + var fill:SolidColor = new SolidColor(); + fill.alpha = 2.0; + + var switchFill:SolidColor = new SolidColor(); + switchFill.alpha = 1.0; + switchFill.color = 0xFFFFFF; + actualSwitch.fill = switchFill; + + var border:SolidColorStroke = new SolidColorStroke(); + border.alpha = 1.0; + border.color = 0x333333; + border.weight = 1.0; + + boundingBox.stroke = border; + actualSwitch.stroke = border; + + if (model.selected) { + actualSwitch.x = host.width / 2; + fill.color = 0x00DD00; + boundingBox.fill = fill; + } else { + actualSwitch.x = 2; + fill.color = 0xFFFFFF; + boundingBox.fill = fill; + } + + COMPILE::AS3 { + boundingBox.drawRect(0, 0, boundingBox.width, boundingBox.height); + actualSwitch.drawRect(0, 0, actualSwitch.width, actualSwitch.height); + } + COMPILE::JS { + boundingBox.drawRect(0, 0, boundingBox.width, boundingBox.height); + actualSwitch.drawRect(actualSwitch.x, actualSwitch.y, actualSwitch.width, actualSwitch.height); + } + + } + } +} http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/1c4d36c0/frameworks/projects/Mobile/src/main/flex/org/apache/flex/mobile/beads/controllers/ToggleSwitchMouseController.as ---------------------------------------------------------------------- diff --git a/frameworks/projects/Mobile/src/main/flex/org/apache/flex/mobile/beads/controllers/ToggleSwitchMouseController.as b/frameworks/projects/Mobile/src/main/flex/org/apache/flex/mobile/beads/controllers/ToggleSwitchMouseController.as new file mode 100644 index 0000000..d67f14d --- /dev/null +++ b/frameworks/projects/Mobile/src/main/flex/org/apache/flex/mobile/beads/controllers/ToggleSwitchMouseController.as @@ -0,0 +1,120 @@ +//////////////////////////////////////////////////////////////////////////////// +// +// 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 org.apache.flex.mobile.beads.controllers +{ + import org.apache.flex.core.IBeadController; + import org.apache.flex.core.IToggleButtonModel; + import org.apache.flex.core.IStrand; + import org.apache.flex.core.IBeadView; + import org.apache.flex.core.UIBase; + import org.apache.flex.events.Event; + import org.apache.flex.events.IEventDispatcher; + import org.apache.flex.events.MouseEvent; + import org.apache.flex.mobile.beads.ToggleSwitchView; + COMPILE::JS + { + import goog.events; + import goog.events.EventType; + } + + /** + * The ToggleSwitchMouseController bead handles mouse events on the + * ToggleSwitch, allowing the user to use the mouse to change the + * state of the ToggleSwitch. + * + * @langversion 3.0 + * @playerversion Flash 10.2 + * @playerversion AIR 2.6 + * @productversion FlexJS 0.0 + */ + public class ToggleSwitchMouseController implements IBeadController + { + /** + * Constructor. + * + * @langversion 3.0 + * @playerversion Flash 10.2 + * @playerversion AIR 2.6 + * @productversion FlexJS 0.0 + */ + public function ToggleSwitchMouseController() + { + } + + private var model:IToggleButtonModel; + + private var _strand:IStrand; + + /** + * @copy org.apache.flex.core.IBead#strand + * + * @flexjsignorecoercion org.apache.flex.html.Spinner + * @langversion 3.0 + * @playerversion Flash 10.2 + * @playerversion AIR 2.6 + * @productversion FlexJS 0.0 + */ + public function set strand(value:IStrand):void + { + _strand = value; + + model = UIBase(value).model as IToggleButtonModel; + + COMPILE::AS3 + { + var viewBead:ToggleSwitchView = value.getBeadByType(IBeadView) as ToggleSwitchView; + viewBead.boundingBox.addEventListener(MouseEvent.CLICK, asClickHandler); + viewBead.actualSwitch.addEventListener(MouseEvent.CLICK, asClickHandler); + } + + COMPILE::JS + { + var viewBead:ToggleSwitchView = value.getBeadByType(IBeadView) as ToggleSwitchView; + + goog.events.listen(viewBead.boundingBox.element, goog.events.EventType.CLICK, + jsClickHandler); + goog.events.listen(viewBead.actualSwitch.element, goog.events.EventType.CLICK, + jsClickHandler); + + } + } + + /** + * @private + */ + COMPILE::AS3 + private function asClickHandler( event:MouseEvent ) : void + { + var oldValue:Boolean = model.selected; + model.selected = !oldValue; + IEventDispatcher(_strand).dispatchEvent(new Event("valueChanged")); + } + + /** + * @private + */ + COMPILE::JS + private function jsClickHandler( event:Event ) : void + { + var oldValue:Boolean = model.selected; + model.selected = !oldValue; + IEventDispatcher(_strand).dispatchEvent(new Event("valueChanged")); + } + } +} http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/1c4d36c0/frameworks/projects/Mobile/src/main/resources/basic-manifest.xml ---------------------------------------------------------------------- diff --git a/frameworks/projects/Mobile/src/main/resources/basic-manifest.xml b/frameworks/projects/Mobile/src/main/resources/basic-manifest.xml index 4f54235..a70352f 100644 --- a/frameworks/projects/Mobile/src/main/resources/basic-manifest.xml +++ b/frameworks/projects/Mobile/src/main/resources/basic-manifest.xml @@ -26,4 +26,5 @@ <component id="NavigationBar" class="org.apache.flex.mobile.chrome.NavigationBar" /> <component id="ToolBar" class="org.apache.flex.mobile.chrome.ToolBar" /> <component id="TabBar" class="org.apache.flex.mobile.chrome.TabBar" /> + <component id="ToggleSwitch" class="org.apache.flex.mobile.ToggleSwitch" /> </componentPackage> http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/1c4d36c0/frameworks/projects/Mobile/src/main/resources/defaults.css ---------------------------------------------------------------------- diff --git a/frameworks/projects/Mobile/src/main/resources/defaults.css b/frameworks/projects/Mobile/src/main/resources/defaults.css index d529595..c1e2828 100644 --- a/frameworks/projects/Mobile/src/main/resources/defaults.css +++ b/frameworks/projects/Mobile/src/main/resources/defaults.css @@ -31,3 +31,12 @@ TabbedViewManager IBeadModel: ClassReference("org.apache.flex.mobile.models.ViewManagerModel"); IBeadView: ClassReference("org.apache.flex.mobile.beads.TabbedViewManagerView"); } + +ToggleSwitch +{ + IBeadModel: ClassReference("org.apache.flex.html.beads.models.ToggleButtonModel"); + IBeadView: ClassReference("org.apache.flex.mobile.beads.ToggleSwitchView"); + IBeadController: ClassReference("org.apache.flex.mobile.beads.controllers.ToggleSwitchMouseController"); + width: 40px; + height: 25px; +}
