Repository: flex-asjs Updated Branches: refs/heads/develop 416bd3d17 -> 0f2513c02
- Add first version of Switch button - Add Switch button to MDLExample - Remove unused import from CheckBox Project: http://git-wip-us.apache.org/repos/asf/flex-asjs/repo Commit: http://git-wip-us.apache.org/repos/asf/flex-asjs/commit/0f2513c0 Tree: http://git-wip-us.apache.org/repos/asf/flex-asjs/tree/0f2513c0 Diff: http://git-wip-us.apache.org/repos/asf/flex-asjs/diff/0f2513c0 Branch: refs/heads/develop Commit: 0f2513c027c455cca760377c186fbcb5c82b6d93 Parents: 416bd3d Author: piotrz <[email protected]> Authored: Mon Nov 21 20:59:24 2016 +0100 Committer: piotrz <[email protected]> Committed: Mon Nov 21 20:59:24 2016 +0100 ---------------------------------------------------------------------- .../flexjs/MDLExample/src/main/flex/App.mxml | 2 +- .../main/flex/org/apache/flex/mdl/CheckBox.as | 2 +- .../src/main/flex/org/apache/flex/mdl/Switch.as | 175 +++++++++++++++++++ .../src/main/resources/mdl-manifest.xml | 5 +- 4 files changed, 180 insertions(+), 4 deletions(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/0f2513c0/examples/flexjs/MDLExample/src/main/flex/App.mxml ---------------------------------------------------------------------- diff --git a/examples/flexjs/MDLExample/src/main/flex/App.mxml b/examples/flexjs/MDLExample/src/main/flex/App.mxml index 6743d44..125d155 100644 --- a/examples/flexjs/MDLExample/src/main/flex/App.mxml +++ b/examples/flexjs/MDLExample/src/main/flex/App.mxml @@ -81,7 +81,7 @@ limitations under the License. <mdl:RadioButton groupName="g1" text="Black" className="mdlrb_example"/> <mdl:RadioButton groupName="g1" text="Ripple" ripple="true"/> <mdl:RadioButton groupName="g1" text="Red"/> - + <mdl:Switch text="Switch" ripple="true" selected="true"/> <js:VContainer> <js:Div text="account_box" className="material-icons" style="color: rgba(0, 0, 0, 0.24);"> <js:beads> http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/0f2513c0/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/CheckBox.as ---------------------------------------------------------------------- diff --git a/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/CheckBox.as b/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/CheckBox.as index f9473e6..640dfdc 100644 --- a/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/CheckBox.as +++ b/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/CheckBox.as @@ -26,7 +26,6 @@ package org.apache.flex.mdl { import org.apache.flex.core.UIBase; import org.apache.flex.core.WrappedHTMLElement; - import org.apache.flex.events.Event; } /** @@ -131,6 +130,7 @@ package org.apache.flex.mdl }; protected var _ripple:Boolean = false; + /** * A boolean flag to activate "mdl-js-ripple-effect" effect selector. * Applies ripple click effect. May be used in combination with any other classes http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/0f2513c0/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/Switch.as ---------------------------------------------------------------------- diff --git a/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/Switch.as b/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/Switch.as new file mode 100644 index 0000000..8e52548 --- /dev/null +++ b/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/Switch.as @@ -0,0 +1,175 @@ +//////////////////////////////////////////////////////////////////////////////// +// +// 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.mdl +{ + + COMPILE::SWF + { + import org.apache.flex.html.ToggleTextButton; + } + + COMPILE::JS + { + import org.apache.flex.core.WrappedHTMLElement; + import org.apache.flex.core.UIBase; + } + + /** + * The Switch class provides a MDL UI-like appearance for + * a Switch. + * + * @langversion 3.0 + * @playerversion Flash 10.2 + * @playerversion AIR 2.6 + * @productversion FlexJS 0.0 + */ + COMPILE::SWF + public class Switch extends org.apache.flex.html.ToggleTextButton + { + /** + * Constructor. + * + * @langversion 3.0 + * @playerversion Flash 10.2 + * @playerversion AIR 2.6 + * @productversion FlexJS 0.0 + */ + public function Switch() + { + super(); + } + + protected var _ripple:Boolean = false; + /** + * A boolean flag to activate "mdl-js-ripple-effect" effect selector. + * + * @langversion 3.0 + * @playerversion Flash 10.2 + * @playerversion AIR 2.6 + * @productversion FlexJS 0.0 + */ + public function get ripple():Boolean + { + return _ripple; + } + + public function set ripple(value:Boolean):void + { + _ripple = value; + } + } + + COMPILE::JS + public class Switch extends UIBase + { + /** + * Constructor. + * + * @langversion 3.0 + * @playerversion Flash 10.2 + * @playerversion AIR 2.6 + * @productversion FlexJS 0.0 + */ + public function Switch() + { + super(); + + className = ""; + } + + private var label:HTMLLabelElement; + private var input:HTMLInputElement; + private var span:HTMLSpanElement; + + /** + * @flexjsignorecoercion org.apache.flex.core.WrappedHTMLElement + * @flexjsignorecoercion HTMLLabelElement + * @flexjsignorecoercion HTMLInputElement + * @flexjsignorecoercion HTMLSpanElement + */ + override protected function createElement():WrappedHTMLElement + { + typeNames = "mdl-switch mdl-js-switch"; + + label = document.createElement("label") as HTMLLabelElement; + element = label as WrappedHTMLElement; + + input = document.createElement("input") as HTMLInputElement; + input.type = "checkbox"; + input.className = "mdl-switch__input"; + label.appendChild(input); + + span = document.createElement("span") as HTMLSpanElement; + span.className = "mdl-switch_label"; + + label.appendChild(span); + + positioner = element; + + (input as WrappedHTMLElement).flexjs_wrapper = this; + (span as WrappedHTMLElement).flexjs_wrapper = this; + element.flexjs_wrapper = this; + + return element; + } + + protected var _ripple:Boolean = false; + + /** + * A boolean flag to activate "mdl-js-ripple-effect" effect selector. + * Applies ripple click effect. May be used in combination with any other classes + * + * @langversion 3.0 + * @playerversion Flash 10.2 + * @playerversion AIR 2.6 + * @productversion FlexJS 0.0 + */ + public function get ripple():Boolean + { + return _ripple; + } + + public function set ripple(value:Boolean):void + { + _ripple = value; + + className += (_ripple ? " mdl-js-ripple-effect" : ""); + } + + public function get text():String + { + return span.textContent; + } + + public function set text(value:String):void + { + span.textContent = value; + } + + public function get selected():Boolean + { + return input.checked; + } + + public function set selected(value:Boolean):void + { + input.checked = value; + } + } +} \ No newline at end of file http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/0f2513c0/frameworks/projects/MaterialDesignLite/src/main/resources/mdl-manifest.xml ---------------------------------------------------------------------- diff --git a/frameworks/projects/MaterialDesignLite/src/main/resources/mdl-manifest.xml b/frameworks/projects/MaterialDesignLite/src/main/resources/mdl-manifest.xml index 5145571..6540110 100644 --- a/frameworks/projects/MaterialDesignLite/src/main/resources/mdl-manifest.xml +++ b/frameworks/projects/MaterialDesignLite/src/main/resources/mdl-manifest.xml @@ -25,10 +25,13 @@ <component id="TextInput" class="org.apache.flex.mdl.TextInput"/> <component id="CheckBox" class="org.apache.flex.mdl.CheckBox"/> <component id="RadioButton" class="org.apache.flex.mdl.RadioButton"/> + <component id="Switch" class="org.apache.flex.mdl.Switch"/> <component id="TextPrompt" class="org.apache.flex.mdl.beads.TextPrompt"/> <component id="Disabled" class="org.apache.flex.mdl.beads.Disabled"/> <component id="Slider" class="org.apache.flex.mdl.Slider"/> <component id="Badge" class="org.apache.flex.mdl.beads.Badge"/> + <component id="Menu" class="org.apache.flex.mdl.Menu"/> + <component id="MenuItem" class="org.apache.flex.mdl.MenuItem"/> <component id="Card" class="org.apache.flex.mdl.Card"/> <component id="CardInner" class="org.apache.flex.mdl.supportClasses.CardInner"/> <component id="CardTitle" class="org.apache.flex.mdl.CardTitle"/> @@ -37,7 +40,5 @@ <component id="CardActions" class="org.apache.flex.mdl.CardActions"/> <component id="CardMenu" class="org.apache.flex.mdl.CardMenu"/> <component id="Spacer" class="org.apache.flex.mdl.Spacer"/> - <component id="Menu" class="org.apache.flex.mdl.Menu"/> - <component id="MenuItem" class="org.apache.flex.mdl.MenuItem"/> </componentPackage>
