`SplitButton` flyout is not honoring the `Flyout.Placement` property

[vgromfeld]

Describe the bug

The Flyout attached to a SplitButton is always opening with a BottomEdgeAlignedLeft placement.
We don't have any way to use a different placement (like Bottom to have the Flyout being centered).

Why is this important?

In our application, we are using both split buttons and regular buttons to show some flyouts.
We'd like to have all our flyouts to be Bottom aligned for visual consistency.

Steps to reproduce the bug

Use the following XAML:

<SplitButton Content="Click me">
    <SplitButton.Flyout>
        <MenuFlyout Placement="Bottom">
            <MenuFlyoutItem Text="Menu item 1 -- do something useless">
                <MenuFlyoutItem.Icon>
                    <SymbolIcon Symbol="Accept" />
                </MenuFlyoutItem.Icon>
            </MenuFlyoutItem>
            <MenuFlyoutItem Text="Menu item 2 -- do something useless">
                <MenuFlyoutItem.Icon>
                    <SymbolIcon Symbol="Accept" />
                </MenuFlyoutItem.Icon>
            </MenuFlyoutItem>
            <MenuFlyoutItem Text="Menu item 3 -- do something useless">
                <MenuFlyoutItem.Icon>
                    <SymbolIcon Symbol="Accept" />
                </MenuFlyoutItem.Icon>
            </MenuFlyoutItem>
        </MenuFlyout>
    </SplitButton.Flyout>
</SplitButton>

Actual behavior

The Flyout is always left aligned with the SplitButton:

Expected behavior

The Flyout should use the Flyout.Placement property if set by the user.
When using Placement="Bottom" we're expecting the following layout:

Screenshots

No response

NuGet package version

WinUI 3 - Windows App SDK 1.8.5: 1.8.260209005

Windows version

No response

Additional context

No response

[castorix]

In similar threads,
#2797
#8560
@ranjeshj said it is intentional..

[castorix]

Or by naming your MenuFlyout : x:Name="mf1" , and SplitButton : x:Name="sb1"
this test seems to work on Windows 10 and Windows App SDK 1.7.250401001 :

mf1.Opening += (s, e) =>
 {
     if (!bShown)
     {
         bShown = true;
         mf1.ShowAt(sb1, new FlyoutShowOptions
         {
             Placement = FlyoutPlacementMode.Bottom
         });                    
     }               
 };

 mf1.Opened += (s, e) =>
 {
     bShown = false;
 };

with :

bool bShown = false;

[vgromfeld]

#2797 was occurring with the WinUI2 SplitButton and has been fixed with #2806. We should get the same behavior with WinUI 3

[vgromfeld]

The hardcoded behavior is in SplitButton.cpp#221

void SplitButton::OpenFlyout()
{
    if (auto flyout = Flyout())
    {
        winrt::FlyoutShowOptions options{};
        options.Placement(winrt::FlyoutPlacementMode::BottomEdgeAlignedLeft);
        flyout.ShowAt(*this, options);
    }
}