RidersListRendererAccessory UI
This commit is contained in:
@@ -120,7 +120,7 @@
|
||||
"age": 7,
|
||||
"lastLessonDate": 1704441600,
|
||||
"level": 0,
|
||||
"credit": 18,
|
||||
"credit": 0,
|
||||
"address": "9 impasse des Roses, 31000 Toulouse",
|
||||
"notes": "Très gentille, se sent à l'aise avec les équidés.",
|
||||
"ffeLicence": false,
|
||||
@@ -177,7 +177,7 @@
|
||||
"age": 5,
|
||||
"lastLessonDate": 1704182400,
|
||||
"level": 0,
|
||||
"credit": 25,
|
||||
"credit": -10,
|
||||
"address": "2 rue des Peupliers, 59000 Lille",
|
||||
"notes": "Très attachée au poney, sociable.",
|
||||
"ffeLicence": false,
|
||||
|
||||
+4
-4
@@ -25,10 +25,10 @@
|
||||
<icon path="assets/icons/icon.svg"/>
|
||||
|
||||
<assets path="assets">
|
||||
<font path="fonts/Montserrat/MontserratLight300.ttf" id="MontserratLight300" />
|
||||
<font path="fonts/Montserrat/MontserratRegular400.ttf" id="MontserratRegular400" />
|
||||
<font path="fonts/Montserrat/MontserratMedium500.ttf" id="MontserratMedium500" />
|
||||
<font path="fonts/Montserrat/MontserratBold700.ttf" id="MontserratBold700" />
|
||||
<font path="fonts/Montserrat/MontserratLight300.ttf" id="MontserratLight300" embed="true"/>
|
||||
<font path="fonts/Montserrat/MontserratRegular400.ttf" id="MontserratRegular400" embed="true"/>
|
||||
<font path="fonts/Montserrat/MontserratMedium500.ttf" id="MontserratMedium500" embed="true"/>
|
||||
<font path="fonts/Montserrat/MontserratBold700.ttf" id="MontserratBold700" embed="true"/>
|
||||
</assets>
|
||||
|
||||
<!-- copies data/Employees.xml to output -->
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
import openfl.system.Security;
|
||||
import business.Services;
|
||||
import com.adobe.cairngorm.control.CairngormEventDispatcher;
|
||||
import control.AppController;
|
||||
@@ -21,6 +22,10 @@ class LPTCManager2026 extends Application {
|
||||
|
||||
public function new() {
|
||||
super();
|
||||
|
||||
Security.allowDomain("*");
|
||||
Security.loadPolicyFile("https://lepetittrot.com/crossdomain.xml");
|
||||
|
||||
model = AppModelLocator.getInstance();
|
||||
services = new Services();
|
||||
appController = new AppController();
|
||||
|
||||
@@ -0,0 +1,67 @@
|
||||
package components;
|
||||
|
||||
import haxe.macro.Expr.Case;
|
||||
import feathers.text.TextFormat;
|
||||
import openfl.Assets;
|
||||
import openfl.text.Font;
|
||||
import feathers.controls.Label;
|
||||
import feathers.layout.HorizontalLayout;
|
||||
import openfl.display.Shape;
|
||||
import model.Constants;
|
||||
import feathers.skins.RectangleSkin;
|
||||
import feathers.controls.LayoutGroup;
|
||||
|
||||
class RidersListRendererAccessory extends LayoutGroup {
|
||||
private var elementSize:Int;
|
||||
private var riderCredit:Int;
|
||||
|
||||
public function new(pElementSize:Int = 14, pRiderCredit:Int = 0) {
|
||||
super();
|
||||
|
||||
elementSize = pElementSize;
|
||||
riderCredit = pRiderCredit;
|
||||
}
|
||||
|
||||
override private function initialize():Void {
|
||||
super.initialize();
|
||||
|
||||
var l:HorizontalLayout = new HorizontalLayout();
|
||||
// l.setPadding(Std.int(headerHeight * .1));
|
||||
l.verticalAlign = MIDDLE;
|
||||
l.gap = Std.int(elementSize * .3);
|
||||
layout = l;
|
||||
|
||||
backgroundSkin = new RectangleSkin(SolidColor(Constants.PURE_WHITE, 0));
|
||||
|
||||
// Title label
|
||||
var lbl1 = new Label();
|
||||
|
||||
// lbl1.layoutData = ld1;
|
||||
// lb1.backgroundSkin = new RectangleSkin(SolidColor(Constants.ACCENT_COLOR2, 1));
|
||||
// lb1.verticalAlign = VerticalAlign.TOP;
|
||||
|
||||
var iconColor:Int;
|
||||
var fnt:Font = Assets.getFont(Constants.MONTSERRAT_MEDIUM_500);
|
||||
|
||||
if (riderCredit <= 0) {
|
||||
iconColor = Constants.ALARM;
|
||||
} else if (riderCredit <= 2) {
|
||||
iconColor = Constants.ALERT;
|
||||
} else if (riderCredit <= 6) {
|
||||
iconColor = Constants.WARNING;
|
||||
} else {
|
||||
iconColor = Constants.INFO;
|
||||
}
|
||||
|
||||
lbl1.text = Constants.RIDERS_LIST_CREDIT_TEXT + Std.string(riderCredit);
|
||||
lbl1.embedFonts = true;
|
||||
lbl1.textFormat = new TextFormat(fnt.fontName, 14, Constants.MAIN_COLOR1);
|
||||
addChild(lbl1);
|
||||
|
||||
var s:Shape = new Shape();
|
||||
s.graphics.beginFill(iconColor, 1);
|
||||
s.graphics.drawCircle(10, 10, 10);
|
||||
s.graphics.endFill();
|
||||
addChild(s);
|
||||
}
|
||||
}
|
||||
@@ -1,53 +0,0 @@
|
||||
package components;
|
||||
|
||||
import feathers.text.TextFormat;
|
||||
import openfl.Assets;
|
||||
import openfl.text.Font;
|
||||
import feathers.controls.Label;
|
||||
import feathers.layout.HorizontalLayout;
|
||||
import openfl.display.Shape;
|
||||
import model.Constants;
|
||||
import feathers.skins.RectangleSkin;
|
||||
import feathers.controls.LayoutGroup;
|
||||
|
||||
class RidersListRendererDecoration extends LayoutGroup {
|
||||
public function new() {
|
||||
super();
|
||||
}
|
||||
|
||||
override private function initialize():Void {
|
||||
super.initialize();
|
||||
|
||||
var l:HorizontalLayout = new HorizontalLayout();
|
||||
//l.setPadding(Std.int(headerHeight * .1));
|
||||
l.verticalAlign = MIDDLE;
|
||||
l.setPadding(10);
|
||||
l.gap = 10;
|
||||
layout = l;
|
||||
|
||||
backgroundSkin = new RectangleSkin(SolidColor(Constants.MAIN_COLOR2, 1));
|
||||
|
||||
// Title label
|
||||
var lbl1 = new Label();
|
||||
|
||||
//lbl1.layoutData = ld1;
|
||||
//lb1.backgroundSkin = new RectangleSkin(SolidColor(Constants.ACCENT_COLOR2, 1));
|
||||
|
||||
//lb1.verticalAlign = VerticalAlign.TOP;
|
||||
|
||||
|
||||
var s:Shape = new Shape();
|
||||
s.graphics.beginFill(0x228B42, 1);
|
||||
s.graphics.drawCircle(10, 10, 10);
|
||||
s.graphics.endFill();
|
||||
addChild(s);
|
||||
|
||||
var fnt:Font = Assets.getFont(Constants.MONTSERRAT_MEDIUM_500);
|
||||
lbl1.text = "CREDIT : 09 ";
|
||||
lbl1.embedFonts = true;
|
||||
lbl1.textFormat = new TextFormat(fnt.fontName, 14, Constants.MAIN_COLOR1);
|
||||
addChild(lbl1);
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
@@ -1,5 +1,7 @@
|
||||
package components;
|
||||
|
||||
import openfl.system.ApplicationDomain;
|
||||
import openfl.system.LoaderContext;
|
||||
import openfl.display.LoaderInfo;
|
||||
import openfl.net.URLRequest;
|
||||
import openfl.display.Loader;
|
||||
@@ -30,11 +32,14 @@ class RoundAvatar extends LayoutGroup {
|
||||
override private function initialize():Void {
|
||||
super.initialize();
|
||||
|
||||
var hl:HorizontalLayout = new HorizontalLayout();
|
||||
/*var hl:HorizontalLayout = new HorizontalLayout();
|
||||
hl.horizontalAlign = LEFT;
|
||||
layout = hl;
|
||||
layout = hl;*/
|
||||
|
||||
//backgroundSkin = new RectangleSkin(SolidColor(0xFF0000, 1));
|
||||
var bkgs = new RectangleSkin(SolidColor(0xFFFFFF, 0));
|
||||
bkgs.width = Std.int(avatarSize * 1.2);
|
||||
bkgs.height = avatarSize;
|
||||
backgroundSkin = bkgs;
|
||||
|
||||
/*var al:AssetLoader = new AssetLoader();
|
||||
al.addEventListener(Event.COMPLETE, onLoadComplete);
|
||||
@@ -42,33 +47,27 @@ class RoundAvatar extends LayoutGroup {
|
||||
al.source = "https://ui-avatars.com/api/?background=random&size=128";
|
||||
addChild(al);*/
|
||||
|
||||
var bkg:Shape = new Shape();
|
||||
bkg.graphics.beginFill(Std.int(Math.random() * 0xFFFFFF), 1);
|
||||
bkg.graphics.drawCircle(avatarSize / 2, avatarSize / 2, avatarSize / 2);
|
||||
bkg.graphics.endFill();
|
||||
backgroundSkin = bkg;
|
||||
|
||||
var spacer:Shape = new Shape();
|
||||
spacer.graphics.beginFill(Std.int(0x933EA7), 1);
|
||||
spacer.graphics.drawRect(bkg.x + bkg.width, bkg.y, avatarSize / 2, bkg.height);
|
||||
spacer.graphics.endFill();
|
||||
addChild(spacer);
|
||||
var m:Shape = new Shape();
|
||||
m.graphics.beginFill(Std.int(Math.random() * 0xFFFFFF), 1);
|
||||
m.graphics.drawCircle(avatarSize / 2, avatarSize / 2, avatarSize / 2);
|
||||
m.graphics.endFill();
|
||||
addChild(m);
|
||||
mask = m;
|
||||
|
||||
var l:Loader = new Loader();
|
||||
var lc:LoaderContext = new LoaderContext(true, null);
|
||||
// l.load(new URLRequest("https://ui-avatars.com/api/?background=random&size=64"));
|
||||
l.load(new URLRequest("https://api.dicebear.com/9.x/pixel-art/png?size=32"));
|
||||
//l.load(new URLRequest("https://api.dicebear.com/9.x/pixel-art/png?size=32"));
|
||||
l.load(new URLRequest("https://lepetittrot.com/lptcm/assets/profile-pictures/pp256/pp_malo.jpeg"), lc);
|
||||
l.contentLoaderInfo.addEventListener (Event.COMPLETE, onLoadComplete);
|
||||
addChild(l);
|
||||
|
||||
}
|
||||
|
||||
private function onLoadComplete(e:Event) {
|
||||
|
||||
//var loader = cast(e.currentTarget, AssetLoader);
|
||||
//trace("asset loaded: " + loader.source);
|
||||
var l:Loader = cast(e.currentTarget, LoaderInfo).loader;
|
||||
l.content.width = l.content.height = avatarSize;
|
||||
if(!contains(l)) addChild(l);
|
||||
traceMagenta(l.width + " / " + l.height);
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
@@ -9,6 +9,12 @@ class Constants {
|
||||
public static final MAIN_COLOR1:Int = 0x323D42;
|
||||
public static final MAIN_COLOR2:Int = 0x69808A;
|
||||
public static final MAIN_COLOR3:Int = 0xECEFF0;
|
||||
public static final PURE_WHITE:Int = 0xFFFFFF;
|
||||
|
||||
public static final ALARM:Int = 0x5E2075;
|
||||
public static final ALERT:Int = 0xE65555;
|
||||
public static final WARNING:Int = 0xE3DF62;
|
||||
public static final INFO:Int = 0x6BE692;
|
||||
|
||||
public static final BUTTON_UP_COLOR:Int = 0x050EB7;
|
||||
public static final BUTTON_HOVER_COLOR:Int = 0xFF5F0F;
|
||||
@@ -33,6 +39,7 @@ class Constants {
|
||||
// Strings
|
||||
public static final MENU_ITEM_0_STRING:String = "Cavalier·e·s";
|
||||
public static final MENU_ITEM_1_STRING:String = "Licences FFE";
|
||||
public static final RIDERS_LIST_CREDIT_TEXT:String = "Crédit: ";
|
||||
|
||||
// UI
|
||||
// number of rows in RidersList
|
||||
|
||||
+17
-18
@@ -1,27 +1,24 @@
|
||||
package view;
|
||||
|
||||
import components.RidersListRendererAccessory;
|
||||
import components.RoundAvatar;
|
||||
import components.RidersListRendererDecoration;
|
||||
import openfl.display.Shape;
|
||||
import feathers.controls.ListView;
|
||||
import feathers.controls.dataRenderers.ItemRenderer;
|
||||
import feathers.data.ListViewItemState;
|
||||
import feathers.events.FeathersEvent;
|
||||
import feathers.text.TextFormat;
|
||||
import feathers.utils.DisplayObjectRecycler;
|
||||
import model.AppModelLocator;
|
||||
import model.Constants;
|
||||
import openfl.Assets;
|
||||
import openfl.text.Font;
|
||||
import feathers.text.TextFormat;
|
||||
import vo.RiderVO;
|
||||
import uuid.Uuid;
|
||||
import feathers.controls.AssetLoader;
|
||||
import feathers.data.ListViewItemState;
|
||||
import feathers.controls.dataRenderers.ItemRenderer;
|
||||
import feathers.utils.DisplayObjectRecycler;
|
||||
import feathers.layout.AutoSizeMode;
|
||||
import feathers.controls.ListView;
|
||||
import feathers.events.FeathersEvent;
|
||||
import model.AppModelLocator;
|
||||
import openfl.events.Event;
|
||||
import openfl.text.Font;
|
||||
import t9.util.ColorTraces.*;
|
||||
import vo.RiderVO;
|
||||
|
||||
class RidersList extends ListView {
|
||||
private var model = AppModelLocator.getInstance();
|
||||
private var rowHeight:Int;
|
||||
|
||||
public function new() {
|
||||
super();
|
||||
@@ -33,10 +30,12 @@ class RidersList extends ListView {
|
||||
|
||||
// set common properties for all renderers in the same container here
|
||||
var recycler = DisplayObjectRecycler.withFunction(() -> {
|
||||
|
||||
final fnt1:Font = Assets.getFont(Constants.MONTSERRAT_MEDIUM_500);
|
||||
final fnt2:Font = Assets.getFont(Constants.MONTSERRAT_BOLD_700);
|
||||
|
||||
var rowHeight:Int = Std.int(height / Constants.RIDERS_LIST_ROWS_COUNT);
|
||||
rowHeight = Std.int(height / Constants.RIDERS_LIST_ROWS_COUNT);
|
||||
|
||||
var itemRenderer = new ItemRenderer();
|
||||
itemRenderer.height = rowHeight;
|
||||
itemRenderer.icon = new RoundAvatar(Std.int(rowHeight * 0.9));
|
||||
@@ -44,6 +43,7 @@ class RidersList extends ListView {
|
||||
itemRenderer.secondaryTextFormat = new TextFormat(fnt2.fontName, Std.int(rowHeight * 0.2), Constants.MAIN_COLOR2);
|
||||
|
||||
return itemRenderer;
|
||||
|
||||
});
|
||||
|
||||
itemRendererRecycler = recycler;
|
||||
@@ -53,14 +53,13 @@ class RidersList extends ListView {
|
||||
itemRenderer.text = rider.firstName;
|
||||
itemRenderer.secondaryText = rider.name;
|
||||
|
||||
var ra:RoundAvatar = cast(itemRenderer.icon, RoundAvatar);
|
||||
var rlra:RidersListRendererAccessory = new RidersListRendererAccessory(Std.int(rowHeight * 0.8), rider.credit);
|
||||
itemRenderer.accessoryView = rlra;
|
||||
|
||||
// TODO change this to real iamge path
|
||||
// loader.source = "https://lepetittrot.com/path/to/pp_pictures" + state.data.id + ".jpg";
|
||||
// loader.source = "https://testingbot.com/free-online-tools/random-avatar/50?u=" + Uuid.nanoId();
|
||||
|
||||
var rlrd:RidersListRendererDecoration = new RidersListRendererDecoration();
|
||||
itemRenderer.accessoryView = rlrd;
|
||||
};
|
||||
|
||||
recycler.reset = (itemRenderer:ItemRenderer, state:ListViewItemState) -> {
|
||||
|
||||
Reference in New Issue
Block a user