简体   繁体   中英

Change height and width of Flyout in UWP app

I am using a Flyout element in my UWP app as:

<Flyout Placement="Full"/>

This opens the flyout in the centre of the app as desired. But I am unable to change the height and width of the flyout. How can this be done?

XAML equivalent to the accepted answer.
(Note: OP posted a Flyout - not a MenuFlyout):

 <Flyout> ... <Flyout.FlyoutPresenterStyle> <Style TargetType="FlyoutPresenter"> <Setter Property="MinWidth" Value="200" /> <Setter Property="MinHeight" Value="200" /> </Style> </Flyout.FlyoutPresenterStyle> ... </Flyout>

Something like the below code should work for what you need.

private void Flyout_Opened(object sender, object e)
{         
    Flyout f = sender as Flyout;
    Style s = new Windows.UI.Xaml.Style { TargetType = typeof(FlyoutPresenter) };
    s.Setters.Add(new Setter(MinHeightProperty, "200"));        
    s.Setters.Add(new Setter(MinWidthProperty, "200"));
    f.FlyoutPresenterStyle = s;
}

I want to add, that even if you resize the flyout, the content will be placed in a horizontal scrollviewer. This means, if you place a TextBox inside, it will enlarge infinitely depending on its content. The problem is also described on microsoft forums .

In order to fix, you can add:

<Flyout.FlyoutPresenterStyle>
    <!--Disable infinite flyout width-->
    <Style TargetType="FlyoutPresenter">
        <Setter Property="ScrollViewer.HorizontalScrollMode" Value="Disabled" />
        <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Disabled" />
    </Style>
</Flyout.FlyoutPresenterStyle>

This does not work with properties directly set to the Flyout for some reason .

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM