CommandBarFlyout keeps throwing a System.ArgumentException when trying to use as a ContextFlyout

1

When I try to use the code below. My debugger throws the exception of

System.ArgumentException HResult=0x80070057 Message=Value does not fall within the expected range. Source=Windows StackTrace: at Windows.UI.Xaml.Controls.Primitives.FlyoutBase.ShowAt(FrameworkElement placementTarget) at ProjectName.MainPage.TextBlock_ContextRequested(UIElement sender, ContextRequestedEventArgs args) in C:\Users\<\long path>\MainPage.xaml.cs:line 250

I have tried everything that I know how to do. I have tried setting the attached flyout and then trying to show the attached flyout like below. I have also tried putting the flyout inline with the textblock element. I even tried to just show the flyout on the main ListView element (thinking maybe it didn't like dynamic lists), but I still get the same error. Any help would be greatly appreciated.

FlyoutBase.SetAttachedFlyout((FrameworkElement)sender, AddDeviceFlyout);
FlyoutBase.ShowAttachedFlyout((FrameworkElement)sender);

Current Code

MainPage.xaml (a lot removed for brevity):

<Page.Resources>
    <ResourceDictionary>
        <CommandBarFlyout Placement="Auto" x:Name="AddDeviceFlyout">
            <AppBarButton x:Name="AddDevice" Label="Add Device" Icon="Add" Click="AddDevice_Click"/>
        </CommandBarFlyout>
    </ResourceDictionary>
</Page.Resources>
<ListView x:Name="ProcessList" SelectionMode="Single"
           ItemsSource="{x:Bind MyProcesses, Mode=OneWay}"
           HorizontalContentAlignment="Stretch"
           SelectionChanged="ProcessList_SelectionChanged">
 <ListView.ItemTemplate>
    <DataTemplate>
        <Grid Height="auto" HorizontalAlignment="Stretch">
            <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"/>
            <TextBlock 
              Margin="5,20" Height="50"
              FontSize="20"
              ContextRequested="TextBlock_ContextRequested"
              Text="{Binding ProcessName, Mode=OneWay}">
            </TextBlock>
        </Grid>
    </DataTemplate>
 </ListView.ItemTemplate>
</ListView>

MainPage.xaml.cs (C#):

private void TextBlock_ContextRequested(UIElement sender, Windows.UI.Xaml.Input.ContextRequestedEventArgs args)
{
    AddDeviceFlyout.ShowAt((FrameworkElement)sender); //This is line 250
}

Build Targeting:

Target version: Windows 10, version 1809 (10.0; Build 17763)

Min version: Windows 10, version 1809 (10.0; Build 17763)

c#
uwp-xaml
asked on Stack Overflow Mar 29, 2019 by Patrick Mcvay

1 Answer

1

You need to set the FlyoutBase.AttachedFlyout for the TextBlock and then call FlyoutBase.ShowAttachedFlyout method to show it.

Then, with my tests, if you set Placement="Auto", it will throw exception like you have posted.

As a workaround, please remove Placement="Auto" for CommandBarFlyout like the following:

<ListView x:Name="ProcessList" SelectionMode="Single"
       ItemsSource="{x:Bind MyProcesses, Mode=OneWay}"
       HorizontalContentAlignment="Stretch"
       SelectionChanged="ProcessList_SelectionChanged">
        <ListView.ItemTemplate>
            <DataTemplate>
                <Grid Height="auto" HorizontalAlignment="Stretch">
                    <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" />
                    <TextBlock
          Margin="5,20" Height="50"
          FontSize="20"
          ContextRequested="TextBlock_ContextRequested"
          Text="{Binding ProcessName, Mode=OneWay}">
                        <FlyoutBase.AttachedFlyout>
                            <CommandBarFlyout x:Name="AddDeviceFlyout">
                                <AppBarButton x:Name="AddDevice" Label="Add Device" Icon="Add" Click="AddDevice_Click" />
                            </CommandBarFlyout>
                        </FlyoutBase.AttachedFlyout>
                    </TextBlock>
                </Grid>
            </DataTemplate>
        </ListView.ItemTemplate>
    </ListView>
private void TextBlock_ContextRequested(UIElement sender, ContextRequestedEventArgs args)
{
    FlyoutBase.ShowAttachedFlyout(sender as FrameworkElement);
}
answered on Stack Overflow Apr 1, 2019 by Xavier Xie • edited Apr 1, 2019 by Xavier Xie

User contributions licensed under CC BY-SA 3.0