Download

Trying to display icon in custom ListItemRenderer. Problem when scrolling icon out of and back into view

I’m following the instructions at Displaying an Icon in a Scrolling List - Epic Games Forums I got it working, partly. Right now I’m still testing it in the Scaleform Launcher. The icon shows up in the ListItemRenderer in my ScrollingList. But when I scroll the icon out of view, I get an error in the log:

Error: Loader failed top open ‘[path]/null’
Warning: Failed loading URL “null”

And after that, the icons won’t load again when I scroll them back into view. Does anyone know what function gets called on the ListItemRenderer when it scrolls in and out of view? I would probably check that out first to make sure the icon gets loaded and unloaded.

It loads list items from your data provider.

I’m not sure of exactly how they expect you to use ScrollingList, by I populate the list data by extending ScrollingList and adding this function:

//-- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- --
//Populates the item list with items.
//-- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- --
public function PopulateItemList(listItemsData:Array, selectedIdx = -1):void
{
	this.dataProvider = null;//Set dataprovider to null so we can reset it.
	//Create our new dataprovider
	var dp:DataProvider = new DataProvider(listItemsData);
	
	//Add the dataprovider to the Craftlist.
	this.dataProvider = dp;
	this.selectedIndex = selectedIdx;
}

Then as you scroll the list it loads new ListItemRenderers and setData(data:Object) is called on each new ListItemRenderer.

The data object is one of the objects from the dataProvider array for that corresponding list item. Extend ListItemRenderer for whatever custom list you’re creating (an set that as your list item type in your scrolling list), then in it’s setData, render whatever you need using the passed in data.

1 Like

I literally just now got something working. This is what I did:

		public override function setData(data:Object):void 
		{
			this.data = data;
				
			textField.text = data ? data.label : "";
			if(data) {
				if(data.iconImage != null && data.iconImage != "") {
					imageLoader.visible = true;
					imageLoader.source = data.iconImage;
				}
				else {
					imageLoader.visible = false;
				}
			}
		}
		
		protected override function updateAfterStateChange():void {
			// super.updateAfterStateChange();
			textField.text = data ? data.label : "";
			if(data) {
				if(data.iconImage != null && data.iconImage != "") {
					imageLoader.visible = true;
					imageLoader.source = data.iconImage;
				}
				else {
					imageLoader.visible = false;
				}
			}
        }

But I’m going to take a look at your solution too because I still just need to figure out what all of this ActionScript is doing. Thanks for the help!

You shouldn’t need to add anything to updateAfterStateChange. Unless your listItemRenderer is removing elements when it change states.

we use this to fill out lists. not sure if you can use it or not .

function FillPlayerList(array<string> All_Players)
{ 
 local int i;  

 PlayerListProvider.SetElementString(0, "Select Player...");

 for(i=0; i<All_Players.length; i++)
 {
   PlayerListProvider.SetElementString(i+1, All_Players[i]); 
   AllPlayersProvider.AddItem(All_Players[i]);
 } 
 PlayerListStepper.SetObject("dataProvider", PlayerListProvider); 
 PlayerListStepper.SetFloat("selectedIndex", 0);
}