You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@flex.apache.org by ca...@apache.org on 2016/11/30 11:12:20 UTC
git commit: [flex-asjs] [refs/heads/develop] - Tabs working
Repository: flex-asjs
Updated Branches:
refs/heads/develop 8fbdd3783 -> 4329771d1
Tabs working
Project: http://git-wip-us.apache.org/repos/asf/flex-asjs/repo
Commit: http://git-wip-us.apache.org/repos/asf/flex-asjs/commit/4329771d
Tree: http://git-wip-us.apache.org/repos/asf/flex-asjs/tree/4329771d
Diff: http://git-wip-us.apache.org/repos/asf/flex-asjs/diff/4329771d
Branch: refs/heads/develop
Commit: 4329771d18795e7e48ce44776d46393dc78d3a8a
Parents: 8fbdd37
Author: Carlos Rovira <ca...@apache.org>
Authored: Wed Nov 30 12:12:12 2016 +0100
Committer: Carlos Rovira <ca...@apache.org>
Committed: Wed Nov 30 12:12:12 2016 +0100
----------------------------------------------------------------------
.../flexjs/MDLExample/src/main/flex/Tabs.mxml | 14 ++++----
.../src/main/flex/org/apache/flex/mdl/TabBar.as | 33 +++++++++++++++----
.../flex/org/apache/flex/mdl/TabBarButton.as | 31 ++++++++++++++++--
.../flex/org/apache/flex/mdl/TabBarPanel.as | 34 ++++++++++++++++----
4 files changed, 89 insertions(+), 23 deletions(-)
----------------------------------------------------------------------
http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/4329771d/examples/flexjs/MDLExample/src/main/flex/Tabs.mxml
----------------------------------------------------------------------
diff --git a/examples/flexjs/MDLExample/src/main/flex/Tabs.mxml b/examples/flexjs/MDLExample/src/main/flex/Tabs.mxml
index b9b3a40..03d66b8 100644
--- a/examples/flexjs/MDLExample/src/main/flex/Tabs.mxml
+++ b/examples/flexjs/MDLExample/src/main/flex/Tabs.mxml
@@ -24,28 +24,26 @@ limitations under the License.
<mdl:Grid className="demo-grid">
- <mdl:Tabs>
+ <mdl:Tabs width="400" ripple="true">
<mdl:TabBar ripple="true">
<mdl:TabBarButton text="Tab One" href="#tab1" isActive="true"/>
<mdl:TabBarButton text="Tab Two" href="#tab2"/>
<mdl:TabBarButton text="Tab Three" href="#tab3"/>
</mdl:TabBar>
- <mdl:TabBarPanel id="tab1">
- <mdl:Button fab="true" ripple="true">
- <i class="material-icons md-48">add</i>
- </mdl:Button>
+ <mdl:TabBarPanel id="tab1" isActive="true">
+ <js:Label text="Tab 1"/>
</mdl:TabBarPanel>
<mdl:TabBarPanel id="tab2">
- <mdl:Button fab="true" ripple="true">
- <i class="material-icons md-48">face</i>
- </mdl:Button>
+ <js:Label text="Tab 2"/>
</mdl:TabBarPanel>
<mdl:TabBarPanel id="tab3">
+ <js:Label text="Tab 3"/>
</mdl:TabBarPanel>
</mdl:Tabs>
+
</mdl:Grid>
</mdl:TabBarPanel>
\ No newline at end of file
http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/4329771d/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/TabBar.as
----------------------------------------------------------------------
diff --git a/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/TabBar.as b/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/TabBar.as
index c793a92..b8d7c9e 100644
--- a/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/TabBar.as
+++ b/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/TabBar.as
@@ -57,12 +57,9 @@ package org.apache.flex.mdl
COMPILE::JS
override protected function createElement():WrappedHTMLElement
{
- typeNames = "mdl-layout__tab-bar";
-
- element = document.createElement('div') as WrappedHTMLElement;
- element.className = typeNames;
-
- positioner = element;
+ element = document.createElement('div') as WrappedHTMLElement;
+
+ positioner = element;
// absolute positioned children need a non-null
// position value in the parent. It might
@@ -73,6 +70,30 @@ package org.apache.flex.mdl
return element;
}
+ /**
+ * If TabBar is used inside Tabs use a different config
+ *
+ * @langversion 3.0
+ * @playerversion Flash 10.2
+ * @playerversion AIR 2.6
+ * @productversion FlexJS 0.0
+ */
+ COMPILE::JS
+ override public function addedToParent():void
+ {
+ super.addedToParent();
+
+ if(parent is Tabs)
+ {
+ typeNames = "mdl-tabs__tab-bar";
+ } else {
+ typeNames = "mdl-layout__tab-bar";
+ }
+
+ element.className = typeNames;
+ className += (_ripple ? " mdl-js-ripple-effect" : "");
+ }
+
protected var _ripple:Boolean = false;
/**
* A boolean flag to activate "mdl-js-ripple-effect" effect selector.
http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/4329771d/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/TabBarButton.as
----------------------------------------------------------------------
diff --git a/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/TabBarButton.as b/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/TabBarButton.as
index 15a3e9f..590fa0b 100644
--- a/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/TabBarButton.as
+++ b/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/TabBarButton.as
@@ -82,8 +82,6 @@ package org.apache.flex.mdl
COMPILE::JS
override protected function createElement():WrappedHTMLElement
{
- typeNames = "mdl-layout__tab";
-
var a:HTMLElement = document.createElement('a') as HTMLElement;
a.setAttribute('href', href);
@@ -97,5 +95,34 @@ package org.apache.flex.mdl
return element;
}
+
+ /**
+ * If TabBarButton is used in a TabBar that is
+ * inside a Tabs component use a different config
+ *
+ * @langversion 3.0
+ * @playerversion Flash 10.2
+ * @playerversion AIR 2.6
+ * @productversion FlexJS 0.0
+ */
+ COMPILE::JS
+ override public function addedToParent():void
+ {
+ super.addedToParent();
+
+ if(parent is TabBar)
+ {
+ var parentTabBar:TabBar = parent as TabBar;
+ if(parentTabBar.parent is Tabs)
+ {
+ typeNames = "mdl-tabs__tab";
+ } else {
+ typeNames = "mdl-layout__tab";
+ }
+
+ element.className = typeNames;
+ className += (_isActive ? " is-active" : "");
+ }
+ }
}
}
http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/4329771d/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/TabBarPanel.as
----------------------------------------------------------------------
diff --git a/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/TabBarPanel.as b/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/TabBarPanel.as
index 5d43d9f..4574e03 100644
--- a/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/TabBarPanel.as
+++ b/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/TabBarPanel.as
@@ -60,12 +60,9 @@ package org.apache.flex.mdl
COMPILE::JS
override protected function createElement():WrappedHTMLElement
{
- typeNames = "mdl-layout__tab-panel";
-
- element = document.createElement('section') as WrappedHTMLElement;
- element.className = typeNames;
-
- positioner = element;
+ element = document.createElement('section') as WrappedHTMLElement;
+
+ positioner = element;
// absolute positioned children need a non-null
// position value in the parent. It might
@@ -76,8 +73,31 @@ package org.apache.flex.mdl
return element;
}
- private var _isActive:Boolean;
+ /**
+ * If TabBarPanel is used inside Tabs use a different config
+ *
+ * @langversion 3.0
+ * @playerversion Flash 10.2
+ * @playerversion AIR 2.6
+ * @productversion FlexJS 0.0
+ */
+ COMPILE::JS
+ override public function addedToParent():void
+ {
+ super.addedToParent();
+ if(parent is Tabs)
+ {
+ typeNames = "mdl-tabs__panel";
+ } else {
+ typeNames = "mdl-layout__tab-panel";
+ }
+
+ element.className = typeNames;
+ className += (_isActive ? " is-active" : "");
+ }
+
+ private var _isActive:Boolean;
/**
* Marks this Button as the active one in the TabBar
*