haxeui / haxeui-flixel Goto Github PK

When switching states very rapidly, eventually, the ui won't show up.

Steps to reproduce: click the button on the screen as fast as you can, after a few clicks the ui will not show up when the states is switched back. The ui state has a red background and the other state has a green background.

Tested on Windows target.

HaxeuiDebug.zip

Please feel free to rename that. I suck at naming bugs.

This is in my repos as 02-textflownull - the version attached to this post is just commit b671345 zipped up.

Here is the same attachment: 02-textflownull.zip

I've done a decent writeup in the readme, so I'm just going to dump that here.

Edit: Special attention should be given to FAQSubstate, line 45. If you comment out this line, the error no longer occurs. Here it is linked in my repos at the specific commit. Link.

For some odd reason, text reflow in haxeui-flixel just breaks in flash. So this
is an attempt at a minimal case for that.

Open the substate and close it. It should fail for sure in Flash if I did my job right.

Late insert: And HTML5, and Neko.

Yes, this is just copy+paste my current setup, with much of the cruft cut away. The classpaths were left in place.

haxelib versions from git...

flixel, 984124c4
haxeui-core, f601c051
haxeui-flixel, 6cc3b3f4

Tested targets

air      - SDK not installed
android  - SDK not installed
electron - haxelib not installed
flash    - crashes (this bug)
html5    - crashes (this bug)
hashlink - build fails (probably different error)
neko     - crashes (this bug)
windows  - MSVC not installed

haxelib list...

dox: [1.1.0]
flixel-addons: 2.7.1 2.7.3 [2.7.5]
flixel-demos: 2.6.1 2.7.0 [2.7.1]
flixel-templates: 2.5.3 2.5.4 2.5.5 [2.6.2]
flixel-tools: 1.4.2 1.4.3 [1.4.4]
flixel-ui: 2.3.1 [2.3.2]
flixel: 4.5.1 4.6.0 [git]
flxscrollablearea: [0.4.0]
formatter: 1.5.1 [1.6.0]
haxeui-core: [git] old
haxeui-flixel: 0.0.0 [git]
haxeui-openfl: [0.0.2]
hscript: [2.3.0]
hxColorToolkit: [1.6.1]
hxcpp-debug-server: [dev:c:\Users\Dorian Greyson\.vscode\extensions\vshaxe.hxcpp-debugger-1.2.4\hxcpp-debug-server]
hxcpp: 4.0.4 [4.0.8]
lime-samples: [7.0.0]
lime: 7.2.0 7.2.1 7.3.0 [7.5.0]
openfl: 8.7.0 8.8.0 [8.9.1]
thx.color: [0.19.1]
thx.core: [0.43.0]
yaml: 1.3.0 [fix-your-lib] git

Expected Behavior

When the pos property of a <slider> within a <sidebar> is set via code, both the background blue graphic and the selection cursor on the slider should move (or expand/shrink in the background's case) to match the new value.

Current Behavior

The background of the slider changes to show the new value, but the selection cursor on the slider resets position to 0.

Steps to Reproduce (for bugs)

1. Create a <slider> within a <sidebar> and add it to the state
2. Set the onChange function of the slider to update a variable containing, for example, volume for music
3. Set the pos property of the slider once the sidebar has been shown via .show()

Media

Test app / minimal test case

PlayState.hx:

package;

import flixel.FlxG;
import flixel.FlxState;
import haxe.ui.Toolkit;
import haxe.ui.containers.SideBar;

class PlayState extends FlxState
{
	var gameVolume = 0.5;
	var mainView:MainView;

	override public function create()
	{
		super.create();
		Toolkit.init();
		Toolkit.autoScale = false;
		mainView = new MainView();
		mainView.setPosition(0, 0);
		add(mainView);

		mainView.mySlider.onChange = (_) ->
		{
			gameVolume = mainView.mySlider.value / 100;
		}
	}

	override public function update(elapsed:Float)
	{
		super.update(elapsed);
		if (FlxG.keys.anyJustPressed([SPACE]))
		{
			if (mainView.hidden)
			{
				mainView.show();
				mainView.mySlider.pos = gameVolume * 100;
			}
			else
				mainView.hide();
		}
	}
}

@:build(haxe.ui.macros.ComponentMacros.build("assets/ui/sliderTest.xml"))
class MainView extends SideBar
{
	override public function new()
	{
		super();
		// mySlider.pos = 30;
	}
}

sliderTest.xml:

<?xml version="1.0" encoding="UTF-8"?>
<sidebar width="200px" height="100%">

    <vbox width="100%" height="100%">
        <slider id="mySlider" width="100px" step="10" majorTicks="20" minorTicks="10" />
    </vbox>

</sidebar>

Context

Trying to keep my game's music volume in a variable and set the slider to the right position when the sidebar menu is hidden and shown.

Your Environment

• HaxeFlixel 4.11.0
• Lime 7.9.0
• OpenFL 9.1.0
• haxeui-core [git]
• haxeui-flixel [git]
• Windows 10 21H2
• HashLink 1.11, Windows MSVC, HTML5

Again, one I've written up the text for so I'll just paste it here.

In my repo: 04-buttonsborked
Specific commit: 41e19b9
Zipped version attached to this issue: 04-buttonsborked.zip

I've noticed that buttons don't have a right edge anymore, and some buttons go
kinda wonky when you hover over them. This project exists to collect those and
any other button-based issues I find in one place.

The top two buttons have no right edge and go completely square if you hover
them.

The bottom two buttons go wonky if you hover them.

There may be others; this however is probably a solid start.

haxelib versions...

flixel, git 4d23ed84
haxeui-core, haxelib 1.0.7
haxeui-flixel, git 110fd2ac

Test targets

air      - not tested
android  - not tested
electron - not tested
flash    - not tested
html5    - Has this bug.
hashlink - not tested
neko     - not tested
windows  - not tested

Screenshots:

Right edge missing -

Bottom edge missing -

Onhover issues -

Onclick issues -

Again this has a readme writeup that's not too terrible that I've included after the break.

In my repo: 03-cantstopwontstop
Specific commit: 8a59958
Zipped version attached to this issue: 03-cantstopwontstop.zip

Substates pause their parent classes by default. Haxeui doesn't listen to when
its parent class is paused due to a substate being opened.

This is built to demonstrate that. You can click add all day, even with the
substate open, and the counter will continue to increment.

haxelib versions from git...

flixel, 984124c4
haxeui-core, f601c051
haxeui-flixel, 6cc3b3f4

Tested targets

air      - SDK not installed
android  - SDK not installed
electron - haxelib not installed
flash    - has this bug.
html5    - has this bug.
hashlink - build fails (probably different error)
neko     - has this bug
windows  - MSVC not installed

haxelib list...

dox: [1.1.0]
flixel-addons: 2.7.1 2.7.3 [2.7.5]
flixel-demos: 2.6.1 2.7.0 [2.7.1]
flixel-templates: 2.5.3 2.5.4 2.5.5 [2.6.2]
flixel-tools: 1.4.2 1.4.3 [1.4.4]
flixel-ui: 2.3.1 [2.3.2]
flixel: 4.5.1 4.6.0 [git]
flxscrollablearea: [0.4.0]
formatter: 1.5.1 [1.6.0]
haxeui-core: [git] old
haxeui-flixel: 0.0.0 [git]
haxeui-openfl: [0.0.2]
hscript: [2.3.0]
hxColorToolkit: [1.6.1]
hxcpp-debug-server: [dev:c:\Users\Dorian Greyson\.vscode\extensions\vshaxe.hxcpp-debugger-1.2.4\hxcpp-debug-server]
hxcpp: 4.0.4 [4.0.8]
lime-samples: [7.0.0]
lime: 7.2.0 7.2.1 7.3.0 [7.5.0]
openfl: 8.7.0 8.8.0 [8.9.1]
thx.color: [0.19.1]
thx.core: [0.43.0]
yaml: 1.3.0 [fix-your-lib] git

Update: 1 July 2019

Some potentially useful insight was dumped into the chat.

Typically when discussing pausing a state in flixel, we expect something like setting state.active = false. As it turns out, this isn't how substates are handled.

The logic is here:
https://github.com/HaxeFlixel/flixel/blob/master/flixel/FlxState.hx#L169

And the actual opening of the substate is here:
https://github.com/HaxeFlixel/flixel/blob/master/flixel/FlxState.hx#L76

As I wrote in the chat:

Anyway, what it does do is if you check the logic, only the substate really seems to get updated while it's open, while the parent just kinda sits there doing a lot of nothing. It's written so that it checks to see if there's a substate and then... if substate - update substate... if not substate, update self. Well, something like that, anyway. I'm not quite awake yet, and a maintainer could give much better than I could just glancing at it.

This was followed up with some examination.

The conditional worth interest for "do we want parent doing things right now?" seems to be:

if (persistentUpdate || subState == null)

for the state itself. You can find this on line 171 in FlxState, as part of its logic for handling update checking around substates.

https://github.com/HaxeFlixel/flixel/blob/master/flixel/FlxState.hx#L171

Specific implementation from that note I don't know. But it appears that properly setting substates to null when they're closed is going on, and that would mean that check is the one we're interested in here.

I'm using:
flixel - 5.2.2
haxeui-flixel and haxeui-core - 1.5.0

This is what happens when I expand this after 2nd update() call

This is what happens when I expand this before 2nd update() call

Specifically for a Label.

I've tried quite the number of things:

• Setting font-family in a css file for the XML I'm loading

• Setting a style with path to the font face, relative, trying several different times

• Reaching into the label's dirty underside and setting the computed style's font to the path to the font

The font is on my asset path; it's actually the TTF for Hack. I know it's embedding properly; other parts of the project waiting for me to migrate their UI library are using it.

Little help, please?

Haxelib state in case any of them matter.

C:\windows\system32>haxelib list
flixel-addons: 2.7.1 [2.7.3]
flixel-demos: 2.6.1 [2.7.0]
flixel-templates: 2.5.3 [2.5.4]
flixel-tools: 1.4.2 [1.4.3]
flixel-ui: 2.3.1 [2.3.2]
flixel: 4.5.1 [4.6.0]
flxscrollablearea: [0.4.0]
haxeui-core: [0.0.3] 0.0.4
haxeui-flixel: [0.0.0]
haxeui-openfl: [0.0.2]
hscript: [2.3.0]
hxcpp-debug-server: [dev:c:\Users\Dorian Greyson\.vscode\extensions\vshaxe.hxcpp-debugger-1.2.0\hxcpp-debug-server]
hxcpp: 4.0.4 [4.0.8]
lime-samples: [7.0.0]
lime: 7.2.0 [7.2.1]
openfl: 8.7.0 [8.8.0]
yaml: [1.3.0]

ArgumentError: Error #2015: Invalid BitmapData.
        at flash.display::BitmapData/get width()
        at flixel.util::FlxDestroyUtil$/disposeIfNotEqual()[C:\HaxeToolkit\haxe\lib\flixel\git\flixel\util\FlxDestroyUtil.hx:96]
        at flixel.graphics.frames::FlxFrame/paint()[C:\HaxeToolkit\haxe\lib\flixel\git\flixel\graphics\frames\FlxFrame.hx:299]
        at flixel::FlxSprite/updateFramePixels()[C:\HaxeToolkit\haxe\lib\flixel\git\flixel\FlxSprite.hx:937]
        at flixel::FlxSprite/calcFrame()[C:\HaxeToolkit\haxe\lib\flixel\git\flixel\FlxSprite.hx:913]
        at flixel::FlxSprite/draw()[C:\HaxeToolkit\haxe\lib\flixel\git\flixel\FlxSprite.hx:650]
        at flixel.group::FlxTypedGroup/draw()[C:\HaxeToolkit\haxe\lib\flixel\git\flixel\group\FlxGroup.hx:185]
        at flixel.group::FlxTypedSpriteGroup/draw()[C:\HaxeToolkit\haxe\lib\flixel\git\flixel\group\FlxSpriteGroup.hx:213]
        at haxe.ui.backend::ComponentBase/draw()[C:\HaxeToolkit\haxe\lib\haxeui-flixel\git\haxe\ui\backend\ComponentBase.hx:368]
        at flixel.group::FlxTypedGroup/draw()[C:\HaxeToolkit\haxe\lib\flixel\git\flixel\group\FlxGroup.hx:185]
        at flixel.group::FlxTypedSpriteGroup/draw()[C:\HaxeToolkit\haxe\lib\flixel\git\flixel\group\FlxSpriteGroup.hx:213]
        at haxe.ui.backend::ComponentBase/draw()[C:\HaxeToolkit\haxe\lib\haxeui-flixel\git\haxe\ui\backend\ComponentBase.hx:368]
        at flixel.group::FlxTypedGroup/draw()[C:\HaxeToolkit\haxe\lib\flixel\git\flixel\group\FlxGroup.hx:185]
        at flixel.group::FlxTypedSpriteGroup/draw()[C:\HaxeToolkit\haxe\lib\flixel\git\flixel\group\FlxSpriteGroup.hx:213]
        at haxe.ui.backend::ComponentBase/draw()[C:\HaxeToolkit\haxe\lib\haxeui-flixel\git\haxe\ui\backend\ComponentBase.hx:368]
        at flixel.group::FlxTypedGroup/draw()[C:\HaxeToolkit\haxe\lib\flixel\git\flixel\group\FlxGroup.hx:185]
        at flixel.group::FlxTypedSpriteGroup/draw()[C:\HaxeToolkit\haxe\lib\flixel\git\flixel\group\FlxSpriteGroup.hx:213]
        at haxe.ui.backend::ComponentBase/draw()[C:\HaxeToolkit\haxe\lib\haxeui-flixel\git\haxe\ui\backend\ComponentBase.hx:368]
        at flixel.group::FlxTypedGroup/draw()[C:\HaxeToolkit\haxe\lib\flixel\git\flixel\group\FlxGroup.hx:185]
        at flixel.group::FlxTypedSpriteGroup/draw()[C:\HaxeToolkit\haxe\lib\flixel\git\flixel\group\FlxSpriteGroup.hx:213]
        at haxe.ui.backend::ComponentBase/draw()[C:\HaxeToolkit\haxe\lib\haxeui-flixel\git\haxe\ui\backend\ComponentBase.hx:368]
        at flixel.group::FlxTypedGroup/draw()[C:\HaxeToolkit\haxe\lib\flixel\git\flixel\group\FlxGroup.hx:185]
        at flixel.group::FlxTypedGroup/draw()[C:\HaxeToolkit\haxe\lib\flixel\git\flixel\group\FlxGroup.hx:185]
        at flixel::FlxState/draw()[C:\HaxeToolkit\haxe\lib\flixel\git\flixel\FlxState.hx:70]
        at flixel::FlxGame/draw()[C:\HaxeToolkit\haxe\lib\flixel\git\flixel\FlxGame.hx:859]
        at flixel::FlxGame/onEnterFrame()[C:\HaxeToolkit\haxe\lib\flixel\git\flixel\FlxGame.hx:551]

Created a simple project to demonstrate this. Target flash to trigger.

eli-2.zip

Creating a new TextField object will cause a crash. Input text isn't well-handled by flixel yet.

The draw order will be wonky in some edge cases due to flixel's children and core's children not being intentionally separated within the members array.

Expected Behavior

When the .text property of a <menu> item on a <menubar>, the text on the item should update in-game.

Current Behavior

Text does not update, instead keeping the value provided from XML. Child <menuitem> elements of a <menu> can be updated via code as expected.

Possible Solution

Steps to Reproduce (for bugs)

1. Create an XML layout that contains a <menubar> element with at least one child <menu> element
2. Create a container class from the XML using build macros
3. Update the .text property of a <menu> element via code

Media

Test app / minimal test case

• Include haxeui-core and haxeui-flixel in Project.xml
• PlayState.hx:

package;

import flixel.FlxState;
import haxe.ui.Toolkit;
import haxe.ui.containers.VBox;
import haxe.ui.containers.menus.Menu;
import haxe.ui.containers.menus.MenuBar;

class PlayState extends FlxState
{
	var myMenu:MyMenuBar;

	override public function create()
	{
		super.create();
		Toolkit.init();
		Toolkit.autoScale = false;
		myMenu = new MyMenuBar();
		add(myMenu);
	}

	override public function update(elapsed:Float)
	{
		super.update(elapsed);
	}
}

@:build(haxe.ui.macros.ComponentMacros.build("assets/ui/menuView.xml"))
class MyMenuBar extends VBox
{
	public function new()
	{
		super();
		fileMenu.text = "My text";
		fileItem1.text = "Replaced text 1";
		fileItem2.text = "Replaced text 2";
		fileItem3.text = "Replaced text 3";
	}
}

• menuView.xml:

<vbox width="100%">
    <menubar id="menuBar" width="100%">
        <menu id="fileMenu" text="placeholder 1">
            <menuitem id="fileItem1" text="test 1" />
            <menuitem id="fileItem2" text="test 2" />
            <menuitem id="fileItem3" text="test 3" />
        </menu>
        <menu id="editMenu" text="placeholder 2">
            <menuitem id="editItem1" text="test 1" />
            <menuitem id="editItem2" text="test 2" />
            <menuitem id="editItem3" text="test 3" />
        </menu>
    </menubar>
</vbox>

Context

I am attempting to replace the text with translated text for the user's chosen language.

Your Environment

• haxeui-core: git
• haxeui-flixel: git
• HaxeFlixel 4.10.0
• Lime 7.9.0
• Tested targets
  • HTML5
  • Linux
• Pop!_OS 21.10

Having a basic XML layout with a number-stepper, then trying to remove that component using removeComponent within the views constructor causes a Null access exception.

Expected Behavior

For any other component, they will just be removed, so I would expect the NumberStepper to do the same.

Current Behavior

Error callstack:

Called from haxe.ui.backend.ComponentImpl.createTextInput.0 (haxe/ui/backend/ComponentImpl.hx line 941)
Called from haxe.ui.backend.$TimerImpl.constructor.0 (haxe/ui/backend/TimerImpl.hx line 17)
Called from flixel.util.FlxTimer.onLoopFinished (flixel/util/FlxTimer.hx line 195)
Called from flixel.util.FlxTimerManager.update (flixel/util/FlxTimer.hx line 285)
Called from flixel.FlxGame.update (flixel/FlxGame.hx line 745)
Called from flixel.FlxGame.step (flixel/FlxGame.hx line 677)
Called from flixel.FlxGame.onEnterFrame (flixel/FlxGame.hx line 545)
Called from openfl.text.TextField.~this_onMouseDown.0 (lime/app/Module.hx line 0)
Called from openfl.events.EventDispatcher.__dispatchEvent (openfl/events/EventDispatcher.hx line 402)
Called from openfl.display.DisplayObject.__dispatch (openfl/display/DisplayObject.hx line 1399)
Called from openfl.display.Stage.__broadcastEvent (openfl/display/Stage.hx line 1159)
Called from openfl.display.Stage.__broadcastEvent (openfl/display/Stage.hx line 1157)
Null access .tf
Uncaught exception: Null access .tf
Called from haxe.$NativeStackTrace.callStack(C:\HaxeToolkit\haxe\std/hl/_std/haxe/NativeStackTrace.hx:25)
Called from haxe.$NativeStackTrace.callStack(C:\HaxeToolkit\haxe\std/hl/_std/haxe/NativeStackTrace.hx:24)
Called from haxe.CallStack.$CallStack_Impl.callStack(C:\HaxeToolkit\haxe\std/haxe/CallStack.hx:52)
Called from haxe.CallStack.$CallStack_Impl.exceptionStack(C:\HaxeToolkit\haxe\std/haxe/CallStack.hx:65)
Called from openfl.display.Stage.__handleError(openfl/display/Stage.hx:1416)
Called from openfl.display.Stage.__broadcastEvent(openfl/display/Stage.hx:1163)
Called from openfl.display.Stage.__onLimeRender(openfl/display/Stage.hx:1950)
Called from lime.app._Event_lime_graphics_RenderContext_Void.dispatch(lime/_internal/macros/EventMacro.hx:91)
Called from lime._internal.backend.native.NativeApplication.handleRenderEvent(lime/_internal/backend/native/NativeApplic
ation.hx:371)
Called from lime._internal.backend.native.NativeApplication.exec(lime/_internal/backend/native/NativeApplication.hx:146)
Called from lime.app.Application.exec(lime/app/Application.hx:150)
Called from $ApplicationMain.create(ApplicationMain.hx:130)
Called from $ApplicationMain.main(ApplicationMain.hx:25)
Called from .init(?:1)

Possible Solution

In haxeui-flixel/haxe/ui/backend/ComponentImpl.hx Line #941, there is a call to Toolkit.callLater. Inside the callback is _textInput.tf.visible = true;. It seems that the component is deleted by the time this delayed call is fired, so either _textInput or _textInput.tf is null. If I change the callback to check for null then it works correct i.e.

if(_textInput != null && _textInput.tf != null) {
     _textInput.tf.visible = true;
 }

But I wonder if there are other places where the same issue could happen. I also wonder if cancelling the callLater before it fires is a better solution?

Test app / minimal test case

PlayState.hx

package;

import flixel.FlxState;
import haxe.ui.containers.HBox;

class PlayState extends FlxState
{
	override public function create()
	{
		super.create();

		var view:PlayView = new PlayView();
		add(view);
	}
}

@:build(haxe.ui.ComponentBuilder.build("assets/ui/play-view.xml"))
class PlayView extends HBox
{
	public function new()
	{
		super();
		myStepper.parentComponent.removeComponent(myStepper);
	}
}

<?xml version="1.0" encoding="UTF-8"?>
<hbox width="100%" height="100%" style="spacing: 0;">
	<label text="Hello" />
	<number-stepper id="myStepper" pos="25" step="5" min="0" max="125" />
</hbox>

Context

Maybe there is more of an appropriate way to do what I am doing. But all I really want to do is hide some elements of my layout before anything is shown on screen, based on various parameters in code.

Your Environment

• Windows 10
• Targets: HTML5 and HL
• Haxe 4.2.5
• Lime 8.0.0
• OpenFL 9.1.0
• flixel 4.11.0
• haxeui-core git
• haxeui-flixel git

Current Behavior

When i add a NumberStepper or a search bar prompt ,the text overlaps on top of everything, including the cursor.

Steps to Reproduce (for bugs)

1.Add a dropdown.
2.Add a NumberStepper or Searchbar with prompt below the dropdown.
3.Pass the cursor over the stepper or searchbar.

Media

The UI

The number stepper overlapping dropdown

The number stepper overlapping cursor

The search bar prompt overlapping cursor

Context

I was programming the ui in haxe to create a file and i noticed that the text of the dropdown and the prompt of the search bars was overlapping the mouse and other components.

Your Environment

• Version used:
• Last Window 10 Version.

Sorry if is not very well undestood, English is not my native language and it is the first time i report a bug in github.

Steps to reproduce:
- navigate to the second tab
- navigate to the second inner tab and back to the first inner tab
- navigate to the first tab
- navigate to the second tab again.

All images from both inner tabs will appear overlapped.

Project to reproduce: HaxeuiDebug2.zip

Expected Behavior

When pointing on any UI element the game should not try to switch the cursor or at least not crash the game

Current Behavior

When pointing on ANY UI element the game crashes saying a image with and specific ID was not found

Possible Solution

IDK I'm not good at coding

Steps to Reproduce (for bugs)

1. Paste the code provided into and empty PlayState
2. Compile to windows or any other platform
3. Point on the slider
4. Enjoy your newly crashed game

Media

Test app / minimal test case

import flixel.FlxState;
import haxe.ui.Toolkit;
import haxe.ui.components.Button;
import haxe.ui.components.VerticalSlider;

class PlayState extends FlxState
{
override public function create()
{
super.create();
Toolkit.init();

	var slider = new VerticalSlider(); //Slider or literally anything else
	add(slider);
}

override public function update(elapsed:Float)
{
	super.update(elapsed);
}

}

Context

I was just trying to make a simple volume control in my Windows Simulator but flixel-ui's slider is broken so my only resort was haxeui but when I actually loaded up and tried to move the slider the game crashed.

Your Environment

*Haxe Version: latest or 4.1.0
*Haxeui-core version: latest or 1.7.0
*Haxeui-flixel version: latest or 1.7.0
*Flixel version: latest or 5.8.0
*OS Version if it has to do something with it: Windows 11

I have a feeling that Toolkit.init() needs to be called first, so that the flixel-haxeui signals can be established before stuff starts getting created. I need to confirm, and see if that order is required.