底部弹出按钮放置 Windows Phone

Question

我想将 Flyout 放在页面底部。所以我就这样创建了它。

<Grid x:Name="ExampleRoot">

    <Grid HorizontalAlignment="Center"
              VerticalAlignment="Top">
        <Image Source="{Binding Path=CurrentPage}" 
                           Stretch="Uniform"                               ContinuumNavigationTransitionInfo.IsEntranceElement="True"
                           />
    </Grid>


    <FlyoutBase.AttachedFlyout>

        <PickerFlyout Placement="Bottom" > <!-- Here I set my Placement --->
            <StackPanel>
                <TextBlock Style="{ThemeResource TitleTextBlockStyle}" Text="{Binding Path=DocumentPageCounterDescription, Mode=OneWay, UpdateSourceTrigger=PropertyChanged}" />
                <TextBlock Style="{ThemeResource TitleTextBlockStyle}" Text="{Binding Path=SelectedAnnotation.Description, Mode=OneWay, UpdateSourceTrigger=PropertyChanged}" TextWrapping="Wrap" />
            </StackPanel>
        </PickerFlyout>
    </FlyoutBase.AttachedFlyout>

</Grid>

然后在code behind

中这样打开

    private void SomePropertyChanged(DependencyPropertyChangedEventArgs e)
    {
        ViewModel selected = e.NewValue as ViewModel;
        FlyoutBase fly = FlyoutBase.GetAttachedFlyout(this.LayoutRoot);
        fly.ShowAt(this.LayoutRoot);
    }

但它每次都在我页面的顶部打开。例如，我可以将其设置为 FlyoutPlacementMode.Full，并且它按预期方式工作。

我把它附在完整的页面上试了一下，结果是一样的。那么如何让它在我的页面底部打开？

//// 编辑

我找到了 following answer，但这对我不起作用！我不想通过按钮打开它！

它以我想要的方式使用 MenuFlyout，但我想要一个 PickerFlyout。

描述了其他展示位置在 Flyout 上不起作用。有什么想法吗？

Answer 1

好的我解决了！

我想在其中显示文本/信息，所以 MenuFlyout 对我来说没有选择。 PickerFlyout 无法修改，所以我选择了普通的。

正如我提到的，除了 MenuFlyout 之外，底部没有 Flyout 的工作位置。这就是我所做的。

        <FlyoutBase.AttachedFlyout>
            <Flyout Placement="Full">

                <StackPanel Background="{ThemeResource FlyoutBackgroundThemeBrush}" >
                    <StackPanel Margin="5,0">
                        <TextBlock Style="{ThemeResource TitleTextBlockStyle}" Text="Some Title Example" />
                        <TextBlock Style="{ThemeResource TitleTextBlockStyle}" Text="Some Information Example" TextWrapping="Wrap" />
                    </StackPanel>
                </StackPanel>

                <Flyout.FlyoutPresenterStyle>
                    <Style TargetType="FlyoutPresenter">
                        <Setter Property="Background" Value="Transparent" />
                        <Setter Property="VerticalContentAlignment" Value="Bottom" />
                        <Setter Property="HorizontalContentAlignment" Value="Stretch" />
                    </Style>
                </Flyout.FlyoutPresenterStyle>

            </Flyout>
        </FlyoutBase.AttachedFlyout>
    </Grid>

我将 PlacementMode 设置为 Full 并应用了不可见的背景。现在只有外部 Stackpanel 显示背景。这样感觉就很真实了PlacementMode.Bottom.

Answer 2

不幸的是，Windows Phone RT 应用程序仅支持您已经建立的完全或顶部放置的弹出窗口。但是，可以按照您的要求进行操作。

本文可能对您有用：Flyout on Windows Phone 8.1 Runtime

底部弹出按钮放置 Windows Phone

Flyout Placement Bottom Windows Phone

windows

xaml

windows-phone