mxhx fiddling

src/model/AppModelLocator.hx

@@ -1,5 +1,6 @@
 package model;
 
+import bindx.IBindable;
 import view.RidersList;
 import vo.RiderVO;
 import feathers.data.ArrayCollection;

src/model/Constants.hx

@@ -33,7 +33,6 @@ class Constants {
     public static final MONTSERRAT_REGULAR_400:String = "Montserrat Regular";
     public static final MONTSERRAT_MEDIUM_500:String = "Montserrat Medium";
     public static final MONTSERRAT_BOLD_700:String = "Montserrat Bold";
-    public static final HIGH_SPIRITED:String = "HighSpirited";
 
     // Fonts sizes
     public static final FONT_SIZE_10:Int = 10;

src/view/RiderCardDrawer.hx

@@ -1,5 +1,8 @@
 package view;
 
+import ui.LPTCTheme;
+import model.String.Strings;
+import feathers.text.TextFormat;
 import openfl.Assets;
 import feathers.controls.ScrollContainer;
 import feathers.controls.Drawer;
@@ -13,7 +16,7 @@ import t9.util.ColorTraces.*;
 class RiderCardDrawer extends Drawer {
 	public static final CLOSE:String = "close";
 	public static final OPEN:String = "open";
-
+	
 	private var appModel:AppModelLocator;
 
 	public function new() {
@@ -49,15 +52,15 @@ class RiderCardDrawer extends Drawer {
 		// profile picture
 		ppal.source = Constants.PROFIL_PICTURES_PATH_512 + appModel.selectedRider.uid + ".jpg";
 
-		firstNameLabel.text = AppModelLocator.getInstance().selectedRider.firstName;
+		/*firstNameLabel.text = AppModelLocator.getInstance().selectedRider.firstName;
 		nameLabel.text = AppModelLocator.getInstance().selectedRider.name;
-		
+		creditLabel.text = Strings.RCD_S1;*/
 
 		openDrawer();
 	}
 
 	// update remaining credit label and progress bar
-	/*private function updateCreditUIElments(pFromValue:Dynamic, pToValue:Dynamic) {
+	private function updateCreditUIElments(pFromValue:Dynamic, pToValue:Dynamic) {
 
 		creditLabel.text = Strings.RCD_S1 + Std.string(pToValue);
 
@@ -71,5 +74,5 @@ class RiderCardDrawer extends Drawer {
 			creditProgressBar.variant = LPTCTheme.H_PROGRESS_BAR_VARIANT_INFO;
 		}
 		creditProgressBar.value = pToValue;
-	}*/
+	}
 }

src/view/RiderCardDrawer.mxhx

@@ -3,6 +3,7 @@
           xmlns:f="https://ns.feathersui.com/mxhx" 
           xmlns:components="components.*">
 
+  <!-- ################################ MAIN SCROLLCONTAINER ################################ -->
   <f:ScrollContainer id="mainScrollContainer">
     <f:layout>
         <f:VerticalLayout horizontalAlign="JUSTIFY" 
@@ -11,24 +12,24 @@
                           paddingTop="{model.Constants.GLOBAL_PADDING}"
                           paddingRight="{model.Constants.GLOBAL_PADDING}"
                           paddingBottom="{model.Constants.GLOBAL_PADDING}"
+                          gap="{model.Constants.GLOBAL_PADDING}"
                           />
     </f:layout>
 
     <f:Button id="closeDrawerButton" text="Close drawer" click="{closeDrawer();}"/>
 
-    <components:VSpacer/>
+    <!-- ################################ PROFILE PICTURE ASSETLOADER ################################ -->
-
-    <!-- profile picture AssetLoader -->
     <f:AssetLoader id="ppal"/>
 
-    <components:VSpacer/>
+    <!-- <components:VSpacer/> -->
+
+    <!-- ################################ BASIC INFOS LAYOUTGROUP ################################ -->
+    <f:LayoutGroup id="basicInfosLayoutGroup">
 
-    <!-- basic infos LayoutGroup -->
-    <f:LayoutGroup id="lg1" height="80">
       <f:backgroundSkin>
             <f:RectangleSkin>
                 <f:fill>
-                    <f:FillStyle.SolidColor color="0xDDDDDD" alpha="1"/>
+                    <f:FillStyle.SolidColor color="0xdddddd" alpha="1"/>
                 </f:fill>
             </f:RectangleSkin>
         </f:backgroundSkin>
@@ -42,9 +43,10 @@
                  paddingTop="0"
                  paddingRight="0"
                  paddingBottom="0"
-                 embedFonts="true">
+                 embedFonts="true"
+                 text="{appModel.selectedRider.firstName}">
           <f:textFormat>
-              <f:TextFormat font="Montserrat Bold" size="{model.Constants.FONT_SIZE_26}" color="{model.Constants.MAIN_COLOR1}"/>
+              <f:TextFormat font="{model.Constants.MONTSERRAT_BOLD_700}" size="{model.Constants.FONT_SIZE_26}" color="{model.Constants.MAIN_COLOR1}"/>
           </f:textFormat>
         </f:Label>
 
@@ -55,10 +57,25 @@
                  paddingBottom="0"
                  embedFonts="true">
           <f:textFormat>
-              <f:TextFormat font="Montserrat Bold" size="{model.Constants.FONT_SIZE_26}" color="{model.Constants.MAIN_COLOR1}"/>
+              <f:TextFormat font="{model.Constants.MONTSERRAT_MEDIUM_500}" size="{model.Constants.FONT_SIZE_22}" color="{model.Constants.MAIN_COLOR2}"/>
           </f:textFormat>
         </f:Label>
-      
+
+        <f:Label id="creditLabel"
+                 text="{model.Strings.RCD_S1}" 
+                 paddingLeft="0" 
+                 paddingTop="0"
+                 paddingRight="0"
+                 paddingBottom="0"
+                 embedFonts="true">
+          <f:textFormat>
+              <f:TextFormat font="{model.Constants.MONTSERRAT_MEDIUM_500}" size="{model.Constants.FONT_SIZE_16}" color="{model.Constants.MAIN_COLOR2}"/>
+          </f:textFormat>
+
+        </f:Label>
+
+        <f:HProgressBar id="creditProgressBar" value="0" minimum="0" maximum="10.0"/>
+
     </f:LayoutGroup>
 
   </f:ScrollContainer>