MobileTrader now displays; still is not completely operational.

Project: http://git-wip-us.apache.org/repos/asf/flex-asjs/repo
Commit: http://git-wip-us.apache.org/repos/asf/flex-asjs/commit/5cb269d9
Tree: http://git-wip-us.apache.org/repos/asf/flex-asjs/tree/5cb269d9
Diff: http://git-wip-us.apache.org/repos/asf/flex-asjs/diff/5cb269d9

Branch: refs/heads/dual
Commit: 5cb269d973cfc5df1128dd35c6cad360b17bebc5
Parents: e3cbf4f
Author: Peter Ent <[email protected]>
Authored: Fri Apr 14 16:47:08 2017 -0400
Committer: Peter Ent <[email protected]>
Committed: Fri Apr 14 16:47:08 2017 -0400

----------------------------------------------------------------------
 .../src/main/flex/MyInitialView.mxml            | 131 ++++++++++++-------
 .../src/main/flex/views/AlertsView.mxml         |  23 ++--
 .../src/main/flex/views/AssetsView.mxml         |  21 ++-
 .../src/main/flex/views/WatchListView.mxml      |  24 ++--
 .../flex/mobile/beads/StackedViewManagerView.as |   3 +-
 .../flex/mobile/beads/TabbedViewManagerView.as  |   2 +-
 6 files changed, 124 insertions(+), 80 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/5cb269d9/examples/flexjs/MobileTrader/src/main/flex/MyInitialView.mxml
----------------------------------------------------------------------
diff --git a/examples/flexjs/MobileTrader/src/main/flex/MyInitialView.mxml 
b/examples/flexjs/MobileTrader/src/main/flex/MyInitialView.mxml
index 103b358..70aea67 100755
--- a/examples/flexjs/MobileTrader/src/main/flex/MyInitialView.mxml
+++ b/examples/flexjs/MobileTrader/src/main/flex/MyInitialView.mxml
@@ -30,38 +30,28 @@ limitations under the License.
                @namespace js  "library://ns.apache.org/flexjs/basic";
                @namespace views  "views.*";
                
-               js|Container {
-                       background-color: #FFFFFF;
-               }
-               
                js|StackedViewManager {
-                       padding-top: 0px;
-                       padding-bottom: 0px;
-                       padding-left: 0px;
-                       padding-right: 0px;
+                       background-color: #FFFFFF;
                }
                
                js|TabbedViewManager {
-                       position : absolute ;
-                       height : 100% ;
-                       width : 100% ;
-                       left : 0px ;
-                       top : 0px ;
-                       border: solid 1px #444444;
                        background-color: #FFFFFF;
                }
                
                .NavigationBar {
                        background-image: url("assets/background.png");
                        height: 55px;
+                       min-height: 55px;
+                       flex-grow: 0;
                        IBeadLayout: 
ClassReference("org.apache.flex.html.beads.layouts.HorizontalLayout");
                }
                
                .TabBar {
-                       background-color: #DEDEDE;
-                       height: 55px;
+                       height: 40px;
                        vertical-align: middle;
-                       line-height: 55px;
+                       line-height: 40px;
+                       min-height: 40px;
+                       flex-grow: 0;
                }
                
                .BackButton:hover {
@@ -76,53 +66,96 @@ limitations under the License.
                        background-image: url('assets/arrow_left_24.png');
                }
                
+               /* Assets
+               */
+               
+               views|AssetsView {
+                       padding: 10px;
+                       background-color: aliceblue;
+               }
+               
                .AssetsInner {
                        padding-top: 5px;
                        background-color: #FFFFFF;
                }
                
-               views|AssetsView {
-                       width: 100%;
-                       height: 100%;
+               .AssetsViewTitle {
+                       flex-grow: 0;
+                       height: 30px;
+                       min-height: 30px;
+               }
+               
+               .AssetsViewGrid {
+                       flex-grow: 0;
+                       min-height: 150px;
+                       border: solid 1px #333333;
+               }
+               
+               .AssetsViewGrid .midde .DataGridColumnList {
+                       border-right: solid 1px #333333;
+                       border-left: solid 1px #333333;
+               }
+               
+               .AssetsViewChart {
+                       flex-grow: 1;
                }
                
+               /* WatchList
+               */
+               
                views|WatchListView {
-                       width: 100%;
-                       height: 100%;
+                       padding: 10px;
+                       background-color: aliceblue;
                        
IBeadController:ClassReference('controller.WatchListController');
-                       background-color: #FFFFFF;
                }
                
-               .WatchListInner {
-                       height: 480px;
-                       width:  100%;
-                       background-color: #FFFFFF;
+               .WatchListInputArea {
+                       flex-grow: 0;
+                       height: 40px;
+                       min-height: 40px;
                }
                
                .WatchListDataGrid {
-                       height: 480px;
-                       width:  100%;
+                       flex-grow: 1;
+                       backgroundColor: #FFFFFF;
+                       border: solid 1px #333333;
                }
                
-               .WatchListInputArea {
-                       background-color: #FFFFFF;
-                       width: 480px;
-                       height: 25px;
-                       padding-top: 5px;
-                       padding-bottom: 2px;
+               .WatchListDataGrid .midde .DataGridColumnList {
+                       border-right: solid 1px #333333;
+                       border-left: solid 1px #333333;
                }
                
-               views|StockView {
-                       width: 100%;
-                       height: 100%;
-               }
+               /* Alerts
+               */
                
                views|AlertsView {
-                       width: 100%;
-                       height: 100%;
+                       padding: 10px;
+                       background-color: aliceblue;
                        
IBeadController:ClassReference('controller.AlertsViewController');
                }
                
+               .AlertsInput {
+                       flex-grow: 0;
+                       height: 40px;
+                       min-height: 40px;
+                       backgroundColor: aliceblue;
+               }
+               
+               .AlertsDataGrid {
+                       flex-grow: 1;
+                       backgroundColor: #FFFFFF;
+                       border: solid 1px #333333;
+               }
+               
+               .AlertsDataGrid .midde .DataGridColumnList {
+                       border-right: solid 1px #333333;
+                       border-left: solid 1px #333333;
+               }
+               
+               /* Supplements
+                */
+               
                .redCell {
                        color: #FF0000;
                }
@@ -208,17 +241,17 @@ limitations under the License.
                        private function 
watchListStackChanged(event:org.apache.flex.events.Event):void
                        {
                                trace("watchlist stack changed");
-                               var manager:StackedViewManager = 
event.currentTarget as StackedViewManager;
-                               
-                               var currentView:IViewManagerView = 
manager.selectedView;
-                               backButton.visible = manager.views.length > 1;
+//                             var manager:StackedViewManager = 
event.currentTarget as StackedViewManager;
+//                             
+//                             var currentView:IViewManagerView = 
manager.selectedView;
+//                             backButton.visible = manager.views.length > 1;
                        }
                        
                        private function 
goBack(event:org.apache.flex.events.MouseEvent):void
                        {
-                               if (navController.selectedIndex == 1) {
-                                       watchListStack.pop();
-                               }
+//                             if (navController.selectedIndex == 1) {
+//                                     watchListStack.pop();
+//                             }
                        }
                ]]>
        </fx:Script>
@@ -227,7 +260,7 @@ limitations under the License.
                <js:ViewDataBinding />
        </js:beads>
        
-       <js:TabbedViewManager id="navController" width="100%" height="100%" 
x="0" y="0" viewChanged="tabbedViewChanged(event)">
+       <js:TabbedViewManager id="navController" width="700" height="500" x="0" 
y="0" viewChanged="tabbedViewChanged(event)">
                <js:navigationBarItems>
                        <js:TextButton id="backButton" width="45" height="45" 
className="BackButton" visible="false" click="goBack(event)">
                                <js:beads>

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/5cb269d9/examples/flexjs/MobileTrader/src/main/flex/views/AlertsView.mxml
----------------------------------------------------------------------
diff --git a/examples/flexjs/MobileTrader/src/main/flex/views/AlertsView.mxml 
b/examples/flexjs/MobileTrader/src/main/flex/views/AlertsView.mxml
index f06dd65..71ddff6 100755
--- a/examples/flexjs/MobileTrader/src/main/flex/views/AlertsView.mxml
+++ b/examples/flexjs/MobileTrader/src/main/flex/views/AlertsView.mxml
@@ -21,7 +21,9 @@ limitations under the License.
                         title="Alerts"
                                       
xmlns:js="library://ns.apache.org/flexjs/basic"
                                       xmlns:local="*"
-                                      className="AlertsView" 
xmlns:renderers="renderers.*">
+                                          xmlns:controller="controller.*"
+                                      className="AlertsView" 
+                                          xmlns:renderers="renderers.*">
        
        <fx:Metadata>
                [Event("next")]
@@ -51,8 +53,12 @@ limitations under the License.
                        }
                ]]>
        </fx:Script>
+       
+       <js:beads>
+               <js:VerticalFlexLayout />
+       </js:beads>
                
-       <js:Container x="4" y="10" >
+       <js:Group x="4" y="10" width="100%" className="AlertsInput" >
                <js:beads>
                        <js:HorizontalLayout />
                </js:beads>
@@ -62,11 +68,12 @@ limitations under the License.
                <js:TextInput id="valueField" width="50" />
                <js:CheckBox text="Higher?" id="higherCheck" />
                <js:TextButton text="Set" click="onAlertSet()" />
-       </js:Container>
+       </js:Group>
        
-       <js:DataGrid id="dataGrid" x="0" y="40" width="100%" height="200">
+       <js:DataGrid id="dataGrid" x="0" y="40" width="100%" 
className="AlertsDataGrid">
                <js:beads>
-                       <js:DataProviderChangeNotifier sourceID="dataModel" 
propertyName="alerts" />
+                       <js:DataGridPercentageView />
+                       <!--<controller:DataModelChangeNotifier />-->
                        <js:SimpleBinding
                                eventName="alertsUpdate"
                                sourceID="dataModel"
@@ -74,21 +81,21 @@ limitations under the License.
                                destinationPropertyName="dataProvider" />
                </js:beads>
                <js:columns>
-                       <js:DataGridColumn label="Symbol" dataField="symbol">
+                       <js:DataGridColumn label="Symbol" dataField="symbol" 
columnWidth="50">
                                <js:itemRenderer>
                                        <fx:Component>
                                                <js:StringItemRenderer />
                                        </fx:Component>
                                </js:itemRenderer>
                        </js:DataGridColumn>
-                       <js:DataGridColumn label="Alert" 
dataField="greaterThan">
+                       <js:DataGridColumn label="Alert" 
dataField="greaterThan" columnWidth="25">
                                <js:itemRenderer>
                                        <fx:Component>
                                                <renderers:AlertRenderer />
                                        </fx:Component>
                                </js:itemRenderer>
                        </js:DataGridColumn>
-                       <js:DataGridColumn label="Message" dataField="message">
+                       <js:DataGridColumn label="Message" dataField="message" 
columnWidth="25">
                                <js:itemRenderer>
                                        <fx:Component>
                                                <js:StringItemRenderer />

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/5cb269d9/examples/flexjs/MobileTrader/src/main/flex/views/AssetsView.mxml
----------------------------------------------------------------------
diff --git a/examples/flexjs/MobileTrader/src/main/flex/views/AssetsView.mxml 
b/examples/flexjs/MobileTrader/src/main/flex/views/AssetsView.mxml
index 2929a3e..1d5bd2e 100755
--- a/examples/flexjs/MobileTrader/src/main/flex/views/AssetsView.mxml
+++ b/examples/flexjs/MobileTrader/src/main/flex/views/AssetsView.mxml
@@ -34,35 +34,34 @@ limitations under the License.
        </fx:Metadata>
        
        <js:beads>
-               <js:VerticalLayout />
+               <js:VerticalFlexLayout />
        </js:beads>
        
        <js:model>
                <models:AssetsModel />
        </js:model>
 
-       <js:Label text="Summary" height="10%" />
+       <js:Label text="Summary" className="AssetsViewTitle" />
        
-       <js:DataGrid height="150" width="100%">
-               <js:style>
-                       <js:SimpleCSSStyles top="0" left="0" right="0" />
-               </js:style>
+       <js:DataGrid height="150" width="100%" className="AssetsViewGrid">
                <js:beads>
+                       <js:DataGridPercentageView />
                        <js:ConstantBinding
                                sourceID="model"
                                sourcePropertyName="assetsData"
                                destinationPropertyName="dataProvider" />
                </js:beads>
                <js:columns>
-                       <js:DataGridColumn label="Type" dataField="label" />
-                       <js:DataGridColumn label="Value" dataField="value" />
-                       <js:DataGridColumn label="Change" dataField="netChange" 
/>
+                       <js:DataGridColumn label="Type" dataField="label" 
columnWidth="50" />
+                       <js:DataGridColumn label="Value" dataField="value" 
columnWidth="25" />
+                       <js:DataGridColumn label="Change" dataField="netChange" 
columnWidth="25" />
                </js:columns>
        </js:DataGrid>
                
-       <js:Label text="Performance History" height="10%" />
+       <js:Spacer height="10" />
+       <js:Label text="Performance History" className="AssetsViewTitle" />
                
-       <js:BarChart id="barChart" width="100%" height="40%">
+       <js:BarChart id="barChart" className="AssetsViewChart" >
                <js:beads>
                        <js:ConstantBinding
                                sourceID="model"

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/5cb269d9/examples/flexjs/MobileTrader/src/main/flex/views/WatchListView.mxml
----------------------------------------------------------------------
diff --git 
a/examples/flexjs/MobileTrader/src/main/flex/views/WatchListView.mxml 
b/examples/flexjs/MobileTrader/src/main/flex/views/WatchListView.mxml
index aa9da04..3b84f34 100755
--- a/examples/flexjs/MobileTrader/src/main/flex/views/WatchListView.mxml
+++ b/examples/flexjs/MobileTrader/src/main/flex/views/WatchListView.mxml
@@ -89,20 +89,24 @@ limitations under the License.
        </fx:Script>
        
        <js:beads>
-               <js:VerticalLayout />
+               <js:VerticalFlexLayout />
        </js:beads>
        
-       <js:HContainer className="WatchListInputArea" width="100%" height="10%">
+       <js:Group width="100%" className="WatchListInputArea" >
+               <js:beads>
+                       <js:HorizontalLayout />
+               </js:beads>
                <js:Label text="Symbol:" />
                <js:TextInput id="symbolName" />
                <js:TextButton text="Add" click="addSymbol()" />
-       </js:HContainer>
+       </js:Group>
        
        <js:Spacer height="10" />
                
-       <js:DataGrid id="dataGrid" width="100%" height="85%" 
change="selectRow()" className="WatchListDataGrid">
+       <js:DataGrid id="dataGrid" width="100%" change="selectRow()" 
className="WatchListDataGrid">
                <js:beads>
-                       <js:DataProviderChangeNotifier sourceID="dataModel" 
propertyName="watchList" />
+                       <!--<controller:DataModelChangeNotifier />-->
+                       <js:DataGridPercentageView />
                        <js:SimpleBinding
                                eventName="update"
                                sourceID="dataModel"
@@ -110,35 +114,35 @@ limitations under the License.
                                destinationPropertyName="dataProvider" />
                </js:beads>
                <js:columns>
-                       <js:DataGridColumn label="Symbol" dataField="symbol">
+                       <js:DataGridColumn label="Symbol" dataField="symbol" 
columnWidth="20">
                                <js:itemRenderer>
                                        <fx:Component>
                                                <js:StringItemRenderer />
                                        </fx:Component>
                                </js:itemRenderer>
                        </js:DataGridColumn>
-                       <js:DataGridColumn label="Open" dataField="open">
+                       <js:DataGridColumn label="Open" dataField="open" 
columnWidth="20">
                                <js:itemRenderer>
                                        <fx:Component>
                                                <renderers:StockRenderer />
                                        </fx:Component>
                                </js:itemRenderer>
                        </js:DataGridColumn>
-                       <js:DataGridColumn label="Last" dataField="last" >
+                       <js:DataGridColumn label="Last" dataField="last" 
columnWidth="20" >
                                <js:itemRenderer>
                                        <fx:Component>
                                                <renderers:StockRenderer />
                                        </fx:Component>
                                </js:itemRenderer>
                        </js:DataGridColumn>
-                       <js:DataGridColumn label="High" dataField="high" >
+                       <js:DataGridColumn label="High" dataField="high" 
columnWidth="20" >
                                <js:itemRenderer>
                                        <fx:Component>
                                                <renderers:StockRenderer />
                                        </fx:Component>
                                </js:itemRenderer>
                        </js:DataGridColumn>
-                       <js:DataGridColumn label="Low" dataField="low" >
+                       <js:DataGridColumn label="Low" dataField="low" 
columnWidth="20" >
                                <js:itemRenderer>
                                        <fx:Component>
                                                <renderers:StockRenderer />

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/5cb269d9/frameworks/projects/Mobile/src/main/flex/org/apache/flex/mobile/beads/StackedViewManagerView.as
----------------------------------------------------------------------
diff --git 
a/frameworks/projects/Mobile/src/main/flex/org/apache/flex/mobile/beads/StackedViewManagerView.as
 
b/frameworks/projects/Mobile/src/main/flex/org/apache/flex/mobile/beads/StackedViewManagerView.as
index a500c12..c2c8837 100644
--- 
a/frameworks/projects/Mobile/src/main/flex/org/apache/flex/mobile/beads/StackedViewManagerView.as
+++ 
b/frameworks/projects/Mobile/src/main/flex/org/apache/flex/mobile/beads/StackedViewManagerView.as
@@ -153,7 +153,8 @@ package org.apache.flex.mobile.beads
                        }
                        _topView = model.views[index] as IViewManagerView;
                        _topView.viewManager = _strand as IViewManager;
-                       UIBase(_strand).addElementAt(_topView,1);
+                       
+                       UIBase(_strand).addElementAt(_topView,(navigationBar == 
null ? 0 : 1));
                        
                        COMPILE::JS {
                                if (_topView) {

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/5cb269d9/frameworks/projects/Mobile/src/main/flex/org/apache/flex/mobile/beads/TabbedViewManagerView.as
----------------------------------------------------------------------
diff --git 
a/frameworks/projects/Mobile/src/main/flex/org/apache/flex/mobile/beads/TabbedViewManagerView.as
 
b/frameworks/projects/Mobile/src/main/flex/org/apache/flex/mobile/beads/TabbedViewManagerView.as
index 4ee3a5a..cd60094 100644
--- 
a/frameworks/projects/Mobile/src/main/flex/org/apache/flex/mobile/beads/TabbedViewManagerView.as
+++ 
b/frameworks/projects/Mobile/src/main/flex/org/apache/flex/mobile/beads/TabbedViewManagerView.as
@@ -120,7 +120,7 @@ package org.apache.flex.mobile.beads
                        }
                        _currentView = model.views[index] as IViewManagerView;
                        _currentView.viewManager = _strand as IViewManager;
-                       UIBase(_strand).addElementAt(_currentView,1);
+                       
UIBase(_strand).addElementAt(_currentView,(navigationBar == null ? 0 : 1));
                        
                        COMPILE::JS {
                                if (_currentView) {

Reply via email to