StaggeredPanel, WrapPanel samples in gallery crash under Windows App SDK

[Arlodotexe]

Describe the bug

When running the gallery with the Wasdk head on the latest main commit, the 'StaggeredPanel' and 'WrapPanel' samples will crash the app with the same error message and stack trace:

Exception message:

System.Runtime.InteropServices.COMException

Stack trace:

   at WinRT.ExceptionHelpers.<ThrowExceptionForHR>g__Throw|38_0(Int32 hr)
   at ABI.Microsoft.UI.Xaml.IFrameworkElementOverridesMethods.MeasureOverride(IObjectReference _obj, Size availableSize)
   at Microsoft.UI.Xaml.FrameworkElement.MeasureOverride(Size availableSize)
   at Microsoft.UI.Xaml.FrameworkElement.Microsoft.UI.Xaml.IFrameworkElementOverrides.MeasureOverride(Size availableSize)
   at ABI.Microsoft.UI.Xaml.IFrameworkElementOverrides.Do_Abi_MeasureOverride_0(IntPtr thisPtr, Size availableSize, Size* result)

This behavior is not present when running the gallery under UWP.

Steps to reproduce

1. Clone the repo
2. Generate the gallery solution, include the Primitives component and the wasdk multitarget/head.
3. Build and deploy the wasdk gallery 
4. Navigate to the 'StaggeredPanel' or 'WrapPanel' sample page and observe crash.

Expected behavior

No crash

Screenshots

No response

Code Platform

• UWP
• WinAppSDK / WinUI 3
• Web Assembly (WASM)
• Android
• iOS
• MacOS
• Linux / GTK

Windows Build Number

• Windows 10 1809 (Build 17763)
• Windows 10 1903 (Build 18362)
• Windows 10 1909 (Build 18363)
• Windows 10 2004 (Build 19041)
• Windows 10 20H2 (Build 19042)
• Windows 10 21H1 (Build 19043)
• Windows 10 21H2 (Build 19044)
• Windows 10 22H2 (Build 19045)
• Windows 11 21H2 (Build 22000)
• Other (specify)

Other Windows Build number

No response

App minimum and target SDK version

• Windows 10, version 1809 (Build 17763)
• Windows 10, version 1903 (Build 18362)
• Windows 10, version 1909 (Build 18363)
• Windows 10, version 2004 (Build 19041)
• Windows 10, version 2104 (Build 20348)
• Windows 11, version 22H2 (Build 22000)
• Other (specify)

Other SDK version

No response

Visual Studio Version

No response

Visual Studio Build Number

No response

Device form factor

No response

Additional context

No response

Help us help you

Yes, I'd like to be assigned to work on this item.

[Arlodotexe]

Has the same error message as #509

[michael-hawker]

@Arlodotexe is this specific to AOT or just updating from 1.5 to 1.6? If the later, then it seems like it'd be a regression in the SDK, as I don't think we've modified this code between releases, eh?

[Arlodotexe]

WrapPanel and StaggeredPanel seem to work fine under WindowsAppSDK 1.6 with AoT disabled:

[Arlodotexe]

Additional information pulled from the unhandled exception:

[Arlodotexe]

This code is currently using:

Windows/components/Primitives/samples/StaggeredPanelSample.xaml

Lines 42 to 44 in 665ba24

	<controls:StaggeredPanel ColumnSpacing="{Binding ColumnSpacing, ElementName=ThisSamplePage, Mode=OneWay}"
	DesiredColumnWidth="{Binding DesiredColumnWidth, ElementName=ThisSamplePage, Mode=OneWay}"
	RowSpacing="{Binding RowSpacing, ElementName=ThisSamplePage, Mode=OneWay}" />

Removing the binding on the ItemsPanelTemplate fixes the issue:

Unfortunately, we're not able to use x:Bind here, as any usage results in:

1>StaggeredPanelSample.xaml(42,22): XamlCompiler error WMC1111: DataTemplates containing x:Bind need a DataType to be specified using 'x:DataType'
1>Done building project "Primitives.Samples.csproj" -- FAILED.

Neither a DataTemplate nor its accompanying x:DataType can be added here since ItemsPanelTemplate is already a template and must have a first child of type Panel.

Looking through documentation for 'official' examples of binding properties on an ItemsPanelTemplate, I'm not finding any where these properties are bound, not using {Binding}, {x:Bind} or {TemplateBinding}.

{Binding} worked for us before, but it's not AoT safe. What is the recommended approach here?

[michael-hawker]

@Arlodotexe yeah, this is a gap with ItemsPanelTemplate. In most cases you set this without binding, we're doing something different with the sample system here (though in some of my projects I've occasionally also used Binding here).

There's not an issue for this filed in the WinUI repo (that I could find), we should probably bubble this up there for tracking at least for AoT and x:Bind improvements.

Though it is also highly related/dependent/tied to microsoft/microsoft-ui-xaml#2508 as well; as in this case you'd never have a DataType/item like a traditional DataTemplate, the context here is still the main context of the parent control/page even though it's a "DataTemplate" for the panel... so it should be breaking out to the outer context for looking for what would make sense to bind to (just as if you were trying to bind a command of your ViewModel to an inner item template, which is broken still today 😢).

[Arlodotexe]

Filed an issue microsoft/microsoft-ui-xaml#10070

[michael-hawker]

I'm seeing a different issue now with both StaggeredPanel and StaggeredLayout where it won't assign the binding to ItemsSource in the sample page:

With an ArgumentException value does not fall in expected range.

[michael-hawker]

StaggeredLayout may be good with update to CsWinRT 2.1.6, though 2.2 provides better error message (but we can't use it yet).

StaggeredPanel and SwitchPresenter #516 are more likely due to us still using {Binding} in those samples.