Add basic Chip component to MDL
Project: http://git-wip-us.apache.org/repos/asf/flex-asjs/repo Commit: http://git-wip-us.apache.org/repos/asf/flex-asjs/commit/62150cf4 Tree: http://git-wip-us.apache.org/repos/asf/flex-asjs/tree/62150cf4 Diff: http://git-wip-us.apache.org/repos/asf/flex-asjs/diff/62150cf4 Branch: refs/heads/develop Commit: 62150cf44a55f0c1a96cf2197658f435266c4098 Parents: 8d3065f Author: piotrz <[email protected]> Authored: Sun Nov 27 23:58:39 2016 +0100 Committer: piotrz <[email protected]> Committed: Sun Nov 27 23:58:39 2016 +0100 ---------------------------------------------------------------------- .../flexjs/MDLExample/src/main/flex/Chips.mxml | 27 +++++ .../src/main/flex/MainNavigation.mxml | 3 + .../src/main/flex/org/apache/flex/mdl/Chip.as | 101 +++++++++++++++++++ .../src/main/resources/mdl-manifest.xml | 1 + 4 files changed, 132 insertions(+) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/62150cf4/examples/flexjs/MDLExample/src/main/flex/Chips.mxml ---------------------------------------------------------------------- diff --git a/examples/flexjs/MDLExample/src/main/flex/Chips.mxml b/examples/flexjs/MDLExample/src/main/flex/Chips.mxml new file mode 100644 index 0000000..8d8c16a --- /dev/null +++ b/examples/flexjs/MDLExample/src/main/flex/Chips.mxml @@ -0,0 +1,27 @@ +<?xml version="1.0"?> +<!-- + +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. + +--> +<mdl:TabBarPanel xmlns:fx="http://ns.adobe.com/mxml/2009"; + xmlns:mdl="library://ns.apache.org/flexjs/mdl"> + <mdl:Grid> + <mdl:GridCell column="1"> + <mdl:Chip text="Basic Chip" /> + </mdl:GridCell> + </mdl:Grid> +</mdl:TabBarPanel> http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/62150cf4/examples/flexjs/MDLExample/src/main/flex/MainNavigation.mxml ---------------------------------------------------------------------- diff --git a/examples/flexjs/MDLExample/src/main/flex/MainNavigation.mxml b/examples/flexjs/MDLExample/src/main/flex/MainNavigation.mxml index fcbbddd..0a647d7 100644 --- a/examples/flexjs/MDLExample/src/main/flex/MainNavigation.mxml +++ b/examples/flexjs/MDLExample/src/main/flex/MainNavigation.mxml @@ -36,6 +36,7 @@ limitations under the License. </mdl:HeaderRow> <mdl:TabBar ripple="true"> <mdl:TabBarButton text="Cards" href="#cards_panel" isActive="true"/> + <mdl:TabBarButton text="Chips" href="#chips_panel"/> <mdl:TabBarButton text="Grids" href="#grids_panel"/> <mdl:TabBarButton text="Buttons" href="#buttons_panel" /> <mdl:TabBarButton text="TextFields" href="#textfield_panel"/> @@ -59,6 +60,8 @@ limitations under the License. <local:Cards id="cards_panel" isActive="true"/> + <local:Chips id="chips_panel" /> + <local:Grids id="grids_panel"/> <local:Buttons id="buttons_panel"/> http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/62150cf4/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/Chip.as ---------------------------------------------------------------------- diff --git a/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/Chip.as b/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/Chip.as new file mode 100644 index 0000000..f0fd85c --- /dev/null +++ b/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/Chip.as @@ -0,0 +1,101 @@ +//////////////////////////////////////////////////////////////////////////////// +// +// 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.TextButton; + } + + COMPILE::JS + { + import org.apache.flex.core.WrappedHTMLElement; + import org.apache.flex.core.UIBase; + } + + /** + * The Chip class provides a MDL UI-like appearance for + * a Chip. + * + * @langversion 3.0 + * @playerversion Flash 10.2 + * @playerversion AIR 2.6 + * @productversion FlexJS 0.0 + */ + COMPILE::SWF + public class Chip extends TextButton + { + public function Chip() + { + super(); + } + } + + COMPILE::JS + public class Chip extends UIBase + { + public function Chip() + { + super(); + + className = ""; + } + + private var chip:HTMLSpanElement; + private var chipTextSpan:HTMLSpanElement; + private var textNode:Text; + + /** + * @flexjsignorecoercion org.apache.flex.core.WrappedHTMLElement + * @flexjsignorecoercion HTMLSpanElement + * @flexjsignorecoercion HTMLButtonElement + * @flexjsignorecoercion Text + */ + override protected function createElement():WrappedHTMLElement + { + typeNames = "mdl-chip"; + + chipTextSpan = document.createElement("span") as HTMLSpanElement; + chipTextSpan.className = "mdl-chip__text"; + + textNode = document.createTextNode('') as Text; + chipTextSpan.appendChild(textNode); + + chip = document.createElement("span") as HTMLSpanElement; + chip.appendChild(chipTextSpan); + + element = chip as WrappedHTMLElement; + + positioner = element; + element.flexjs_wrapper = this; + + return element; + } + + public function get text():String + { + return textNode.nodeValue; + } + + public function set text(value:String):void + { + textNode.nodeValue = value; + } + } +} http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/62150cf4/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 be37dc1..44d4a75 100644 --- a/frameworks/projects/MaterialDesignLite/src/main/resources/mdl-manifest.xml +++ b/frameworks/projects/MaterialDesignLite/src/main/resources/mdl-manifest.xml @@ -57,5 +57,6 @@ <component id="TabBarPanel" class="org.apache.flex.mdl.TabBarPanel"/> <component id="Grid" class="org.apache.flex.mdl.Grid"/> <component id="GridCell" class="org.apache.flex.mdl.GridCell"/> + <component id="Chip" class="org.apache.flex.mdl.Chip"/> </componentPackage>
