Question

我是一个尝试学习UWP开发的Android开发人员，并且坚持这种简单的需求。我有3个页面，并且想让ProgressRing可供所有3个页面访问，所以当我执行异步任务时，可以弹出ProgressRing模态。我不想在每个页面中都有ProgressRing代码。我该怎么做？

我已经研究了ContentDialog类，但这似乎需要在UI中使用一个按钮，而我想显示的只是ProgressRing本身，而没有一个按钮居中显示在窗口中

Flyout类似乎需要作为页面本身的一部分，因此我无法在多个页面之间共享它。

Popup类看起来很有前途，但是它不是模态的，我无法理解它的文档。

有人可以为我推荐课程或方法吗？我如何才能将控件覆盖在现有页面顶部的页面中心，而没有其他UI只是单个控件，在我的情况下是ProgressRing？

Answer 1

如何仅在当前页面的顶部/上方显示一个ProgressRing控件？

根据您的要求，您似乎想要为uwp制作HUD。您可以使用Popup类来进行处理。 Popup是用于在现有内容之上托管UIElement的通用容器。因此，您可以使用UserControl创建一个ProgressRing并将Popup用作主机容器。

背后的代码

public sealed partial class UWPHUDControl : UserControl
{
    Popup popup;
    public UWPHUDControl()
    {
        this.InitializeComponent();                  
    }

    public  UWPHUDControl(string message)
    {
        this.InitializeComponent();
        SystemNavigationManager.GetForCurrentView().BackRequested += UWPHUD_BackRequested;
        Window.Current.CoreWindow.SizeChanged += CoreWindow_SizeChanged;
        msg_Txt.Text = message;
    }

    private void CoreWindow_SizeChanged(CoreWindow sender, WindowSizeChangedEventArgs args)
    {
        UpdateUI();
    }

    private void UWPHUD_BackRequested(object sender, BackRequestedEventArgs e)
    {
        Close();

    }
    private void UpdateUI()
    {

        var bounds = Window.Current.Bounds;
        this.Width = bounds.Width;
        this.Height = bounds.Height;
    }

    public void Show()
    {       
        popup = new Popup();
        popup.Child = this;   
        progress_R.IsActive = true;       
        popup.IsOpen = true;
        UpdateUI();
    }



    public void Close()
    {
        if (popup.IsOpen)
        {
            progress_R.IsActive = false;
            popup.IsOpen = false;
            SystemNavigationManager.GetForCurrentView().BackRequested -= UWPHUD_BackRequested;
            Window.Current.CoreWindow.SizeChanged -= CoreWindow_SizeChanged;
        }
    }
}

Xaml

<Grid Name="mask_grid" Background="{ThemeResource SystemControlAccentAcrylicWindowAccentMediumHighBrush}" Opacity="0.35">
    <StackPanel
        HorizontalAlignment="Center"
        VerticalAlignment="Center"
        Orientation="Horizontal"
        >
        <ProgressRing
            Name="progress_R"
            Width="50"
            Height="50"
            />
        <TextBlock
            Name="msg_Txt"
            Margin="10,0,0,0"
            VerticalAlignment="Center"
            FontSize="12"
            Foreground="Azure"
            TextAlignment="Center"
            />
    </StackPanel>

</Grid>

用法

UWPHUDControl hud = new UWPHUDControl("Loading");
hud.Show();
await Task.Delay(2000);
hud.Close();

Answer 2

可能的步骤：

右键单击该项目。
添加>新建项目>用户控件
在CustomUserControl xaml中，您可以添加ProgressRing控件，该控件仅需要自定义一次。要在您的任何页面上使用此CustomUserControl。

这是一种非常基本的方法。

Answer 3

您可以使用UserControl并将此用户控件放在UI的顶部，以根据您的逻辑将其显示或折叠。

如果您正在寻找一个好的控制方法，可以考虑从社区工具包加载Xaml控件 https://docs.microsoft.com/en-us/windows/communitytoolkit/controls/loading

如何仅在当前页面的上方/上方显示一个ProgressRing控件？

3 个答案:

可能的步骤：