nekotoro/LPTCManager2026
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

- added HProgressBar to RiderCardDrawer

Browse Source 
- added Spacer class insted of padding & gap
This commit is contained in:
nekotoro
2025-12-21 17:26:57 +01:00
parent 4ba0bae65b
commit ace49bf193
7 changed files with 215 additions and 52 deletions
Download Patch File Download Diff File Expand all files Collapse all files
project.xml
+1
View File
@@ -21,6 +21,7 @@
<haxelib name="hx-color-trace"/>
<haxelib name="svg" />
<haxelib name="haxe-strings" />
<haxelib name="fuzzaldrin" />
<icon path="assets/icons/app_icon_1024.svg"/>
src/components/RidersListRendererAccessory.hx
+3 -3
View File
@@ -41,11 +41,11 @@ class RidersListRendererAccessory extends LayoutGroup {
var iconColor:Int;
var fnt:Font = Assets.getFont(Constants.MONTSERRAT_MEDIUM_500);
if (riderCredit <= 0) {
if (riderCredit <= Constants.CREDIT_ULTRA_LOW_LIMIT) {
iconColor = Constants.ALARM;
} else if (riderCredit <= 2) {
} else if (riderCredit <= Constants.CREDIT_LOW_LIMIT) {
iconColor = Constants.ALERT;
} else if (riderCredit <= 6) {
} else if (riderCredit <= Constants.CREDIT_AVERAGE_LIMIT) {
iconColor = Constants.WARNING;
} else {
iconColor = Constants.INFO;
src/components/VSpacer.hx
+28
View File
@@ -0,0 +1,28 @@
package components;
import feathers.skins.RectangleSkin;
import feathers.controls.LayoutGroup;
import t9.util.ColorTraces.*;
class VSpacer extends LayoutGroup {
private var spacerHeight:Int;
private var spacerColor:Int;
private var spacerAlpha:Float;
public function new(pSpacerHeight:Int = 10, pSpacerColor:Int = 0xFFFFFF, pSpacerAlpha:Float = 0) {
super();
spacerHeight = pSpacerHeight;
spacerColor = pSpacerColor;
spacerAlpha = pSpacerAlpha;
}
override private function initialize():Void {
super.initialize();
var rs:RectangleSkin = new RectangleSkin(SolidColor(spacerColor, spacerAlpha));
rs.height = spacerHeight;
backgroundSkin = rs;
}
}
src/model/Constants.hx
+7
View File
@@ -57,6 +57,13 @@ class Constants {
public static final BUTTONS_ICON_SIZE:Int = 32;
public static final GLOBAL_CORNER_RADIUS:Int = 5;
public static final GLOBAL_BUTTON_ICON_OFFSET:Int = -10;
public static final GLOBAL_PADDING:Int = 10;
// Credit limits
public static final CREDIT_ULTRA_LOW_LIMIT:Int = 1;
public static final CREDIT_LOW_LIMIT:Int = 2;
public static final CREDIT_AVERAGE_LIMIT:Int = 6;
public static final CREDIT_UP_LIMIT:Int = 10;
}
src/ui/LPTCTheme.hx
+85 -2
View File
@@ -1,5 +1,6 @@
package ui;
import feathers.controls.HProgressBar;
import feathers.controls.TextInputState;
import feathers.controls.TextInput;
import openfl.Assets;
@@ -17,6 +18,11 @@ class LPTCTheme extends ClassVariantTheme {
public static final TEXT_INPUT_VARIANT_SEARCH:String = "textInputVariantSearch";
public static final H_PROGRESS_BAR_VARIANT_INFO:String = "HProgressBarVariantInfo";
public static final H_PROGRESS_BAR_VARIANT_WARNING:String = "HProgressBarVariantWarning";
public static final H_PROGRESS_BAR_VARIANT_ALERT:String = "HProgressBarVariantAlert";
public static final H_PROGRESS_BAR_VARIANT_ALARM:String = "HProgressBarVariantAlarm";
public function new() {
super();
@@ -24,11 +30,19 @@ class LPTCTheme extends ClassVariantTheme {
}
private function initialize():Void {
// Buttons
styleProvider.setStyleFunction(Button, null, setButtonStyles);
styleProvider.setStyleFunction(Button, LPTCTheme.BUTTON_VARIANT_WHITE, setWhiteButtonStyles);
styleProvider.setStyleFunction(Button, LPTCTheme.BUTTON_VARIANT_ORANGE, setOrangeButtonStyles);
styleProvider.setStyleFunction(TextInput, null, setSearchTextInputStyles);
// TextInput
styleProvider.setStyleFunction(TextInput, LPTCTheme.TEXT_INPUT_VARIANT_SEARCH, setSearchTextInputStyles);
//HProgressBar
styleProvider.setStyleFunction(HProgressBar, LPTCTheme.H_PROGRESS_BAR_VARIANT_INFO, setHProgressBarInfoStyles);
styleProvider.setStyleFunction(HProgressBar, LPTCTheme.H_PROGRESS_BAR_VARIANT_WARNING, setHProgressBarWarningStyles);
styleProvider.setStyleFunction(HProgressBar, LPTCTheme.H_PROGRESS_BAR_VARIANT_ALERT, setHProgressBarAlertStyles);
styleProvider.setStyleFunction(HProgressBar, LPTCTheme.H_PROGRESS_BAR_VARIANT_ALARM, setHProgressBarAlarmStyles);
}
//############################################################### BUTTONS
@@ -104,7 +118,7 @@ class LPTCTheme extends ClassVariantTheme {
button.iconOffsetX = Constants.GLOBAL_BUTTON_ICON_OFFSET;
}
//############################################################### TEXT_INPUTS
//############################################################### TEXT INPUT
private function setSearchTextInputStyles(pTextInput:TextInput):Void {
var backgroundSkin = new RectangleSkin();
@@ -140,4 +154,73 @@ class LPTCTheme extends ClassVariantTheme {
pTextInput.embedFonts = true;
}
//############################################################### PROGRESS BAR
private function setHProgressBarInfoStyles(pHProgrssBar:HProgressBar):Void {
var backgroundSkin = new RectangleSkin();
backgroundSkin.border = null;
backgroundSkin.fill = SolidColor(Constants.MAIN_COLOR1, .2);
backgroundSkin.height = 10;
backgroundSkin.cornerRadius = 4;
pHProgrssBar.backgroundSkin = backgroundSkin;
var fillSkin = new RectangleSkin();
fillSkin.border = null;
fillSkin.fill = SolidColor(Constants.INFO);
backgroundSkin.height = 10;
fillSkin.cornerRadius = 4;
pHProgrssBar.fillSkin = fillSkin;
}
private function setHProgressBarWarningStyles(pHProgrssBar:HProgressBar):Void {
var backgroundSkin = new RectangleSkin();
backgroundSkin.border = null;
backgroundSkin.fill = SolidColor(Constants.MAIN_COLOR1, .2);
backgroundSkin.height = 10;
backgroundSkin.cornerRadius = 4;
pHProgrssBar.backgroundSkin = backgroundSkin;
var fillSkin = new RectangleSkin();
fillSkin.border = null;
fillSkin.fill = SolidColor(Constants.WARNING);
backgroundSkin.height = 10;
fillSkin.cornerRadius = 4;
pHProgrssBar.fillSkin = fillSkin;
}
private function setHProgressBarAlertStyles(pHProgrssBar:HProgressBar):Void {
var backgroundSkin = new RectangleSkin();
backgroundSkin.border = null;
backgroundSkin.fill = SolidColor(Constants.MAIN_COLOR1, .2);
backgroundSkin.height = 10;
backgroundSkin.cornerRadius = 4;
pHProgrssBar.backgroundSkin = backgroundSkin;
var fillSkin = new RectangleSkin();
fillSkin.border = null;
fillSkin.fill = SolidColor(Constants.ALERT);
backgroundSkin.height = 10;
fillSkin.cornerRadius = 4;
pHProgrssBar.fillSkin = fillSkin;
}
private function setHProgressBarAlarmStyles(pHProgrssBar:HProgressBar):Void {
var backgroundSkin = new RectangleSkin();
backgroundSkin.border = null;
backgroundSkin.fill = SolidColor(Constants.MAIN_COLOR1, .2);
backgroundSkin.height = 10;
backgroundSkin.cornerRadius = 4;
pHProgrssBar.backgroundSkin = backgroundSkin;
var fillSkin = new RectangleSkin();
fillSkin.border = null;
fillSkin.fill = SolidColor(Constants.ALARM);
backgroundSkin.height = 10;
fillSkin.cornerRadius = 4;
pHProgrssBar.fillSkin = fillSkin;
}
}
src/view/RiderCardDrawer.hx
+87 -47
View File
@@ -1,16 +1,14 @@
package view;
import model.String.Strings;
import feathers.controls.ScrollContainer;
import ui.SVGIconFactory;
import feathers.controls.ButtonState;
import openfl.display.Bitmap;
import ui.LPTCTheme;
import feathers.controls.Label;
import components.VSpacer;
import feathers.controls.AssetLoader;
import feathers.controls.Button;
import feathers.controls.ButtonState;
import feathers.controls.Drawer;
import feathers.controls.HProgressBar;
import feathers.controls.Label;
import feathers.controls.LayoutGroup;
import feathers.controls.ScrollContainer;
import feathers.controls.TextInput;
import feathers.events.FeathersEvent;
import feathers.events.TriggerEvent;
@@ -18,10 +16,13 @@ import feathers.layout.VerticalLayout;
import feathers.skins.RectangleSkin;
import model.AppModelLocator;
import model.Constants;
import model.String.Strings;
import openfl.Assets;
import openfl.events.Event;
import openfl.text.TextFormat;
import t9.util.ColorTraces.*;
import ui.LPTCTheme;
import ui.SVGIconFactory;
import vo.RiderVO;
class RiderCardDrawer extends Drawer {
@@ -29,14 +30,14 @@ class RiderCardDrawer extends Drawer {
public static final OPEN:String = "open";
private var model:AppModelLocator;
private final spacing:Int = 10;
// components
private var ppal:AssetLoader;
private var closeDrawerButton:Button;
private var firstNameTextInput:TextInput;
private var nameTextInput:TextInput;
private var remainingCreditLabel:Label;
private var firstNameLabel:Label;
private var nameLabel:Label;
private var creditLabel:Label;
private var creditProgressBar:HProgressBar;
private var removeOneCredit:Button;
public function new() {
@@ -61,12 +62,15 @@ class RiderCardDrawer extends Drawer {
mainScrollContainer.autoSizeMode = STAGE;
var mainVerticalLayout = new VerticalLayout();
mainVerticalLayout.setPadding(spacing);
mainVerticalLayout.gap = spacing;
mainVerticalLayout.paddingLeft = mainVerticalLayout.paddingRight = Constants.GLOBAL_PADDING;
//mainVerticalLayout.gap = Constants.GLOBAL_PADDING;
mainVerticalLayout.horizontalAlign = JUSTIFY;
mainVerticalLayout.verticalAlign = TOP;
mainScrollContainer.layout = mainVerticalLayout;
// ##### SPACER
mainScrollContainer.addChild(new VSpacer(10));
// close button
closeDrawerButton = new Button();
closeDrawerButton.text = "Close Drawer";
@@ -75,52 +79,76 @@ class RiderCardDrawer extends Drawer {
});
mainScrollContainer.addChild(closeDrawerButton);
// ##### SPACER
mainScrollContainer.addChild(new VSpacer(10));
// profile picture
ppal = new AssetLoader();
ppal.addEventListener(Event.COMPLETE, onPPLoaded);
mainScrollContainer.addChild(ppal);
// ########################################################################## FIRSTNAME & NAME TEXT INPUTS
// ##### SPACER
mainScrollContainer.addChild(new VSpacer(10));
// ########################################################################## FIRSTNAME & NAME LABELS
// layout
var lg1:LayoutGroup = new LayoutGroup();
lg1.backgroundSkin = new RectangleSkin(SolidColor(Constants.MAIN_COLOR1, 0.1));
lg1.backgroundSkin = new RectangleSkin(SolidColor(Constants.MAIN_COLOR1, 0));
var vl1:VerticalLayout = new VerticalLayout();
vl1.setPadding(spacing);
vl1.gap = -spacing;
vl1.horizontalAlign = JUSTIFY;
lg1.layout = vl1;
mainScrollContainer.addChild(lg1);
// first name textInput
firstNameTextInput = new TextInput();
firstNameTextInput.backgroundSkin = null;
firstNameTextInput.embedFonts = true;
firstNameTextInput.textFormat = new TextFormat(Assets.getFont(Constants.MONTSERRAT_BOLD_700).fontName, Constants.FONT_SIZE_26, Constants.MAIN_COLOR1);
lg1.addChild(firstNameTextInput);
// first name Label
firstNameLabel = new Label();
firstNameLabel.setPadding(0);
firstNameLabel.backgroundSkin = null;
firstNameLabel.embedFonts = true;
firstNameLabel.textFormat = new TextFormat(Assets.getFont(Constants.MONTSERRAT_BOLD_700).fontName, Constants.FONT_SIZE_26, Constants.MAIN_COLOR1);
lg1.addChild(firstNameLabel);
// name textInput
nameTextInput = new TextInput();
nameTextInput.backgroundSkin = null;
nameTextInput.embedFonts = true;
nameTextInput.textFormat = new TextFormat(Assets.getFont(Constants.MONTSERRAT_MEDIUM_500).fontName, Constants.FONT_SIZE_22, Constants.MAIN_COLOR2);
lg1.addChild(nameTextInput);
// name Label
nameLabel = new Label();
nameLabel.setPadding(0);
nameLabel.backgroundSkin = null;
nameLabel.embedFonts = true;
nameLabel.textFormat = new TextFormat(Assets.getFont(Constants.MONTSERRAT_MEDIUM_500).fontName, Constants.FONT_SIZE_22, Constants.MAIN_COLOR2);
lg1.addChild(nameLabel);
// ##### SPACER
mainScrollContainer.addChild(new VSpacer(10));
// ########################################################################## Remaining credit label
remainingCreditLabel = new Label();
remainingCreditLabel.embedFonts = true;
remainingCreditLabel.textFormat = new TextFormat(Assets.getFont(Constants.MONTSERRAT_BOLD_700).fontName, Constants.FONT_SIZE_16, Constants.MAIN_COLOR1);
mainScrollContainer.addChild(remainingCreditLabel);
creditLabel = new Label();
creditLabel.embedFonts = true;
creditLabel.textFormat = new TextFormat(Assets.getFont(Constants.MONTSERRAT_BOLD_700).fontName, Constants.FONT_SIZE_16, Constants.MAIN_COLOR1);
mainScrollContainer.addChild(creditLabel);
// ##### SPACER
mainScrollContainer.addChild(new VSpacer(10));
// ########################################################################## credit progress bar
creditProgressBar = new HProgressBar(0, 0, 10);
mainScrollContainer.addChild(creditProgressBar);
// ##### SPACER
mainScrollContainer.addChild(new VSpacer(10));
// ########################################################################## Remove 1 credit button
removeOneCredit = new Button();
removeOneCredit.icon = SVGIconFactory.makeIcon("vector/ticket_icon_black.svg", Constants.BUTTONS_ICON_SIZE, Constants.MAIN_COLOR3);
removeOneCredit.setIconForState(ButtonState.DOWN, SVGIconFactory.makeIcon("vector/ticket_icon_black.svg", Constants.BUTTONS_ICON_SIZE, Constants.HERO_COLOR));
removeOneCredit.setIconForState(ButtonState.DOWN,
SVGIconFactory.makeIcon("vector/ticket_icon_black.svg", Constants.BUTTONS_ICON_SIZE, Constants.HERO_COLOR));
removeOneCredit.text = Strings.RCD_S2;
removeOneCredit.addEventListener(TriggerEvent.TRIGGER, (e) -> {
traceRed("removeOneCredit()");
});
mainScrollContainer.addChild(removeOneCredit);
// ##### SPACER
mainScrollContainer.addChild(new VSpacer(10));
//mainScrollContainer.addChild(new VSpacer(2, Constants.MAIN_COLOR2, 1));
drawer = mainScrollContainer;
}
@@ -130,33 +158,45 @@ class RiderCardDrawer extends Drawer {
public function populateAndShow() {
var rvo:RiderVO = model.selectedRider;
// profile picture
ppal.source = "https://lepetittrot.com/lptcm/assets/profile-pictures/pp512/pp_test_512.jpg";
ppal.source = Constants.PROFIL_PICTURES_PATH_512 + rvo.uid + ".jpg";
// first name text input
firstNameTextInput.text = rvo.firstName;
if (!firstNameTextInput.hasEventListener(Event.CHANGE)) {
firstNameTextInput.addEventListener(Event.CHANGE, (e) -> {
if (firstNameTextInput.text != model.selectedRider.firstName) {
model.updateSelectedRiderProp(RiderVO.FIRST_NAME, firstNameTextInput.text);
firstNameLabel.text = rvo.firstName;
if (!firstNameLabel.hasEventListener(Event.CHANGE)) {
firstNameLabel.addEventListener(Event.CHANGE, (e) -> {
if (firstNameLabel.text != model.selectedRider.firstName) {
model.updateSelectedRiderProp(RiderVO.FIRST_NAME, firstNameLabel.text);
}
});
}
// name text input
nameTextInput.text = rvo.name;
if (!nameTextInput.hasEventListener(Event.CHANGE)) {
nameTextInput.addEventListener(Event.CHANGE, (e) -> {
if (nameTextInput.text != model.selectedRider.name) {
model.updateSelectedRiderProp(RiderVO.NAME, nameTextInput.text);
nameLabel.text = rvo.name;
if (!nameLabel.hasEventListener(Event.CHANGE)) {
nameLabel.addEventListener(Event.CHANGE, (e) -> {
if (nameLabel.text != model.selectedRider.name) {
model.updateSelectedRiderProp(RiderVO.NAME, nameLabel.text);
}
});
}
// remaing credit text
remainingCreditLabel.text = Strings.RCD_S1 + Std.string(rvo.credit);
creditLabel.text = Strings.RCD_S1 + Std.string(rvo.credit);
// remaining credit progress bar
if (rvo.credit <= Constants.CREDIT_ULTRA_LOW_LIMIT) {
creditProgressBar.variant = LPTCTheme.H_PROGRESS_BAR_VARIANT_ALARM;
} else if (rvo.credit <= Constants.CREDIT_LOW_LIMIT) {
creditProgressBar.variant = LPTCTheme.H_PROGRESS_BAR_VARIANT_ALERT;
} else if (rvo.credit <= Constants.CREDIT_AVERAGE_LIMIT) {
creditProgressBar.variant = LPTCTheme.H_PROGRESS_BAR_VARIANT_WARNING;
} else {
creditProgressBar.variant = LPTCTheme.H_PROGRESS_BAR_VARIANT_INFO;
}
creditProgressBar.value = rvo.credit;
openDrawer();
}
src/view/RidersList.hx
+4
View File
@@ -1,5 +1,6 @@
package view;
import fuzzaldrin.Fuzzaldrin;
import com.adobe.cairngorm.control.CairngormEventDispatcher;
import components.RidersListRendererAccessory;
import components.RoundAvatar;
@@ -89,6 +90,9 @@ class RidersList extends ListView {
return item.firstName;
};*/
traceGreen(this + " --> onRideListDpChange()");
//var results = Fuzzaldrin.filter(cast(model.ridersListDP, Array<Dynamic>), 'Test', { key: RiderVO.FIRST_NAME });
//traceRed("fuzzy search : " + results);
}
function onRiderSelect(e:ListViewEvent):Void {