fix flyout-box disappearance trough actions

Question

This is the Scenario:

I have a text loaded on the screen and I have a button on the screen. When I click on the button a flyout box opens with a button in it.

My Problems now are:

I cant scroll down on the text. It seems like the flyout takes the complete Focus. How can I make it so I can scroll down and the flyout-box still being open?
The flyout box disappears on almost every Action. For example if I click back on the text. How can I set it up so the flyout box only disappears when I click on the button within the flyout box?

What I try to achieve:

Open my flyout box. Do Actions on/with the text without the disappearance of the flyoutbox. The flyoutbox should only disappear when I click the button in the flyoutbox.

        <Button x:Name="flyout" Style="{StaticResource AppBarButtonStyle}" Tapped="OnOptionItemTapped">
            <Image Source="Assets/images/icon_menu.png"/>
                <Button.Flyout>
                <Flyout x:Name="boxName">
                    <Grid>
                        <TextBlock Text="This is a flyout!"/>
                        <Button x:Name="closeOnClick">
                            <Image Source="Assets/images/annot_remove.png"/>
                        </Button>
                    </Grid>
                </Flyout>
            </Button.Flyout>
        </Button>

I imagine the Code for my second problem to look somehow like this:

if (name.Equals("closeOnClick"))

{

boxName.Hide();

}

axbeit · Answer 1 · 2018-07-27T13:25:55.267

I found a part of the solution. When I click on the button within the flyout-box my flyout-box disappears.

Now I only Need to know how I can do Actions like scroll in my text file while the flyout-box is still visible.

Part-Solution:

      <Button x:Name="flyout" Style="{StaticResource AppBarButtonStyle}" Tapped="OnOptionItemTapped">
            <Image Source="Assets/images/icon_menu.png"/>
                <Button.Flyout>
                <Flyout x:Name="boxName">
                    <Grid>
                        <TextBlock Text="This is a flyout!"/>
                        <Button Tapped="closeOnClick">
                            <Image Source="Assets/images/annot_remove.png"/>
                        </Button>
                    </Grid>
                </Flyout>
            </Button.Flyout>
        </Button>

and

public void closeOnClick(object sender, TappedRoutedEventArgs e)
{
    boxName.Hide();
}

fix flyout-box disappearance trough actions

1 Answers1