Блог

Я разработчик Android, пытающийся освоить разработку UWP, и застрял на этой простой необходимости. У меня есть 3 страницы, и я хочу сделать ProgressRing доступным для всех 3 страниц, поэтому, когда я выполняю асинхронную задачу, я могу открыть модальный ProgressRing. Я не хочу, чтобы на каждой странице был код ProgressRing. Как я могу этого добиться?

Я заглянул в класс ContentDialog, но для этого, похоже, требуется кнопка в пользовательском интерфейсе, и все, что я хочу показать, это сам ProgressRing без кнопки в центре моего окна

Класс всплывающего окна, похоже, должен быть частью самой страницы, поэтому я не могу разделить его на несколько страниц.

Класс Popup выглядит многообещающе, но он не модальный, и я не могу понять его документацию.

Может кто-нибудь порекомендовать класс или подход для меня? Как я могу просто наложить элемент управления поверх моей существующей страницы, в центре страницы без какого-либо другого пользовательского интерфейса, только один элемент управления, в моем случае ProgressRing?

Как я могу показать элемент управления ProgressRing ТОЛЬКО поверх / поверх моей текущей страницы?

Что касается вашего требования, похоже, вы хотите создать HUD для uwp. И вы могли бы использовать 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();
  

Возможные шаги:

1. Щелкните проект правой кнопкой мыши.
2. Добавить> Новый элемент> Пользовательский элемент управления
3. Внутри вашего CustomUserControl xaml вы можете добавить свой элемент управления ProgressRing, который нужно настроить только один раз. Чтобы использовать этот CustomUserControl на любой из ваших страниц.

Это довольно простой способ сделать это.

вы можете использовать UserControl и поместить этот пользовательский элемент управления в верхнюю часть вашего пользовательского интерфейса, сделав его видимым или свернутым в зависимости от вашей логики.

Если вы ищете хороший элемент управления для этого, вы можете рассмотреть возможность загрузки элемента управления Xaml из Community Toolkithttps://learn.microsoft.com/en-us/windows/communitytoolkit/controls/loading