LayoutGroupListItemRenderer with backgroundSkin that has filter does not render correctly

[mshaffer12882]

A itemRenderer with a backgroundSkin that has a filter will only show while scrolling. I made a simple test to replicate it. Thanks for the help!

@see: https://forum.starling-framework.org/topic/list-dropshadow?replies=3#post-114690

listWithDropShadow.zip

[joshtynjala]

For my future reference, the following code will reproduce this issue:

var list:List = new List();
list.setSize(200, 200);
list.dataProvider = new ArrayCollection(
[
    { label: "One" },
    { label: "Two" },
    { label: "Three" },
    { label: "Four" },
    { label: "Five" },
    { label: "Six" },
    { label: "Seven" },
    { label: "Eight" },
]);
list.itemRendererFactory = function():IListItemRenderer
{
    return new CustomItemRenderer();
};
var layout:VerticalLayout = new VerticalLayout();
layout.horizontalAlign = HorizontalAlign.JUSTIFY;
layout.padding = 10;
layout.gap = 20;
list.layout = layout;
this.addChild(list);

import feathers.controls.renderers.LayoutGroupListItemRenderer;
import feathers.controls.Label;
import starling.display.Quad;
import starling.filters.DropShadowFilter;

class CustomItemRenderer extends LayoutGroupListItemRenderer
{
    public function CustomItemRenderer()
    {
        this.label = new Label();
        this.addChild(this.label);

        var backgroundSkin:Quad = new Quad(1, 1, 0x000000);
        backgroundSkin.filter = new DropShadowFilter();
        this.backgroundSkin = backgroundSkin;
    }

    protected var label:Label;

    override protected function commitData():void
    {
        if(this.data)
        {
            this.label.text = this.data.label;
        }
        else
        {
            this.label.text = null;
        }
    }
}

[joshtynjala]

@mshaffer12882 Is it possible to add your filter to the item renderer instead of its background?

[mshaffer12882]

Yes that works.

Thanks Josh