Permalink
Browse files

Implemented MainView style.

  • Loading branch information...
1 parent ed3db7b commit 6aef6e65f0c0de1fd8dfb2e8a44638726a873f3c @GhaziTriki GhaziTriki committed Dec 9, 2016
@@ -1,5 +1,7 @@
@namespace s "library://ns.adobe.com/flex/spark";
@namespace main "org.bigbluebutton.air.main.views.*";
+@namespace mainviews "org.bigbluebutton.lib.main.views.*";
+@namespace skins "org.bigbluebutton.lib.main.views.skins.*";
@media (application-dpi: 320) {
main|LoadingScreen {
@@ -10,6 +12,23 @@
height : 80;
}
+ main|MainView {
+ menuHeight : 160;
+ toolbarHeight : 80;
+ }
+
+ mainviews|MenuButtonsBase {
+ bottom : 35;
+ top : 14;
+ gap : 45;
+ }
+
+ skins|MenuButtonSkin {
+ fontSize : 24;
+ iconSize : 36;
+ labelPadding : 12;
+ }
+
.titleLabel
{
fontSize : 34;
@@ -32,12 +51,6 @@
right : 30;
}
- .menuButton
- {
- fontSize : 14;
- iconSize : 30;
- }
-
.participantIcon
{
width : 32;
@@ -6,6 +6,8 @@ package org.bigbluebutton.air.main.views {
import org.bigbluebutton.lib.presentation.views.PresentationViewBase;
import org.osmf.layout.HorizontalAlign;
+ [Style(name = "menuHeight", inherit = "no", type = "Number")]
+ [Style(name = "toolbarHeight", inherit = "no", type = "Number")]
public class MainView extends NoTabView {
private var _topToolbar:TopToolbarAIR;
@@ -23,7 +25,6 @@ package org.bigbluebutton.air.main.views {
_topToolbar = new TopToolbarAIR();
_topToolbar.percentWidth = 100;
- _topToolbar.height = getStyle("height");
addElement(_topToolbar);
_presentationView = new PresentationViewBase();
@@ -40,6 +41,9 @@ package org.bigbluebutton.air.main.views {
_presentationView.width = w;
_presentationView.height = h - _topToolbar.height - _menuButtons.height;
+
+ _menuButtons.height = getStyle("menuHeight");
+ _topToolbar.height = getStyle("toolbarHeight");
}
}
}
@@ -1,12 +1,12 @@
package org.bigbluebutton.lib.main.views {
- import org.bigbluebutton.lib.main.views.skins.MenuButtonSkin;
-
import spark.components.Button;
- import spark.components.Group;
- import spark.layouts.HorizontalLayout;
+ import spark.components.HGroup;
- public class MenuButtonsBase extends Group {
+ [Style(name = "bottom", inherit = "no", type = "Number")]
+ [Style(name = "gap", inherit = "no", type = "Number")]
+ [Style(name = "top", inherit = "no", type = "Number")]
+ public class MenuButtonsBase extends HGroup {
private var _micButton:Button;
public function get micButton():Button {
@@ -28,9 +28,6 @@ package org.bigbluebutton.lib.main.views {
public function MenuButtonsBase() {
super();
- var l:HorizontalLayout = new HorizontalLayout();
- l.gap = 10;
- layout = l;
_micButton = new Button();
_micButton.percentWidth = 100;
@@ -53,5 +50,13 @@ package org.bigbluebutton.lib.main.views {
_statusButton.styleName = "handStatusButton menuButton";
addElement(_statusButton);
}
+
+ override protected function updateDisplayList(w:Number, h:Number):void {
+ super.updateDisplayList(w, h);
+
+ bottom = getStyle("bottom");
+ gap = getStyle("gap");
+ top = getStyle("top");
+ }
}
}
@@ -4,6 +4,7 @@
<!-- host component -->
<fx:Metadata>
[HostComponent("spark.components.Button")]
+ [Style(name="labelPadding", inherit="no", type="Number")]
</fx:Metadata>
<fx:Script>
@@ -18,7 +19,7 @@
}
]]>
</fx:Script>
-
+
<!-- states -->
<s:states>
<s:State name="disabled" />
@@ -28,7 +29,7 @@
</s:states>
<s:Ellipse id="backgroundEllipse"
- height="{getStyle('iconSize') * 3/2}"
+ height="{getStyle('iconSize') * 2}"
width="{backgroundEllipse.height}"
x="{(this.width - backgroundEllipse.width)/2}"
y="{(this.height - backgroundEllipse.height)/2}">
@@ -37,17 +38,17 @@
color.down="{hostComponent.getStyle('selectedBackgroundColor')}" />
</s:fill>
</s:Ellipse>
- <s:Label id="icon"
- fontSize="{getStyle('iconSize')}"
- fontFamily="{getStyle('iconFont')}"
- color="{getStyle('iconColor')}"
- horizontalCenter="0"
- verticalCenter="0" />
+ <s:Label id="icon"
+ fontSize="{getStyle('iconSize')}"
+ fontFamily="{getStyle('iconFont')}"
+ color="{getStyle('iconColor')}"
+ horizontalCenter="0"
+ verticalCenter="0" />
<s:Label id="iconLabel"
text="{hostComponent.label}"
x="{(this.width - iconLabel.width)/2}"
- y="{backgroundEllipse.y + backgroundEllipse.height * 9/8}"
- fontSize="{getStyle('fontSize')}"/>
+ y="{backgroundEllipse.y + backgroundEllipse.height + getStyle('labelPadding')}"
+ fontSize="{getStyle('fontSize')}" />
</s:Skin>

0 comments on commit 6aef6e6

Please sign in to comment.