Xaml 设置弹出按钮的整页高度

Xaml 设置弹出按钮的整页高度,xaml,windows-8.1,Xaml,Windows 8.1,我想在页面的右侧显示弹出式面板,此面板必须具有页面的全部高度 下面是一个XAML: <Button Content="One" Grid.Column="0" Click="Button_Click_1" VerticalAlignment="Stretch" VerticalContentAlignment="Stretch" /> <Button x:Name="TestButton" Content="TestButton" Grid.Column="1" Vert

我想在页面的右侧显示弹出式面板,此面板必须具有页面的全部高度

下面是一个XAML:

<Button Content="One" Grid.Column="0" Click="Button_Click_1" VerticalAlignment="Stretch" VerticalContentAlignment="Stretch"  /> 

<Button x:Name="TestButton" Content="TestButton" Grid.Column="1" VerticalAlignment="Stretch" VerticalContentAlignment="Stretch">
    <Button.Flyout>
       <Flyout>
          <StackPanel x:Name="FlyoutPanel" Margin="0 0 0 0">
             <TextBlock>Some text</TextBlock>
             <Button Click="Button_Click">Press me</Button>
          </StackPanel>
       </Flyout>
    </Button.Flyout>
</Button>

<StackPanel x:Name="FlyoutPlacement" Grid.Column="2" Margin="0 0 0 0"/>

现在,我的弹出式面板有一个垂直滚动条,其大小小于页面大小。如何删除滚动条并将弹出式面板设置为整页大小?

您需要编辑默认的
FlyoutPresenterStyle

    <SolidColorBrush x:Key="FlyoutBackgroundThemeBrush" Color="#FF000000"/>
    <SolidColorBrush x:Key="FlyoutBorderThemeBrush" Color="#FFFFFFFF"/>

    <x:Double x:Key="FlyoutThemeMaxHeight">718</x:Double> <!-- Change to NaN -->
    <x:Double x:Key="FlyoutThemeMaxWidth">450</x:Double> <!-- Change to NaN -->
    <x:Double x:Key="FlyoutThemeMinHeight">54</x:Double>
    <x:Double x:Key="FlyoutThemeMinWidth">70</x:Double>
    <Thickness x:Key="FlyoutBorderThemeThickness">2</Thickness>
    <Thickness x:Key="FlyoutContentThemePadding">20,17,20,20</Thickness> <!-- Change to 0 -->

    <Style x:Key="FlyoutStyle" TargetType="FlyoutPresenter">
        <Setter Property="RequestedTheme" Value="Light" />
        <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
        <Setter Property="VerticalContentAlignment" Value="Stretch"/>
        <Setter Property="IsTabStop" Value="False"/>
        <Setter Property="Background" Value="{ThemeResource FlyoutBackgroundThemeBrush}"/>
        <Setter Property="BorderBrush" Value="{ThemeResource FlyoutBorderThemeBrush}"/>
        <Setter Property="BorderThickness" Value="{ThemeResource FlyoutBorderThemeThickness}"/>
        <Setter Property="Padding" Value="{ThemeResource FlyoutContentThemePadding}"/>
        <Setter Property="MinWidth" Value="{ThemeResource FlyoutThemeMinWidth}"/>
        <Setter Property="MaxWidth" Value="{ThemeResource FlyoutThemeMaxWidth}"/>
        <Setter Property="MinHeight" Value="{ThemeResource FlyoutThemeMinHeight}"/>
        <Setter Property="MaxHeight" Value="{ThemeResource FlyoutThemeMaxHeight}"/>
        <Setter Property="ScrollViewer.HorizontalScrollMode" Value="Auto" />
        <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto" />
        <Setter Property="ScrollViewer.VerticalScrollMode" Value="Auto" />
        <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto" /> <!-- Change to Hidden -->
        <Setter Property="ScrollViewer.ZoomMode" Value="Disabled" />
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="FlyoutPresenter">
                    <Border Background="{TemplateBinding Background}"
                    BorderBrush="{TemplateBinding BorderBrush}"
                    BorderThickness="{TemplateBinding BorderThickness}">
                        <ScrollViewer x:Name="ScrollViewer"
                    ZoomMode="{TemplateBinding ScrollViewer.ZoomMode}"
                    HorizontalScrollMode="{TemplateBinding ScrollViewer.HorizontalScrollMode}"
                    HorizontalScrollBarVisibility="{TemplateBinding ScrollViewer.HorizontalScrollBarVisibility}"
                    VerticalScrollMode="{TemplateBinding ScrollViewer.VerticalScrollMode}"
                    VerticalScrollBarVisibility="{TemplateBinding ScrollViewer.VerticalScrollBarVisibility}"
                    AutomationProperties.AccessibilityView="Raw">
                            <ContentPresenter Content="{TemplateBinding Content}"
                                      ContentTemplate="{TemplateBinding ContentTemplate}"
                                      ContentTransitions="{TemplateBinding ContentTransitions}"
                                      Margin="{TemplateBinding Padding}"
                                      HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                      VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
                        </ScrollViewer>
                    </Border>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
<Flyout FlyoutPresenterStyle="{StaticResource FlyoutStyle}">

另外,要隐藏垂直滚动条集,请编辑默认的FlyoutPresenterStyle

    <SolidColorBrush x:Key="FlyoutBackgroundThemeBrush" Color="#FF000000"/>
    <SolidColorBrush x:Key="FlyoutBorderThemeBrush" Color="#FFFFFFFF"/>

    <x:Double x:Key="FlyoutThemeMaxHeight">718</x:Double> <!-- Change to NaN -->
    <x:Double x:Key="FlyoutThemeMaxWidth">450</x:Double> <!-- Change to NaN -->
    <x:Double x:Key="FlyoutThemeMinHeight">54</x:Double>
    <x:Double x:Key="FlyoutThemeMinWidth">70</x:Double>
    <Thickness x:Key="FlyoutBorderThemeThickness">2</Thickness>
    <Thickness x:Key="FlyoutContentThemePadding">20,17,20,20</Thickness> <!-- Change to 0 -->

    <Style x:Key="FlyoutStyle" TargetType="FlyoutPresenter">
        <Setter Property="RequestedTheme" Value="Light" />
        <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
        <Setter Property="VerticalContentAlignment" Value="Stretch"/>
        <Setter Property="IsTabStop" Value="False"/>
        <Setter Property="Background" Value="{ThemeResource FlyoutBackgroundThemeBrush}"/>
        <Setter Property="BorderBrush" Value="{ThemeResource FlyoutBorderThemeBrush}"/>
        <Setter Property="BorderThickness" Value="{ThemeResource FlyoutBorderThemeThickness}"/>
        <Setter Property="Padding" Value="{ThemeResource FlyoutContentThemePadding}"/>
        <Setter Property="MinWidth" Value="{ThemeResource FlyoutThemeMinWidth}"/>
        <Setter Property="MaxWidth" Value="{ThemeResource FlyoutThemeMaxWidth}"/>
        <Setter Property="MinHeight" Value="{ThemeResource FlyoutThemeMinHeight}"/>
        <Setter Property="MaxHeight" Value="{ThemeResource FlyoutThemeMaxHeight}"/>
        <Setter Property="ScrollViewer.HorizontalScrollMode" Value="Auto" />
        <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto" />
        <Setter Property="ScrollViewer.VerticalScrollMode" Value="Auto" />
        <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto" /> <!-- Change to Hidden -->
        <Setter Property="ScrollViewer.ZoomMode" Value="Disabled" />
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="FlyoutPresenter">
                    <Border Background="{TemplateBinding Background}"
                    BorderBrush="{TemplateBinding BorderBrush}"
                    BorderThickness="{TemplateBinding BorderThickness}">
                        <ScrollViewer x:Name="ScrollViewer"
                    ZoomMode="{TemplateBinding ScrollViewer.ZoomMode}"
                    HorizontalScrollMode="{TemplateBinding ScrollViewer.HorizontalScrollMode}"
                    HorizontalScrollBarVisibility="{TemplateBinding ScrollViewer.HorizontalScrollBarVisibility}"
                    VerticalScrollMode="{TemplateBinding ScrollViewer.VerticalScrollMode}"
                    VerticalScrollBarVisibility="{TemplateBinding ScrollViewer.VerticalScrollBarVisibility}"
                    AutomationProperties.AccessibilityView="Raw">
                            <ContentPresenter Content="{TemplateBinding Content}"
                                      ContentTemplate="{TemplateBinding ContentTemplate}"
                                      ContentTransitions="{TemplateBinding ContentTransitions}"
                                      Margin="{TemplateBinding Padding}"
                                      HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                      VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
                        </ScrollViewer>
                    </Border>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
<Flyout FlyoutPresenterStyle="{StaticResource FlyoutStyle}">
另外,要隐藏垂直滚动条,请将ScrollViewer.VerticalScrollBarVisibility设置为隐藏