FlyoutBase and DataContext

[SkyeHoefling]

WindowsAppSDK Version: 1.1.5
Uno.WinUI Version: 4.5.9

The Uno.WinUI implementation of FlyoutBase contains a DataContext where the WinUI implementation does not. I'm wondering if this is a bug, as we need to add special code for WinUI vs our Uno.WinUI target heads

According to the official documentation from WinUI the Flyout doesn't have a DataContext and it uses the one from the attached control. Consider you attach a Flyout to a Button, that Flyout will use the DataContext set on the Button.

<Button Content="Click Me!" DataContext={x:Bind FlyoutViewModel}">
  <Button.Flyout>
    <Flyout>
      <!-- omitted flyout implementation -->
    </Flyout>
  </Button.Flyout>
</Button>

You can see more examples on the WinUI documentation guidelines https://learn.microsoft.com/en-us/windows/apps/design/controls/dialogs-and-flyouts/flyouts. I have added them below as well

<!-- Assign the flyout to each element that shares it. -->
<StackPanel>
    <Image Source="Assets/cliff.jpg" Width="50" Height="50"
           Margin="10" Tapped="Image_Tapped"
           FlyoutBase.AttachedFlyout="{StaticResource ImagePreviewFlyout}"
           DataContext="{Binding RelativeSource={RelativeSource Mode=Self}}"/>
    <Image Source="Assets/grapes.jpg" Width="50" Height="50"
           Margin="10" Tapped="Image_Tapped"
           FlyoutBase.AttachedFlyout="{StaticResource ImagePreviewFlyout}"
           DataContext="{Binding RelativeSource={RelativeSource Mode=Self}}"/>
    <Image Source="Assets/rainier.jpg" Width="50" Height="50"
           Margin="10" Tapped="Image_Tapped"
           FlyoutBase.AttachedFlyout="{StaticResource ImagePreviewFlyout}"
           DataContext="{Binding RelativeSource={RelativeSource Mode=Self}}"/>
</StackPanel>

[jeromelaban]

Indeed, at present time, DataContext is a property of DependencyObject, making it also available on FlyoutBase.

Internally, that's pretty much how WinUI works, but the property is not exposed publicly. We may end up changing this at some point in the future to have better API alignment, but for now, since it's not breaking for most pieces of code, we'll keep it that way.

[SkyeHoefling]

Thanks for the explanation this helps