CODEWITHSUNDEEP
uwpuwp-xaml
ArthurCPPCLI
ArthurCPPCLI

Reputation: 1082

Conditional display of flyout in Button

In a UWP i have a Button with a Flyout :

<Button Content="My button" Command="{Binding MyCommand}">
    <Button.Flyout>
        <Flyout>This a a flyout popup</Flyout>
    </Button.Flyout>
</Button>

I'm using MVVM pattern and i want to show the flyout only if a ViewModel's property is set to True. I tried this article : Using Windows 8.1 Flyout control with MVVM

My goal is : if Property MyProperty of the ViewModel is True then i don't display the flyout and i execute the command but if MyProperty is equal to false, so i just display the flyout.

The problem is : the flyout always display AFTER the command executed (or click event whatever).

I was wondering if there was a solution to this.

Thanks in advance,

Regards

Upvotes: 1

Views: 478

Answers (1)

Thomas Schneiter
Thomas Schneiter

Reputation: 1153

You can define your Flyout as a Button Resource

<Button x:Name="MyButton" Content="Button" Tapped="Button_Tapped" >
    <Button.Resources>
        <Flyout x:Name="MyFlyout">
            ....
        </Flyout>
    </Button.Resources>
</Button>

This way you have to open the Flyout yourself, but you can define when to open it.

private void Button_Tapped(object sender, TappedRoutedEventArgs e)
{
    var button = sender as Button;

    if (button != null && ......)
    {
        MyFlyout.ShowAt(button);
    }
}

Upvotes: 1

Related Questions