haxeflixel / flixel-ui Goto Github PK

I'm not a fan of having traces in engine code. I made sure they are all encased by debug-conditionals, but still, that doesn't really solve the issue - personally, it would annoy me to no end that my own traces are lost in the flood of the engine's own traces.

Two options:

• Remove them entirely
• Create a flag like FlxUI.debug to toggle them (not a fan of introducing new compiler conditionals where not necessary)

Openfl 2.0 lets you refresh the assets making FlxUI's live reloading redundant. It's nice to not have to go to the command line to refresh the xml, but that's a minor inconvenience. No inconvenience if FD ever adds a button to do it for you.

Implementing something to listen for Event.CHANGE as described here would be cool, like auto-reloading the UI.

That's more intuitive in my opinion, with id you'd assume it's an integer, plus FlxBasic already has public var ID:Int which might lead to confusion.

A very useful widget to have would be UI lists. There are countless features and variations we could add to this widget, but a good starting point in my opinion would be:

• A "simple" scrollable list base class, representing the list view container, to be controlled by mouse scroll or touch (i don't think we need arrow buttons, just the scroll bar, which could be visible only when the list is being scrolled);
• A skinnable list item base class. The item could have an image, aligned to the left or right, two textfields (one for name & one for description, or one for name & one for price, etc) and could act like a button (normal or toggle);
• A list controller / manager, with each the user can instantiate the list, choosing the type list, the type of list item, the list data (probably from xml), parent, etc.

Ideally the list manager class would have some form of dynamic item loading system, to avoid putting lots of items into the list view all at once, and this would be triggered when scrolling. The list items would basically be modifications or aggregation of other widgets (buttons, textfields, etc).

Of course these are all simple and somewhat abstract ideas, the best way to implement this widget may be different and it probably a good idea to take a look at other ui libraries for ideas.

Add the ability to add an image to a FlxButtonX.

-Image should be able to auto-crop and/or scale when the button is resized.

Doing something like this would essentially make the library similar to a "minimal comps" for HaxeFlixel: the user can quickly prototype the interface, using the included standard assets, test, iterate over positions, sizes, etc and then start creating the customized graphics. Also this would be specially useful for promoting the library on jams and competitions like Ludum Dare and Global Game Jam.

I don't know how much size it would take, but one way to do it would be to make it just like HaxeFlixel does:

• One top-level assets folder, containing everything needed (images, xmls, etc);
• One include.xml file, describing the assets to embed (i think this xml gets included automatically when using the 'haxelib name="flixel-ui"' tag in the project.xml);

Maybe it'd also be possible to create a haxedef to not include the assets if / when the user includes customized assets.

Latest git flixel, flixel-ui, and flixel-addons. Worked fine before I upgraded today, last upgrade was a couple days ago.

When I run my code, the flash debugger finds a null object reference in FlxFrame. In fact, everything in that class is null because it was destroy()ed at some point.

Using a bare-bones FlxUIState that loads in XML with a single button tag:

override public function create():Void {
    _xml_id = "state_play";
    super.create();
}

<?xml version="1.0" encoding="utf-8" ?>
<data>
    <button id="atk" x="5" y="100" />
</data>

my stack trace looks like this:

and locals

On the Neko target:

• When first creating an FlxInputText with a position different than 0,0 and some text already, the caret will always be at position 0,0. When you start typing or erasing, the caret goes down to the right position.
• When you're erasing text and you only have one character left, the caret will stay as if you had two characters still. When you erase the last character, the caret will go to the right position.

On Flash:

• When you remove all the text in the input, the background will collapse to a few pixels.

I did a haxelib upgrade and all of a sudden flixel-ui threw a fit, is this my problem or an update pending between flixel and flixel-ui ?

Error log:

/usr/local/haxe/lib/flixel-ui/git/flixel/addons/ui/FlxUIGroup.hx:28: characters 8-40 : Redefinition of variable width in subclass is not allowed
/usr/local/haxe/lib/flixel-ui/git/flixel/addons/ui/FlxUIGroup.hx:29: characters 8-41 : Redefinition of variable height in subclass is not allowed
/usr/local/haxe/lib/flixel-ui/git/flixel/addons/ui/FlxUI.hx:58: characters 16-41 : Same field name can't be use for both static and instance : _flashRect
/usr/local/haxe/lib/flixel-ui/git/flixel/addons/ui/FlxUI.hx:59: characters 16-42 : Same field name can't be use for both static and instance : _flashRect2
/usr/local/haxe/lib/flixel-ui/git/flixel/addons/ui/FlxUI.hx:60: characters 16-38 : Same field name can't be use for both static and instance : _flashPoint
/usr/local/haxe/lib/flixel-ui/git/flixel/addons/ui/FlxUI.hx:61: characters 16-42 : Same field name can't be use for both static and instance : _flashPointZero
/usr/local/haxe/lib/flixel-ui/git/flixel/addons/ui/FlxUICheckBox.hx:33: characters 8-31 : Redefinition of variable dirty in subclass is not allowed
/usr/local/haxe/lib/flixel-ui/git/flixel/addons/ui/FlxUIGroup.hx:53: characters 22-28 : flixel.FlxBasic should be flixel.FlxSprite
/usr/local/haxe/lib/flixel-ui/git/flixel/addons/ui/FlxUIGroup.hx:53: characters 22-28 : For function argument 'Sprite'
/usr/local/haxe/lib/flixel-ui/git/flixel/addons/ui/FlxUI.hx:72: characters 15-24 : Array<flixel.FlxSprite> should be Array<flixel.FlxBasic>
/usr/local/haxe/lib/flixel-ui/git/flixel/addons/ui/FlxUI.hx:72: characters 15-24 : Type parameters are invariant
/usr/local/haxe/lib/flixel-ui/git/flixel/addons/ui/FlxUI.hx:72: characters 15-24 : flixel.FlxSprite should be flixel.FlxBasic
/usr/local/haxe/lib/flixel-ui/git/flixel/addons/ui/FlxUI.hx:72: characters 15-24 : For function argument 'list'
/usr/local/haxe/lib/flixel-ui/git/flixel/addons/ui/FlxUI.hx:48: characters 13-20 : Array<flixel.FlxSprite> should be Array<flixel.FlxBasic>
/usr/local/haxe/lib/flixel-ui/git/flixel/addons/ui/FlxUI.hx:48: characters 13-20 : Type parameters are invariant
/usr/local/haxe/lib/flixel-ui/git/flixel/addons/ui/FlxUI.hx:48: characters 13-20 : flixel.FlxSprite should be flixel.FlxBasic
/usr/local/haxe/lib/flixel-ui/git/flixel/addons/ui/FlxUI.hx:48: characters 13-20 : For function argument 'list'
/usr/local/haxe/lib/flixel-ui/git/flixel/addons/ui/FlxUI.hx:640: characters 8-34 : flixel.FlxBasic should be flixel.FlxSprite
/usr/local/haxe/lib/flixel-ui/git/flixel/addons/ui/FlxUI.hx:662: characters 6-26 : flixel.FlxBasic should be flixel.FlxSprite
/usr/local/haxe/lib/flixel-ui/git/flixel/addons/ui/FlxUIGroup.hx:61: characters 25-31 : flixel.FlxBasic should be flixel.FlxSprite
/usr/local/haxe/lib/flixel-ui/git/flixel/addons/ui/FlxUIGroup.hx:61: characters 25-31 : For function argument 'Object'
/usr/local/haxe/lib/flixel-ui/git/flixel/addons/ui/FlxUIGroup.hx:52: lines 52-58 : Field add overloads parent class with different or incomplete type
/usr/local/haxe/lib/flixel-ui/git/flixel/addons/ui/FlxUIGroup.hx:52: lines 52-58 : Object : flixel.FlxBasic -> flixel.FlxBasic should be Sprite : flixel.FlxSprite -> flixel.FlxSprite
/usr/local/haxe/lib/flixel-ui/git/flixel/addons/ui/FlxUIGroup.hx:52: lines 52-58 : flixel.FlxBasic should be flixel.FlxSprite
/usr/local/haxe/lib/flixel-ui/git/flixel/addons/ui/FlxUIGroup.hx:60: lines 60-66 : Field remove overloads parent class with different or incomplete type
/usr/local/haxe/lib/flixel-ui/git/flixel/addons/ui/FlxUIGroup.hx:60: lines 60-66 : Object : flixel.FlxBasic -> ?Splice : Bool -> flixel.FlxBasic should be Object : flixel.FlxSprite -> ?Splice : Bool -> flixel.FlxSprite
/usr/local/haxe/lib/flixel-ui/git/flixel/addons/ui/FlxUIGroup.hx:60: lines 60-66 : flixel.FlxBasic should be flixel.FlxSprite
/usr/local/haxe/lib/flixel-ui/git/flixel/addons/ui/FlxUIGroup.hx:121: lines 121-132 : Field set_color should be declared with 'override' since it is inherited from superclass
/usr/local/haxe/lib/flixel-ui/git/flixel/addons/ui/FlxUIGroup.hx:121: lines 121-132 : Field set_color overloads parent class with different or incomplete type
/usr/local/haxe/lib/flixel-ui/git/flixel/addons/ui/FlxUIGroup.hx:121: lines 121-132 : ?col : Int -> Void should be Color : Int -> Int
/usr/local/haxe/lib/flixel-ui/git/flixel/addons/ui/FlxUIGroup.hx:121: lines 121-132 : Optional attribute of parameter col differs
/usr/local/haxe/lib/flixel-ui/git/flixel/addons/ui/FlxUIGroup.hx:41: lines 41-43 : Field set_height should be declared with 'override' since it is inherited from superclass
/usr/local/haxe/lib/flixel-ui/git/flixel/addons/ui/FlxUIGroup.hx:37: lines 37-39 : Field set_width should be declared with 'override' since it is inherited from superclass

There are a couple trace statements within FlxUIList (lines 254/255) which show up when the next/previous buttons are pressed. Do you know if there is a way to remove them other than getting rid of the traces within the source code? I don't really want to manually modify the source files myself as the changes will surely be lost if I ever update.

Thanks again. The UI items are working very well so far.

Also - is there a way to remove the previous and next buttons (other than hiding them)? I was thinking about trying to link up a slider with the List (rather than using buttons).

I want to add a new button state to FlxUITypedButton: Deactivated.
Visually, when deactivated, the button is greyed out, logically, it does not accept any input and does not react on mouse_over or mouse_pressed events.

I think basically it's not a difficult task, but when trying to keep the flexibility to optionally make the button a toggle-button, it becomes a little harder - especially, if you want to keep it compatible with the old button graphics containing only 3 or 6 states...

Maybe add a parameter in the constructor, if the button should be able to be deactivated so the code knows how many frames to expect?
no deactivation, no toggle: 3 frames
deactivation, no toggle: 4 frames
no deactivation, toggle: 6 frames
deactivation, toggle: 7 frames

Track down all references to the old name and change to the new name.

Code Class FlxUI can stay.

--Give everything the "FlxUI" prefix where possible
--Remove the "X" extension and try to come up with something more descriptive
--FlxButtonX's major stuff should be moved into FlxUITypedButton
--FlxButtonX's text-label stuff should be kept and renamed to FlxUIButton

When declaring a FlxUIButton and giving it label text in a bitmap font, it renders in a manner that is ugly and incorrect.

This image is a screenshot of a sample program I wrote to demonstrate the issue. The original was a 160x120 pixels in size; I took the liberty of scaling it up. Anyway, the problem can be seen on the second line:

As you can see from the first line, the problem does not affect FlxUIText objects declared directly.

The problem affects windows and neko targets. It does not affect flash. I didn't try other targets.

By poking around, I discovered the cause of the issue: that the FlxUIText object representing the button's label had a Y-position of 33.5. When Flixel tries to render a bitmap font at a non-integer position, the result is as you see: ugly and incorrect. Afterwards, I discovered a kludgy fix; setting the Y-position of the button itself to a half-integer, so that the text is rendered at an integer position. You can see this fix working in the third line in the image above. I set the button's Y-position to 63.5 instead of 64, and the FlxUIText is rendered where I want it: at a Y-position of 65. Setting the text_y offset to a half-integer value does NOT work.

Here is the source of the XML file I used to generate this user interface:

<data>
    <definition id="bitrod8" font="bitrod" size="8" color="0x000000" align="center"/>

    <definition id="text_button" width="160" height="14" text_x="0" text_y="12">
        <graphic blank="true"/>
        <text use_def="bitrod8" color="0x000000">
            <color id="up" value="0x000000"/>
            <color id="over" value="0x0000ff"/>
            <color id="down" value="0xff00ff"/>
        </text>
    </definition>

    <text x="0" y="0" width="160" use_def="bitrod8" text="This is a FlxUIText at y = 0." />

    <button center_x="true" x="0" y="32" id="foo" use_def="text_button" label="This is a FlxUIButton at y = 32.">
        <param type="string" value="foo"/>
    </button>

    <button center_x="true" x="0" y="63.5" id="bar" use_def="text_button" label="This is a FlxUIButton at y = 63.5.">
        <param type="string" value="bar"/>
    </button>
</data>

The Haxe source can be provided if desired, but it is largely boilerplate code and contains nothing interesting.

The font in question can be downloaded here: http://fontstruct.com/fontstructions/show/816725

I've tried other bitmap fonts as well and they exhibited the same behavior, like Press Start from this page: http://www.zone38.net/font/

I am aware that flixel-ui is not compatible with the FlxBitmapFont class from Flixel Power Tools. However, this is not that. This is a normal, black-and-white bitmap TTF, and as far as I know, it works apart from this issue.

Right now 9-slice scaling can cause some load times on certain targets if you have a lot of elements that use it. I'm wondering if I can optimize my algorithm a bit, I noticed that there's some code I could borrow from the SWF library, maybe run a comparison:

https://github.com/openfl/swf/blob/master/format/swf/instance/MovieClip.hx#L630

With a lot of data, the height of the drop down menu will simply exceed the screen height. There are two options to solve this issue in my opinion:

• Add the option to have multiple columns, using space horizontally
• Add a scrolling behaviour - only part of the data list is shown, and when the mouse cursor hovers over the end of the list at the bottom of the screen, the list scrolls down

Ideally, we would have both of those options.

• If you create a FlxInputText and later set background to false, the background is still drawn.
• If you set the BackgroundColor argument to 0 when creating the object, background will be set to false, but you'll get the same behavior.

The problem is that both the background and border sprites are still being created. Setting both to null when creating with a 0 background color or when changing background to false should fix this.

Ok, this one might have something to do with my understanding/expectations with this class:

When I create a FlxUISpriteButton and I add a "big" image, let's say 200x100, the size of the button is still a very small one (i.e. like creating an FlxUIButton with no text). I was expecting the button to take the size of my image (and I'm doing that right now calling resize after I create the button, but still...)

Also, when clicking on the button, I still see the old graphic below my button (I see a like with 1px height on top of it).

If it's just that my expectations are too much, you can safely close this :)

I'm creating a button like this:

var button = new FlxUIButton(0, 0, "Test");
button.label.setFormat("assets/fonts/font.ttf", 18, 0);

When running in Neko, the label is centered on the button. When running in Flash, the label is left aligned. If you remove the label.setFormat() call, the label is centered in both platforms.

I was running into problems setting the FlxUIButtons styles.

Inside FlxUIButton (onDownHandler and onOverHandler) it checks if(down_style != null) and if (down_toggle_style != null) when I think it should be checking down_style.border and down_toggle_style_border

I think my problem is that I wasn't setting the border attribute however, it was trying to set label.borderStyle = down_style.border.style.

Seems like onUpHandler and onOutHandler are fine.

Thanks

Much nicer to be able to write white / WHITE instead of 0xFFFFFF for example.

public function new(back_:FlxSprite,?tabs_:Array,?tab_ids_and_labels_:Array<{id:String,label:String}>,stretch_tabs:Bool=false)
{
super();

    if (back_ == null) {
        //default, make this:
        back_ = new FlxUI9SliceSprite(0, 0, FlxUIAssets.IMG_CHROME_FLAT, new Rectangle(0, 0, 200, 200));
    }

back_ is checking for null state, but that's not allowed. Adding the ? also fixes a format issue on FD - without it for some reason ?tabs_ just asks for an array, and after that it looks for a FlxUIButton parameter.

It was already mentioned on this issue: #41
But wanted to make a separate issue.

Basically, when tapping on a FlxInputText, the carrot appears, but the keyboard doesn't come up.
I haven't tested with a hard keyboard yet, since all of my devices are soft-keyboard.

Looking at possible solutions now. It appears OpenFL has the capability to access the Java Native Interface. So may need to do something like this (within a #if android of course):

//When created:
        var JNIShowSoftKeyboard:Dynamic = JNI.createStaticMethod("flixel/addons/ui/KeyboardHandler", "showSoftKeyboard");
        var JNIHideSoftKeyboard:Dynamic = JNI.createStaticMethod("flixel/addons/ui/KeyboardHandler", "hideSoftKeyboard");
//When hasFocus:
        JNIShowSoftKeyboard();
//When !hasFocus:
        JNIHideSoftKeyboard();

Of course, will have to look at how Haxe handles native code. Especially since the normal way for handling the soft keyboard is:

InputMethodManager _imm = (InputMethodManager)SOME_CONTEXT.getSystemService(Service.INPUT_METHOD_SERVICE);
//then:
_imm.toggleSoftInput(InputMethodManager.SHOW_FORCED,0);
//or:
_imm.toggleSoftInput(InputMethodManager.HIDE_IMPLICIT_ONLY,0);

Which requires the current application context.

The problem is that autoCenterLabel is called too early (in the button constructor) before the graphics has been loaded and the width and height had a chance to be set.

in FlxUISpriteButton.hx:35

removing it from there and adding it to FlxUI.hx:1641 is one solution, another would be to call the resize function after the graphics has been loaded.

FlxUIButton's Label field assumes that label will never be null, but it is possible for it to be null.

Hi. Here is the errorlog of the current dev branch, when I try to compile project with it.

C:\HaxeToolkit\haxe/lib\flixel-ui/1,0,3/flixel/addons/ui/FlxUITypedButton.hx:62: characters 2-44 : Too many arguments
C:\HaxeToolkit\haxe/lib\flixel-ui/1,0,3/flixel/addons/ui/FlxUITypedButton.hx:62: characters 2-44 : Function 'new' requires arguments : ?X, ?Y, ?Label, ?OnClick
C:\HaxeToolkit\haxe/lib\flixel-ui/1,0,3/flixel/addons/ui/FlxUITypedButton.hx:68: characters 2-14 : Unknown identifier : labelOffsets
C:\HaxeToolkit\haxe/lib\flixel-ui/1,0,3/flixel/addons/ui/FlxUITypedButton.hx:69: characters 2-14 : Unknown identifier : labelOffsets
C:\HaxeToolkit\haxe/lib\flixel-ui/1,0,3/flixel/addons/ui/FlxUITypedButton.hx:71: characters 2-14 : Unknown identifier : labelOffsets
C:\HaxeToolkit\haxe/lib\flixel-ui/1,0,3/flixel/addons/ui/FlxUITypedButton.hx:72: characters 2-14 : Unknown identifier : labelOffsets
C:\HaxeToolkit\haxe/lib\flixel-ui/1,0,3/flixel/addons/ui/FlxUITypedButton.hx:74: characters 2-14 : Unknown identifier : labelOffsets
C:\HaxeToolkit\haxe/lib\flixel-ui/1,0,3/flixel/addons/ui/FlxUITypedButton.hx:75: characters 2-14 : Unknown identifier : labelOffsets
C:\HaxeToolkit\haxe/lib\flixel-ui/1,0,3/flixel/addons/ui/FlxUITypedButton.hx:77: characters 2-13 : Unknown identifier : labelAlphas
C:\HaxeToolkit\haxe/lib\flixel-ui/1,0,3/flixel/addons/ui/FlxUITypedButton.hx:78: characters 2-13 : Unknown identifier : labelAlphas
C:\HaxeToolkit\haxe/lib\flixel-ui/1,0,3/flixel/addons/ui/FlxUITypedButton.hx:79: characters 2-13 : Unknown identifier : labelAlphas
C:\HaxeToolkit\haxe/lib\flixel-ui/1,0,3/flixel/addons/ui/FlxUITabMenu.hx:151: characters 3-23 : flixel.addons.ui.FlxUIButton has no field onUp
C:\HaxeToolkit\haxe/lib\flixel-ui/1,0,3/flixel/addons/ui/FlxUIDropdownMenu.hx:66: characters 4-22 : flixel.addons.ui.FlxUIButton has no field onUp
C:\HaxeToolkit\haxe/lib\flixel-ui/1,0,3/flixel/addons/ui/FlxUIDropdownMenu.hx:71: characters 4-18 : flixel.addons.ui.FlxUIButton has no field labelOffsets
C:\HaxeToolkit\haxe/lib\flixel-ui/1,0,3/flixel/addons/ui/FlxUICheckBox.hx:79: characters 2-25 : flixel.addons.ui.FlxUIButton has no field onUp
C:\HaxeToolkit\haxe/lib\flixel-ui/1,0,3/flixel/addons/ui/FlxUICheckBox.hx:99: characters 2-21 : flixel.addons.ui.FlxUIButton has no field labelOffsets
C:\HaxeToolkit\haxe/lib\flixel-ui/1,0,3/flixel/addons/ui/FlxUICheckBox.hx:100: characters 2-21 : flixel.addons.ui.FlxUIButton has no field labelOffsets
C:\HaxeToolkit\haxe/lib\flixel-ui/1,0,3/flixel/addons/ui/FlxUICheckBox.hx:101: characters 2-21 : flixel.addons.ui.FlxUIButton has no field labelOffsets
C:\HaxeToolkit\haxe/lib\flixel-ui/1,0,3/flixel/addons/ui/FlxUICheckBox.hx:102: characters 2-21 : flixel.addons.ui.FlxUIButton has no field labelOffsets
C:\HaxeToolkit\haxe/lib\flixel-ui/1,0,3/flixel/addons/ui/FlxUICheckBox.hx:103: characters 2-21 : flixel.addons.ui.FlxUIButton has no field labelOffsets
C:\HaxeToolkit\haxe/lib\flixel-ui/1,0,3/flixel/addons/ui/FlxUICheckBox.hx:104: characters 2-21 : flixel.addons.ui.FlxUIButton has no field labelOffsets
C:\HaxeToolkit\haxe/lib\flixel-ui/1,0,3/flixel/addons/ui/FlxUICheckBox.hx:197: characters 52-71 : flixel.addons.ui.FlxUIButton has no field labelOffsets
C:\HaxeToolkit\haxe/lib\flixel-ui/1,0,3/flixel/addons/ui/FlxUITypedButton.hx:97: characters 14-26 : Unknown identifier : labelOffsets
C:\HaxeToolkit\haxe/lib\flixel-ui/1,0,3/flixel/addons/ui/FlxUITypedButton.hx:98: characters 14-26 : Unknown identifier : labelOffsets
C:\HaxeToolkit\haxe/lib\flixel-ui/1,0,3/flixel/addons/ui/FlxUITypedButton.hx:667: characters 2-18 : flixel.ui.FlxTypedButton<flixel.addons.ui.FlxUITypedButton.T> has no field set_status
C:\HaxeToolkit\haxe/lib\flixel-ui/1,0,3/flixel/addons/ui/FlxUITypedButton.hx:742: characters 2-19 : flixel.ui.FlxTypedButton<flixel.addons.ui.FlxUITypedButton.T> has no field onUpHandler
C:\HaxeToolkit\haxe/lib\flixel-ui/1,0,3/flixel/addons/ui/FlxUITypedButton.hx:18: lines 18-744 : Field onUpHandler is declared 'override' but doesn't override any field
C:\HaxeToolkit\haxe/lib\flixel-ui/1,0,3/flixel/addons/ui/FlxUITypedButton.hx:18: lines 18-744 : Field set_status is declared 'override' but doesn't override any field

To make game menus navigable via keyboard (and joysticks), we need a class to group the buttons (FlxButtonGroup extending FlxTypedGroup?), when added it has an 'index order' variable (auto increment when adding OR can be set manually), with this feature the player could navigate though the buttons using the arrow keys (default) or joystick.

*Current selected button is set to 'hover sprite' (second frame), down (third frame)
*Consider horizontal and vertical navigations, or both at the same time.
*Consider disabled buttons.
*(optional) Sound when navigating (jump another button)
*Default keys (arrow keys and space/return to press), function to change them.
*Platform-only: Windows, Mac, Linux, Flash and OUYA (Android exception?).

@impaler commented: "I have used focus manager api in as3 before that might be good for implementation ideas it had an index order you could set manually."

Example:

"4, 4, 7, 7" -> [4, 4, 7, 7]

FlxArrayUtil.intFromString() seems perfect for this.

i was having an issue that I outlined here:
HaxeFlixel/flixel#650

but maybe this is way simpler than i am thinking:
I have an button that extends FlxUIButton

and in the constructor I call super, then I call load loadGraphicSlice9 and in ( ["assets/gfx/ui/buttons/button_blue.png"], 18, 18, ["6,6,11,11"] );

this works and you can see a 18 by 18 button in the application..

I just trying to figure out the proper way to adjust the size of the button using the 9 slicing. I've tried resize() (erros) changing width and height ad different times (pre and post constructor) and different values in the loadGraphicSlice9 spot.

thanks in advance for the advice/help

Currently loadGraphicSlice9 only accepts Array<String> but sometimes one may want to use dynamically generated BitmapData as assets.

If I change the label size via label.size it doesn't seem to recenter properly (unless I call calcFrame() after changing the size).. When I need to change a labels size should I just create a new FlxUITxt or am I supposed to be able to change the size property (without calling calcFrame())?

Thanks

Seems like the classes in the shapes subdirectory haven't been updated yet, as attempting to compile them yields a whole bunch of comiler errors.

Some sort of UI editor, whether it'd be in-game (preferable IMO) or using an external software would be extremely handy for obvious reasons.

The confirmation box / pop up classes are straight ports from as3 defender's quest and are don't take much advantage of flixel-ui yet. Fix this, perhaps using substates?

Sorry to bother you again but I have one more question.

I was having a bit of trouble centering my FlxUIText in my FlxUIButton and came across the following. I am not sure if there is an issue or I am doing something wrong.

Here is a simple FlxUIText example of what I am talking about

//EXAMPLE 1
var a:FlxUIText = new FlxUIText(0, 0, 500, "TEST", 100); //set the font size here
a.setFormat(null, 100, FlxColor.GREEN, "center");
trace(a.height); //The height is 129 - seems about right as you have 100 pixel font + baseline and gutter and whatever text based stuff above/below

//EXAMPLE 2
var a:FlxUIText = new FlxUIText(0, 0, 500, "TEST"); //font size not set here
a.setFormat(null, 100, FlxColor.GREEN, "center");
/trace(a.height); //The height is 14 - on screen the font is 100 but the height variable appears not be refreshed

//EXAMPLE 3
var a:FlxUIText = new FlxUIText(0, 0, 500, "TEST"); //font size not set here
a.size = 100;
a.color = FlxColor.GREEN;
trace(a.height); //The height is 14 - I am not sure if I am allowed to set the size like this, but like above, on screen the text is 100 while the height is registered as only 14

Example 2 and 3 create issues with centering because it thinks the size is quite small.

Let me know if I am doing something wrong.
Thanks again

Right now the system uses FlxButtonPlus rather than FlxButton as the basis for pretty much all button functionality, this is a legacy decision based on the way Defender's Quest 1 was set up.

It'd be useful for a lot of reasons to use FlxButton instead.

It would take some work since the library is kind of far along, but this should be investigated.

Compile this samples target html5.
Error info like this：
C:\HaxeToolkit\haxe\lib/flixel-ui/git/flixel/addons/ui/FlxInputText.hx:298: characters 19-44 : flash.text.TextField has no field getLineMetrics

Hey i have the latest version. I attempted to compile the tutorial (and a simple local demo)

I get these errors:

/usr/lib/haxe/lib/flixel-ui/git/flixel/addons/ui/FlxUICheckBox.hx:60: characters 52-67 : flixel.text.#FlxText has no field OUTLINE
/usr/lib/haxe/lib/flixel-ui/git/flixel/addons/ui/FlxUI.hx:1978: characters 25-37 : flixel.text.#FlxText has no field NONE
/usr/lib/haxe/lib/flixel-ui/git/flixel/addons/ui/FlxUI.hx:1983: characters 33-47 : flixel.text.#FlxText has no field SHADOW
/usr/lib/haxe/lib/flixel-ui/git/flixel/addons/ui/FlxUI.hx:1984: characters 34-49 : flixel.text.#FlxText has no field OUTLINE
/usr/lib/haxe/lib/flixel-ui/git/flixel/addons/ui/FlxUI.hx:1985: characters 39-59 : flixel.text.#FlxText has no field OUTLINE_FAST
/usr/lib/haxe/lib/flixel-ui/git/flixel/addons/ui/FlxUI.hx:1991: characters 20-34 : flixel.text.#FlxText has no field SHADOW
/usr/lib/haxe/lib/flixel-ui/git/flixel/addons/ui/FlxUI.hx:1996: characters 21-36 : flixel.text.#FlxText has no field OUTLINE
/usr/lib/haxe/lib/flixel-ui/git/flixel/addons/ui/FlxUI.hx:2001: characters 22-42 : flixel.text.#FlxText has no field OUTLINE_FAST
/usr/lib/haxe/lib/flixel-ui/git/flixel/addons/ui/FlxUI.hx:1098: characters 3-79 : Int should be Bool
/usr/lib/haxe/lib/flixel-ui/git/flixel/addons/ui/FlxUI.hx:1098: characters 3-79 : For optional function argument 'UseShadow'
/usr/lib/haxe/lib/flixel-ui/git/flixel/addons/ui/FlxUI.hx:1104: characters 3-79 : Int should be Bool
/usr/lib/haxe/lib/flixel-ui/git/flixel/addons/ui/FlxUI.hx:1104: characters 3-79 : For optional function argument 'UseShadow'
/usr/lib/haxe/lib/flixel-ui/git/flixel/addons/ui/FlxUI.hx:2145: characters 4-86 : Int should be Bool
/usr/lib/haxe/lib/flixel-ui/git/flixel/addons/ui/FlxUI.hx:2145: characters 4-86 : For optional function argument 'UseShadow'

maybe just forgot to check in the latest flxUI?

With text:

Empty text:

I tried doing this:

cursor.keysClick.push(new MultiKey(FlxG.keys.getKeyCode("X")));

But pressing X only makes the button look like it's getting MouseOver and not being clicked.

Something like this:

/**
 * Copyright (c) 2013 by Samuel Batista
 * (original by Matt Tuttle based on Thomas Jahn's. Haxe port by Adrien Fischer)
 * This content is released under the MIT License.
*/

/* @author Lars Doucet (github link to userpage)

How to reproduce: Enter some text into a FlxInputText, move the cursor somewhere into the text. Press any non-printable key except shift and ctrl. Examples with which I was able to reproduce the bug: up and down arrows, caps lock.

What happens: The first key press removes all text after the cursor, pressing the key again does nothing, but the third key-press empties the FlxInputText.

To @crazysam:

Event handling in Flixel-ui is a bit of a mess.

FlxUI.hx callbacks start here:
https://github.com/HaxeFlixel/flixel-ui/blob/dev/flixel/addons/ui/FlxUI.hx#L2408

Assignments:

• RadioGroup: https://github.com/HaxeFlixel/flixel-ui/blob/dev/flixel/addons/ui/FlxUI.hx#L1322
• CheckBox: https://github.com/HaxeFlixel/flixel-ui/blob/dev/flixel/addons/ui/FlxUI.hx#L1372
• DropDown: https://github.com/HaxeFlixel/flixel-ui/blob/dev/flixel/addons/ui/FlxUI.hx#L1494
• Button: https://github.com/HaxeFlixel/flixel-ui/blob/dev/flixel/addons/ui/FlxUI.hx#L1685

There might be more, I'll update if so.

The problem is that I have several needs for each IFlxUIWidget:

1. Manage self with internal callbacks (toggle buttons, tab Menu, input text, dropdown, etc)
   -- Generally this stuff is NOT exposed to the outside world of that IFlxUIWidget.
2. Notify parent FlxUI instance of an "event" somehow with external callbacks
3. Let the event bubble up to the FlxUIState with enough meaningful metadata for the user to do something important -- Oh, cool "button_x" was pushed, let's fire ze missiles!

So, it's easy enough to pass up a "button was clicked!" event. But what the user really wants to know is WHAT button was clicked. Right now, my system allows for arbitrary arrays of Dynamic parameters for my "event" system, which involves a LOT of if checking and casting, and requiring the user to expect a specific kind of data input.

I've already established the paradigm that every widget has a string identifier (lowercase "id" member variable). Perhaps it would make sense, with every "event", whatever shape it takes, to also pass along the id of who sent it? Right now FlxUI hijacks the "sender" field in my event system for itself, so all events come from the FlxUI instance, which isn't very useful to the user just trying to manage things in their FlxUIState.

FlxUIState:
getEvent: https://github.com/HaxeFlixel/flixel-ui/blob/dev/flixel/addons/ui/FlxUIState.hx#L118

This can lead to some weird behavior on the part of the user. Look at RPG Interface's getEvent:
https://github.com/HaxeFlixel/flixel-demos/blob/dev/User%20Interface/RPG%20Interface/source/State_Title.hx#L35

Notice all the rigamarole I have to go through on "click_button" event to determine WHICH button it was. For buttons, I'm putting arbitrary, user-definable parameters on them, defined in the xml markup:
https://github.com/HaxeFlixel/flixel-demos/blob/dev/User%20Interface/RPG%20Interface/assets/xml/state_title.xml#L37

I like having a feature like this, but it seems a bit complicated just to do something basic. And then, I get a little inconsistent. Buttons have their parameters set by the FlxUI, but things like CheckBoxes are modifying them on the fly to indicate the status of the check:

https://github.com/HaxeFlixel/flixel-ui/blob/dev/flixel/addons/ui/FlxUICheckBox.hx#L205

...which would have to be parsed on the other end.

This is uncecessary for buttons because buttons don't have an internal state like that (unless they're toggle buttons, and I don't believe I send any "toggle:true" anywhere.)

Other miscellaneous stuff:

• FlxUI by default tries to grab all the "events" from its children and send them itself
  • It does this for everything created with a _load method
• FlxUIDropDownMenu has a special case callback, _ui_control_callback (https://github.com/HaxeFlixel/flixel-ui/blob/dev/flixel/addons/ui/FlxUIDropDownMenu.hx#L45) which is used to keep the UI from letting the user click any UI elements that are below the dropdown list (FlxUI must manage this behavior)
• FlxUIPopUp inherits from FlxUISubstate, and is thus a FlxUIState in and of itself, with its own event response stuff (https://github.com/HaxeFlixel/flixel-ui/blob/dev/flixel/addons/ui/FlxUIPopup.hx#L99)

I THINK that about covers it, but let me know if I missed something.

In summary, I started with a simple system I thought would be universal, and then started adding little bits of cruft to accommodate reality and now I have a mess! Here's what my event system needs to do:

1. User interacts with a widget (button, checkbox, dropdown, numstepper, input text, etc)
2. Widget tells FlxUI, "Hey I've changed my state"
3. FlxUI tells FlxUIState, "Hey, has just been interacted with, it is sending user-defined-in-xml data and relevant widget state data ".

And as a bonus, widgets should be able to be created "nakedly" without being part of FlxUI, and still have some easy way to setup callbacks/listeners/whatever.

I don't care if it's a true event system, or a signal system, or whatever, so long as it can do the above things.

I'm not sure if we need a massive overhaul or just some simple tweaks. Even though this setup is inefficient, events are not performance-intensive. What really matters is flexibility and clarity to the user.

This repo should just have the library.

Hey guys, I attachedVS 2010 debugger when the application crashed, and I got absolutely nowhere. Checkout this screenshot of the crash details:

It seems we're crashing within a Dynamic object's constructor. This isn't very helpful at all, without a Haxe callstack it impossible to determine where the crash is happening.

Although this does give a hint: we're probably crashing in a line of code that has new keyword... it would be great if we could figure out why we're not getting a Haxe callstack though.

Hey I've been working on this feature where you can scale down a textfield to either:

1. Fit a single line textfield to a defined width
2. Fit a multi line textfield to a defined height

here is my first pass, do you feel like it belongs in this project? If so, there is much to do before it can be pulled in. Not sure the proper place for the utilities and I'm sure it can be optimized better. Let me know you thoughts =]

here is the initial commit: gltovar@8eefdad

here is a screen shot: http://i.imgur.com/TSzBtYY.png

and the code that generated that screenshot: https://gist.github.com/gltovar/6881361

d8253c3#commitcomment-6116852

Right now you can only reference definitions in the current xml layout file. There needs to be an optional place to store global UI definitions to save some space.

I'm creating a button like this:

var button = new FlxUIButton(0, 0, "Test");
button.down_color = 0xFFFFFF;

When you press the button down, the label goes white as expected. When you press the button down again, the label goes black. If you do it again, the label will be white again, etc.