ListBox is not implemented

[MelbourneDeveloper]

Current behavior

When the ItemsSource on a ListBox is set, no items are populated. However, if the browser is maximised or otherwise resized, the items will populate.

Expected behavior

ListBox is populated as soon as ItemsSource is set.

How to reproduce it (as minimally and precisely as possible)

• Clone this repo: https://github.com/MelbourneDeveloper/RestClient.Net
• Hard reset to Tag UnoIssue1362
• Open the samples solution
• Restore NuGets
• Run the sample RestClient.Net.Samples.Uno.Wasm
• Click the 'Get My Repos' button. Notice that the "Loading..." text comes up quickly and disappears but you do not see any items in the ListBox.
• Resize the browser window
• Notice items show up in the top ListBox

Environment

Windows 10
Firefox (WASM)

Visual Studio

• 2017 (version: 15.9.14)

Anything else we need to know?

This has happened in multiple different projects. It also happens in Edge.

[ghuntley]

Confirming that I've been able to reproduce this in master on the samples app. The problem manifests worst on Edge and happens less with Firefox. This is what I see.

Is this similar to what you see?

[MelbourneDeveloper]

@ghuntley it looks like it's in the ballpark. But in my case, I don't see anything in the listbox until I resize the browser. Very easy to see in the sample I posted.

[MelbourneDeveloper]

@ghuntley there is an update on this.

I thought the issue might because I was setting the ItemsSource directly rather than using binding. So, I tried creating a ViewModel, and binding to the ItemsSource. I got the same result.

I thought that perhaps the issue was because UpdateLayout was not being called. So, I manually called UpdateLayout after the items were set. Again, same result.

I also tried manually adding an item in to the ObservableCollection to try to wake up: same result.

I also tried in Chrome. Same result.

The problem is very easy to reproduce if you grab my sample.

[MelbourneDeveloper]

@ghuntley I switched my sample to a ComboBox so I could get it working. I've tagged the issue UnoIssue1362 so if you grab that commit, you will see the issue.

[carldebilly]

I tried the original report (with a ListView & tag UnoIssue1362) and I confirm I see the bug. I upgraded Uno.UI to latest stable version:

<!-- RestClient.Net.Samples.Uno.Wasm.csproj -->
<ItemGroup>
  <PackageReference Include="Newtonsoft.Json" Version="12.0.2" />
  <PackageReference Include="Uno.UI" Version="1.45.0" />
  <PackageReference Include="Uno.Wasm.Bootstrap" Version="1.0.0-dev.302" />
  <DotNetCliToolReference Include="Uno.Wasm.Bootstrap.Cli" Version="1.0.0-dev.302" />
</ItemGroup>

Reported problem solved.

But I'm not sure the @ghuntley's problem with SampleApps is related...

[MelbourneDeveloper]

@carldebilly , @ghuntley thanks for looking in to this. Unfortunately the problem is different with the latest version. The ListBox doesn't show up at all. I made the ListBox red to highlight the issue. You can see it in UWP, but not on Wasm (Firefox, Edge or Chrome).

Wasm (Firefox,Edge,Chrome):

UWP:

Please see the branch here . This has your NuGet upgrades in it.

[carldebilly]

Ok I'll reopen this issue.

[davidjohnoliver]

Currently the only code for ListBox is the autogenerated stub: https://github.com/unoplatform/uno/blob/master/src/Uno.UI/Generated/3.0.0.0/Windows.UI.Xaml.Controls/ListBox.cs

The control works 'in some fashion' because it inherits the functionality of ItemsControl and Selector. However the ctor will raise an error, there's no default style, etc.

GitHub

unoplatform/uno

Build Mobile, Desktop and WebAssembly apps with C# and XAML. Today. Open source and professionally supported. - unoplatform/uno

To implement this, an authored .cs file should be created with the members required, and the missing style added to https://github.com/unoplatform/uno/blob/master/src/Uno.UI/UI/Xaml/Style/Generic/Generic.xaml, with any adjustments needed (eg, we don't support VirtualizingStackPanel, ItemsStackPanel should probably be used instead).

[jeromelaban]

Comment from @michael-hawker on Discord, about the ease of use of ListBox when compared to ListView:

ListViewItem just encapsulates everything in the ListViewItemPresenter and if you use the expanded template it has a bunch of Borders and Rectangles and other behavior which are harder to style around. ListBox on the other hand is pretty bare-bones and is an easy starting point. Justin Liu gave this feedback to the platform team a while back too.

[michael-hawker]

FYI @JustinXinLiu can probably elaborate a bit more of the specifics better than I can. 🙂