Changing opacity in a long listbox make last elements disapear

Question

I created a listbox with an Opacity set to a value less than 1, and when I bind a long list, the last elements disappear.

I created a little sample to reproduce the problem

In the XAML, a listbox :

<ListBox x:Name="mainList" ItemsSource="{Binding}" Opacity="0.5"></ListBox>

and it is bound to a long list :

   public MainPage()
    {
        InitializeComponent();
        List<int> l = new List<int>();
        for (int i = 0; i < 100; i++)
        {
            l.Add(i);
        }

        this.DataContext = l;
    }

When I execute it, the last element I see is the "87", there is the place for the others elements in the bottom, but it is completely black.

What is the problem exactly ?

edit: a colleague told me it is probably a problem with virtualization, as the problem happens at the 87, and we have 29 items visible on the screen (the listbox virtualizes 3 times the number of items shown, 3*29 = 87). I made the same test with an ItemsControl (without virtualization), and the problem is the same.

Answer 1

*Edit - I was able to reproduce your issue - one thing that does not produce exactly the same UI, but works and looks similar, is setting the ListBox opacity to 1, and then set the UI element in the DataTemplate to opacity 0.5.

Code:

        <ListBox x:Name="mainList" ItemsSource="{Binding}" Opacity="1">
            <ListBox.ItemTemplate>
                <DataTemplate>
                    <TextBlock Opacity="0.5" Text="{Binding}">

                    </TextBlock>
                </DataTemplate>
            </ListBox.ItemTemplate>
        </ListBox>