CODEWITHSUNDEEP
c#.netwindowsuwp
Archana
Archana

Reputation: 105

How to get a flyout on a button click where the button is in another flyout in uwp

I am using flyout control in my uwp app. I want to display a flyout on a button click and that button is in another flyout. I want the GUI like this in image.

The GUI I need is

Can anyone help me?

Upvotes: 3

Views: 3876

Answers (1)

Jayden
Jayden

Reputation: 3286

A single object element that declares the content. This must be an object that has UIElement in its hierarchy (plain strings don't work). This can be a container, such as a Panel derived class, so that multiple content items within the Flyout can be arranged in layout.

For more info, see Flyout class.

So we can add another Button to the content of the Flyout.

Also we can use FlyoutPlacementMode enumeration set to the FlyoutBase.Placement to set the location of the flyout is above the target element.

For example:

<Button Name="MyButton" VerticalAlignment="Center" HorizontalAlignment="Center"
Content="Open flyout">
<Button.Flyout>
    <Flyout Placement="Right">
        <Grid Width="300" Height="300">
            <Grid.RowDefinitions>
                <RowDefinition  Height="*" />
                <RowDefinition  Height="*" />
                <RowDefinition  Height="*" />
                <RowDefinition  Height="*" />
                <RowDefinition  Height="*" />
            </Grid.RowDefinitions>
            <Button  Grid.Row="0" Content="Open second flyout">
                <Button.Flyout>
                    <Flyout Placement="Left">
                        <Grid Width="300" Height="300">
                            <TextBlock TextWrapping="Wrap" Text="This is some text in a flyout." />
                        </Grid>
                    </Flyout>
                </Button.Flyout>
            </Button>
        </Grid>
    </Flyout>
</Button.Flyout>

If you want to show a menu of items, please try to use MenuFlyout control. For more info, including XAML and code examples, see Quickstart: Adding a MenuFlyout.

Upvotes: 3

Related Questions