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

NekoIconButton reshaping in progress...

Browse Source 
TODO :
Is there a reason NekoIconButton heritates from Button Feathers component or not ?
This commit is contained in:
nekotoro
2025-11-20 16:02:35 +01:00
parent d27fe111b9
commit db50bec414
10 changed files with 142 additions and 28 deletions
Download Patch File Download Diff File Expand all files Collapse all files
assets/vector/certificate_icon_black.svg
+1
View File
@@ -0,0 +1 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg width="100%" height="100%" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;"><rect id="rectangle-with-no-fill---no-border" serif:id="rectangle with no fill &amp; no border" x="0" y="0" width="24" height="24" style="fill:none;"/><path id="certificate" d="M4,3c-1.11,0 -2,0.89 -2,2l0,10c0,1.097 0.903,2 2,2l8,0l0,5l3,-3l3,3l0,-5l2,0c1.097,0 2,-0.903 2,-2l0,-10c0,-1.097 -0.903,-2 -2,-2l-16,0m8,2l3,2l3,-2l0,3.5l3,1.5l-3,1.5l0,3.5l-3,-2l-3,2l0,-3.5l-3,-1.5l3,-1.5l0,-3.5m-8,0l5,0l0,2l-5,0l0,-2m0,4l3,0l0,2l-3,0l0,-2m0,4l5,0l0,2l-5,0l0,-2Z" style="fill-rule:nonzero;"/></svg>
Side by Side

After

Width:  |  Height:  |  Size: 934 B

assets/vector/menu_icon_black.svg
+1
View File
@@ -0,0 +1 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg width="100%" height="100%" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;"><rect id="rectangle-with-no-fill---no-border" serif:id="rectangle with no fill &amp; no border" x="0" y="0" width="24" height="24" style="fill:none;"/><path d="M3,6l18,0l0,2l-18,0l0,-2m0,5l18,0l0,2l-18,0l0,-2m0,5l18,0l0,2l-18,0l0,-2Z" style="fill-rule:nonzero;"/></svg>
Side by Side

After

Width:  |  Height:  |  Size: 709 B

assets/vector/rider_icon_black.svg
+1
View File
@@ -0,0 +1 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg width="100%" height="100%" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;"><rect id="rectangle-with-no-fill---no-border" serif:id="rectangle with no fill &amp; no border" x="0" y="0" width="24" height="24" style="fill:none;"/><path id="rider" d="M10,3.5c0,-0.83 0.67,-1.5 1.5,-1.5c0.83,0 1.5,0.67 1.5,1.5c0,0.83 -0.67,1.5 -1.5,1.5c-0.83,0 -1.5,-0.67 -1.5,-1.5m12,4.5l0,3.5l-1.03,0.35c-0.17,1.21 -1.21,2.15 -2.47,2.15l-0.08,0c-0.14,0.68 -0.47,1.29 -0.92,1.78l0,6.22l-2.5,0l0,-5l-0.25,0c-0.21,0 -0.42,-0.03 -0.62,-0.06l-4.44,-0.74l-1.12,2.01l0.75,3.79l-2.54,-0l-0.78,-3.75c-0.03,-0.3 0,-0.6 0.16,-0.86l1.02,-1.81c-0.98,-0.55 -1.65,-1.58 -1.68,-2.77c-0.04,0.15 -0.06,0.37 -0.03,0.69c0.03,0.44 0.14,1.09 0.07,1.81c-0.04,0.72 -0.37,1.46 -0.79,1.95c-0.43,0.49 -0.9,0.83 -1.4,1.09l-0.7,-0.7c0.19,-0.47 0.38,-0.89 0.42,-1.28c0.06,-0.37 -0.01,-0.67 -0.12,-0.94l-0.53,-1.13c-0.21,-0.51 -0.47,-1.25 -0.42,-2.12c0.03,-0.85 0.5,-1.96 1.39,-2.57c0.9,-0.61 1.87,-0.7 2.66,-0.53c0.5,0.1 1.01,0.34 1.45,0.68c0.37,-0.17 0.8,-0.26 1.25,-0.26l0.25,-0l0,-1.39c0,-1 0.68,-1.92 1.66,-2.08c1.26,-0.21 2.34,0.76 2.34,1.97l0,1.5l1.5,-0l0,-0.5c0,-2.21 1.79,-4 4,-4l3.5,-0l-0.89,1.34c0.54,0.36 0.89,0.97 0.89,1.66m-2,3.2l-1.04,-1.66c-0.13,-0.21 -0.46,-0.12 -0.46,0.13l0,3.33c0.83,-0 1.5,-0.67 1.5,-1.5l0,-0.3Z" style="fill-rule:nonzero;"/></svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.6 KiB

project.xml
+3 -1
View File
@@ -7,7 +7,7 @@
<window allow-high-dpi="true"/>
<window fps="60"/>
<window fps="0" if="html5"/>
<window background="#c8c1bd"
<window background="#7e746e"
width="500"
height="800"
orientation="portrait" />
@@ -19,6 +19,7 @@
<haxelib name="feathersui"/>
<haxelib name="feathersui-cairngorm"/>
<haxelib name="hx-color-trace"/>
<haxelib name="svg" />
<icon path="assets/icons/icon.svg"/>
@@ -32,5 +33,6 @@
<!-- copies data/Employees.xml to output -->
<assets path="assets/data" rename="data" embed="false"/>
<assets path="assets/bitmaps" rename="bitmaps" embed="true"/>
<assets path="assets/vector" rename="vector" embed="true"/>
</project>
src/LPTCManager2026.hx
-1
View File
@@ -56,7 +56,6 @@ class LPTCManager2026 extends Application {
addChild(mainPanel);
dr = new NekoDrawer();
//dr.addEventListener(NekoDrawerEvent.STATUS_CHANGE, onDrawerStatusChange);
addChild(dr);
model.addEventListener(NekoDrawerEvent.DRAWER_STATE_CHANGE, onDrawerStateChange);
src/components/NekoIconButton.hx
+72 -9
View File
@@ -1,20 +1,83 @@
package components;
import openfl.display.Bitmap;
import openfl.display.BitmapData;
import feathers.controls.Button;
import feathers.controls.Label;
import feathers.events.FeathersEvent;
import format.SVG;
import model.Constants;
import openfl.Assets;
import openfl.display.Shape;
import openfl.geom.ColorTransform;
import openfl.text.Font;
import openfl.text.TextFormat;
import t9.util.ColorTraces.*;
class NekoIconButton extends Button {
private var bmp:Bitmap;
public function new(pSkin:BitmapData, pX:Int = 0, pY:Int = 0, pWidth:Int = 100, pHeight:Int = 100) {
private var svgSkinPath:String;
private var w:Int;
private var h:Int;
private var normalStateColor:Int;
private var selectedStateColor:Int;
private var disabledStateColor:Int;
private var backgroundColor:Int;
private var t:String;
private var iconShape:Shape;
private var lb1:Label;
public function new(pSvgSkinPath:String,
pWidth:Int = 100,
pHeight:Int = 100,
pNormalStateColor:Int = 0x000000,
pSelectedStateColor:Int = 0xFF0000,
pDisabledStateColor:Int = 0xAAAAAA,
pBackgroundColor:Int = null,
pText:String = null) {
super();
bmp = new Bitmap(pSkin);
backgroundSkin = bmp;
bmp.width = pWidth;
bmp.height = pHeight;
bmp.smoothing = true;
svgSkinPath = pSvgSkinPath;
w = pWidth;
h = pHeight;
normalStateColor = pNormalStateColor;
selectedStateColor = pSelectedStateColor;
disabledStateColor = pDisabledStateColor;
backgroundColor = pBackgroundColor;
t = pText;
addEventListener(FeathersEvent.CREATION_COMPLETE, onCreationComplete);
if(pBackgroundColor == null){
backgroundSkin = new NekoRectangle(0xFF0000, 0, 0, pWidth, pHeight);
backgroundSkin.alpha = 0;
} else {
backgroundSkin = new NekoRectangle(pBackgroundColor, 0, 0, pWidth, pHeight);
}
iconShape = new Shape();
new SVG(pSvgSkinPath).render(iconShape.graphics);
iconShape.width = pWidth;
iconShape.height = pHeight;
var ct = new ColorTransform();
ct.color = pNormalStateColor;
iconShape.transform.colorTransform = ct;
addChild(iconShape);
if(pText != null){
lb1.text = Constants.MENU_ITEM_0_STRING;
lb1.embedFonts = true;
var fnt:Font = Assets.getFont(Constants.MONTSERRAT_LIGHT_300);
lb1.textFormat = new TextFormat(fnt.fontName, 20, Constants.BUTTON_NORMAL_STATE_COLOR);
addChild(lb1);
}
}
override private function initialize():Void {
}
private function onCreationComplete(event:FeathersEvent):Void {
traceBlue(this + " --> onCreationComplete()");
}
}
src/model/Constants.hx
+9
View File
@@ -10,6 +10,11 @@ class Constants {
public static final MAIN_COLOR2:Int = 0x69808A;
public static final MAIN_COLOR3:Int = 0xECEFF0;
public static final BUTTON_NORMAL_STATE_COLOR:Int = 0x050EB7;
public static final BUTTON_SELECTED_STATE_COLOR:Int = 0xFF5F0F;
public static final BUTTON_DISABLED_STATE_COLOR:Int = 0x69808A;
public static final BUTTON_INVERTED_NORMAL_STATE_COLOR:Int = 0xECEFF0;
// Fonts
public static final MONTSERRAT_LIGHT_300:String = "MontserratLight300";
public static final MONTSERRAT_REGULAR_400:String = "MontserratRegular400";
@@ -20,6 +25,10 @@ class Constants {
public static final MAIN_HEADER_WIDTH_RATIO:Float = 1;
public static final MAIN_HEADER_HEIGHT_RATIO:Float = 0.1;
// Strings
public static final MENU_ITEM_0_STRING:String = "Cavalier·e·s";
public static final MENU_ITEM_1_STRING:String = "Licences FFE";
private function new() {
}
src/view/MainFooter.hx
+41 -7
View File
@@ -1,5 +1,10 @@
package view;
import openfl.display.Stage;
import haxe.CallStack.StackItem;
import openfl.Assets;
import components.NekoIconButton;
import feathers.layout.HorizontalLayout;
import model.Constants;
import components.NekoRectangle;
import feathers.events.FeathersEvent;
@@ -8,6 +13,9 @@ import t9.util.ColorTraces.*;
class MainFooter extends LayoutGroup {
private var ridersButton:NekoIconButton;
private var ffeLicencesButton:NekoIconButton;
public function new() {
super();
@@ -21,13 +29,39 @@ class MainFooter extends LayoutGroup {
final footerWidth = Std.int(sw * Constants.MAIN_HEADER_WIDTH_RATIO);
final footerHeight = Std.int(sh * Constants.MAIN_HEADER_HEIGHT_RATIO);
autoSizeMode = CONTENT;
backgroundSkin = new NekoRectangle( Constants.MAIN_COLOR2,
0,
sh - footerHeight,
footerWidth,
footerHeight);
variant = LayoutGroup.VARIANT_TOOL_BAR;
backgroundSkin = new NekoRectangle(Constants.MAIN_COLOR3);
//variant = LayoutGroup.VARIANT_TOOL_BAR;
// Layout settings
var l:HorizontalLayout = new HorizontalLayout();
l.setPadding(footerWidth * .030);
l.gap = footerWidth * .4;
l.horizontalAlign = CENTER;
l.verticalAlign = MIDDLE;
layout = l;
// Drawer button
ridersButton = new NekoIconButton(Assets.getText("vector/rider_icon_black.svg"),
40,
40,
Constants.BUTTON_NORMAL_STATE_COLOR,
Constants.BUTTON_SELECTED_STATE_COLOR,
Constants.BUTTON_DISABLED_STATE_COLOR,
Constants.MENU_ITEM_0_STRING);
//ridersButton.addEventListener(TriggerEvent.TRIGGER, onRidersBtnPress);
addChild(ridersButton);
// Drawer button
ffeLicencesButton = new NekoIconButton(Assets.getText("vector/certificate_icon_black.svg"),
40,
40,
Constants.BUTTON_NORMAL_STATE_COLOR,
Constants.BUTTON_SELECTED_STATE_COLOR,
Constants.BUTTON_DISABLED_STATE_COLOR,
Constants.MENU_ITEM_1_STRING);
//ffeLicencesButton.addEventListener(TriggerEvent.TRIGGER, onFfeLicencesButtonPress);
addChild(ffeLicencesButton);
}
private function onCreationComplete(event:FeathersEvent):Void {
src/view/MainHeader.hx
+7 -3
View File
@@ -47,10 +47,14 @@ class MainHeader extends LayoutGroup {
var l:HorizontalLayout = new HorizontalLayout();
l.paddingLeft = l.paddingRight = Std.int(headerHeight * .3);
l.paddingTop = l.paddingBottom = Std.int(headerHeight * .2);
l.verticalAlign = MIDDLE;
layout = l;
// Drawer button
drawerBtn = new NekoIconButton(Assets.getBitmapData("bitmaps/menu_white.png"), 0, 0, Std.int(headerHeight * .5), Std.int(headerHeight * .5));
drawerBtn = new NekoIconButton(Assets.getText("vector/menu_icon_black.svg"),
Std.int(headerHeight * .5),
Std.int(headerHeight * .5),
Constants.BUTTON_INVERTED_NORMAL_STATE_COLOR);
drawerBtn.addEventListener(TriggerEvent.TRIGGER, onDBtnPress);
addChild(drawerBtn);
@@ -60,12 +64,12 @@ class MainHeader extends LayoutGroup {
//lb1.backgroundSkin = new NekoRectangle(Constants.ACCENT_COLOR2);
//lb1.verticalAlign = VerticalAlign.TOP;
lb1.text = "Cavalier·e·s";
lb1.text = Constants.MENU_ITEM_0_STRING;
lb1.embedFonts = true;
var fnt:Font = Assets.getFont(Constants.MONTSERRAT_MEDIUM_500);
lb1.textFormat = new TextFormat(fnt.fontName, Std.int(headerHeight * .4), Constants.MAIN_COLOR3);
//addChild(lb1);
addChild(lb1);
}
private function onCreationComplete(event:FeathersEvent):Void {
src/view/MainPanel.hx
+3 -3
View File
@@ -21,13 +21,13 @@ class MainPanel extends Panel {
super.initialize();
autoSizeMode = STAGE;
backgroundSkin = new NekoRectangle(Constants.MAIN_COLOR3);
backgroundSkin = new NekoRectangle(Constants.MAIN_COLOR2);
mh = new MainHeader();
addChild(mh);
header = mh;
mf = new MainFooter();
addChild(mf);
footer = mf;
}
private function onCreationComplete(event:FeathersEvent):Void {