Can't see the ListView text

Hi, having a problem with reading it, it’s like a font thing, maybe…

I have this:
var array_consumiveis = new ArrayDataSource();
var list_consumiveis = new ListView();

I load the array with:
for ( row in rset )
{
trace("ENTRADAS : " + row.BARCODE + " " + row.DESCRIPT + " " + row.ADDDATE + " " + row.REMDATE + " " +row.QUANTIDADE);
array_consumiveis.add({BARCODE:row.BARCODE, DESCRIPT:row.DESCRIPT, ADDDATE:row.ADDDATE, REMDATE:row.REMDATE, QUANTIDADE:row.QUANTIDADE});
}
that’s coming from an sys.db.Sqlite.open(…

all good up to here, when I do:
list_consumiveis.dataSource = array_consumiveis;
list_consumiveis.onClick = function (e)
{
trace (list_consumiveis.selectedIndex + " " + list_consumiveis.selectedItem);
}
… add it to the respective vbox, and that vbox is added to a tab, all good there when I click it, it traces the respective information loaded from the sql that is injected into the array data source.
When I compile though, I just can’t read it on the listview.


Probably borking this royally somehow.
Appreciate any help with this, am able to send the project with sources if needed.

Edit 1:
haxeui-core 1.0.3
haxeui-openfl 1.0.0
openfl 8.9.5
lime 7.6.3
hxcpp 4.0.8
haxe 3.4.7
on windows 10 64bits

Hi! Is there any chance you might be able to zip up your project? I made some changes recently but they are not on haxelib yet, would be good to see if that fixes any of your issues (and its easier to see if there are other issues by looking at the full code etc).

Cheers,
Ian

PS: welcome btw! :slight_smile:

Hi Ian, sent it over wetransfer to ianharrigan@hotmail.com.
Thanks for looking into this.

Ok, so the issue is that the ListView comes with a BasicItemRenderer, this has a single label (named “value”) and an image (called “icon” i think). You are trying to add different data:

        array_consumiveis.add({
            BARCODE: "row.BARCODE", 
            DESCRIPT: "row.DESCRIPT", 
            ADDDATE: "row.ADDDATE", 
            REMDATE: "row.REMDATE", 
            QUANTIDADE: "row.QUANTIDADE"
            
        });

Which has none of those Ids, so you’ll need to create a new item renderer for the list view:

    var itemRenderer = new ItemRenderer();
    itemRenderer.percentWidth = 100;
    itemRenderer.layoutName = "horizontal";
    
    var label = new Label();
    label.id = "BARCODE";
    label.percentWidth = 20;
    itemRenderer.addComponent(label);
    
    var label = new Label();
    label.id = "DESCRIPT";
    label.percentWidth = 20;
    itemRenderer.addComponent(label);
    
    var label = new Label();
    label.id = "ADDDATE";
    label.percentWidth = 20;
    itemRenderer.addComponent(label);
    
    var label = new Label();
    label.id = "REMDATE";
    label.percentWidth = 20;
    itemRenderer.addComponent(label);
    
    var label = new Label();
    label.id = "QUANTIDADE";
    label.percentWidth = 20;
    itemRenderer.addComponent(label);
    
    list_consumiveis.addComponent(itemRenderer);

Note, ive created this renderer in code as your project uses code only but, just so you know this sort of stuff is alot easier to create (and visualize) using xml:

<listview width="900">
	<item-renderer width="100%" layoutName="horizontal">
		<label width="20%" id="BARCODE" />
		<label width="20%" id="DESCRIPT" />
		<label width="20%" id="ADDDATE" />
		<label width="20%" id="REMDATE" />
		<label width="20%" id="QUANTIDADE" />
	</item-renderer>
</listview>

Ofc its totally up to you! :slight_smile:

Cheers,
Ian

PS: few other things: depending on how many items you have in your listview, you may want to make it virtual (myList.virtual=true or <list virtual="true">)

Also you may want to take a look at tableview, that might suit your needs better (since you seem to be displaying database data) - again, totally up to you ofc!

1 Like

I see, I was totally clueless to the item renderer for the list view.
I’ll have to look at the xml way, looks way cleaner too.
Thank you so much for you help Ian!!

1 Like

@ ianharrigan, well that fixed it!
I noticed if I add a button to every listview line and do an onclick function for it, nothing happens.
Is that possible on the tableview ? I think I’ll go with tableview for the next attempt.
But am trying to figure if I can edit cell content in place with it too.

Tables / listviews arent editable (as of yet) but it should be fairly simple to make them so (ive done it before ages and ages ago, but have lost the code in the mean time due to an SSD failure :frowning: )

As for getting the event from the table you need to use ItemEvent.COMPONENT_EVENT, eg:

myList.registerEvent(ItemEvent.COMPONENT_EVENT, function(e) {
    trace(Type.getClassName(Type.getClass(e.source))); // will be Button if its a button, slider if its a slider, etc
});

Hope that helps!

2 Likes