Cannot remove/hide properties from PropertyGrid [OpenFL]

1

Hi, when trying to hide properties in a PropertyGrid programmatically, it doesn’t work. Not only do the exposed apis (hide(), .visible, .hidden) do nothing, but also styling in the .xml (<property id=“intProp” hidden…) will not work.

ui.xml

<box width="300">
    <property-grid id="pg1" width="250" height="300">
        <property-group id="pgroup" text="Primary Group">
            <property id="stringProp" label="String Property" value="Value 1" />
            <property id="boolProp" label="Bool Property" type="boolean" value="true" />
            <property id="intProp" label="Int Property" type="int" value="101" />
            <property id="listProp" label="List Property" type="list" value="Item 1">
                <data>
                    <item text="Item 1" />
                    <item text="Item 2" />
                    <item text="Item 3" />
                    <item text="Item 4" />
                    <item text="Item 5" />
                    <item text="Item 6" />
                </data>
            </property>    
        </property-group>
    </property-grid>
</box>

@:build(haxe.ui.ComponentBuilder.build("assets/ui.xml"))
class TestBox extends Box {
    public function new() {
        super();
        //tried with all of these
        intProp.hide();
        intProp.visible = false;
        intProp.hidden = true;
    }
}

propgrid_evidences
propgrid_evidences791×586 5.86 KB

I tried looking through the source code to try and diagnose myself but it isn’t clear what could be happening. I am also unable to remove the property with removeComponent().

2

Hi, welcome! :slight_smile:

So, ill have to double check, but i dont think that this is currently supported. That said, i think it is a perfectly reasonable (and valid) expectation. So Ill add it.

Cheers!
Ian

3

Alright, this should be fixed now latest (git) haxeui-core.

Cheers!
Ian

4

Hi, thanks for the quick response!

I can confirm that PropertyGroup.removeComponent does work now

propgrid_evidences
propgrid_evidences795×595 5.54 KB

But still Property.hide() doesn’t hide the line item. That being said, removeComponent should be sufficient.

5

Are you sure? This seem to work fine: http://haxeui.org/builder/?4f36c002

<vbox style="padding: 5px;">
    <hbox>
        <button text="Toggle Visibility" onclick="intProp.hidden = !intProp.hidden" />
        <button text="Show" onclick="intProp.show()" />
        <button text="Hide" onclick="intProp.hide()" />
    </hbox>    
    <property-grid id="pg1" width="250" height="300">
        <property-group id="pgroup" text="Primary Group">
            <property id="stringProp" label="String Property" value="Value 1" />
            <property id="boolProp" label="Bool Property" type="boolean" value="true" />
            <property id="intProp" label="Int Property" type="int" value="101" />
            <property id="listProp" label="List Property" type="list" value="Item 1">
                <data>
                    <item text="Item 1" />
                    <item text="Item 2" />
                    <item text="Item 3" />
                    <item text="Item 4" />
                    <item text="Item 5" />
                    <item text="Item 6" />
                </data>
            </property>    
        </property-group>
    </property-grid>
</vbox>
6

You’re right, it does seem to work when embedded into the .xml.

I’ve been trying to call Property.hide() in the PropertyGrid constructor so that the properties displayed would be dependent on some variables in memory. Also I tried pulling out the function which hide the properties and calling it after the constructor, still didn’t work. However, it did work after an async delay.

@:build(haxe.ui.ComponentBuilder.build("assets/prop_grid.xml"))
class MyPropertyGrid extends VBox {
    public function new() {
        super();
        intProp.hide();
    }

    public function alter(): Void {
        intProp.hide();
    }
}

...

//doesn't hide
@:bind(display_grid_button, MouseEvent.CLICK)
private function displayGrid(e) {
    var pg = new MyPropertyGrid();
    Screen.instance.addComponent(pg);
}

...

//doesn't hide
@:bind(display_grid_button, MouseEvent.CLICK)
private function displayGrid(e) {
    var pg = new MyPropertyGrid();
    Screen.instance.addComponent(pg);
    pg.alter();
}

...

//DOES hide
@:bind(display_grid_button, MouseEvent.CLICK)
private function displayGrid(e) {
    var pg = new MyPropertyGrid();
    Screen.instance.addComponent(pg);
    sys.thread.Thread.create(() -> {
        Sys.sleep(.5);
        pg.alter();
    });
}

So I’m guessing it’s just dependent on the internals of the UI lifecycle.

7

Right, so it might not be “ready” by that point, ill have a look tomorrow and see if i can clean that up.

FYI: you can also use Toolkit.callLater(() -> ...); which will call the function on the “next frame”, but ill take a look tomorrow and see if there is a way to not have to use either method.

Cheers,
Ian

8

Alright, that should be working now - you shouldnt need any timer / calllater calls…

Cheers,
Ian