Partilhar via


Mostrar várias janelas para o seu aplicativo

Na sua aplicação WinUI 3, pode mostrar o conteúdo da aplicação em janelas secundárias enquanto continua a trabalhar na mesma thread da interface de utilizador em cada janela.

O aplicativo WinUI 3 Gallery inclui exemplos interativos da maioria dos controles, recursos e funcionalidades do WinUI 3. Obtenha o aplicativo no da Microsoft Store ou obtenha o código-fonte em do GitHub

Sugestão

Uma razão comum para usar várias janelas é permitir que as guias TabView sejam separadas em uma nova janela. Para obter informações e exemplos específicos para esse cenário, consulte Separação de tabulação no artigo Modo de exibição de guia .

Visão geral da API

Aqui estão algumas das APIs importantes que você usa para mostrar conteúdo em várias janelas.

XAML Window e AppWindow

As Window classes e AppWindow podem ser usadas para exibir uma parte de um aplicativo em uma janela secundária. Um recurso importante das janelas WinUI é que cada instância compartilha o mesmo thread de processamento da interface do usuário (incluindo o dispatcher de eventos) a partir do qual foram criadas, o que simplifica os aplicativos de várias janelas.

Consulte Visão geral de janelas para WinUI e Windows App SDK para obter uma explicação mais detalhada de Window e AppWindow.

AppWindowPresenter

A API AppWindowPresenter permite alternar facilmente janelas para configurações predefinidas, como FullScreen ou CompactOverlay. Para mais informações, consulte Gerir janelas de apps.

XamlRoot

A classe XamlRoot contém uma árvore de elementos XAML, conecta-a ao objeto host da janela e fornece informações como tamanho e visibilidade. Você não cria um objeto XamlRoot diretamente. Em vez disso, um é criado quando um elemento XAML é anexado a um Window. Em seguida, você pode usar a propriedade UIElement.XamlRoot para recuperar a XamlRoot.

WindowId

WindowId é um identificador exclusivo para uma janela de aplicativo. Criado automaticamente, identifica tanto o AppWindow como o HWND Win32 de nível superior ao qual está associado.

A partir de um elemento visual, você pode acessar UIElement.XamlRoot; em seguida, XamlRoot.ContentIslandEnvironment; em seguida, a propriedade ContentIslandEnvironment.AppWindowId contém a ID da janela em que o UIElement está.

Mostrar uma nova janela

Você pode criar um novo Window em XAML ou em código. Se você criar um Window em XAML, na verdade estará criando uma subclasse da Window classe. Por exemplo, veja MainWindow.xaml que é criado pelo modelo de aplicativo do Visual Studio.

Vamos dar uma olhada nas etapas para mostrar o conteúdo em uma nova janela.

Para criar uma nova janela com XAML

  1. No painel Gerenciador de Soluções , clique com o botão direito do mouse no nome do projeto e selecione Adicionar > Novo Item...
  2. Na caixa de diálogo Adicionar Novo Item , selecione WinUI na lista de modelos no lado esquerdo da janela.
  3. Selecione o Modelo Em branco Window.
  4. Dê o nome ao ficheiro.
  5. Pressione Adicionar.

Para mostrar uma nova janela

  1. Instancie uma nova instância de Window, ou uma subclasse de Window se tiveres criado uma subclasse de Window com um .xaml arquivo.

    Window newWindow = new Window();
    
  2. Crie o conteúdo da janela.

    Se você criou uma Window subclasse com um .xaml arquivo, poderá adicionar o conteúdo da janela diretamente em XAML. Caso contrário, você adiciona o conteúdo no código, conforme mostrado aqui.

    É comum criar um XAML Framee, em seguida, navegar até um XAML [Frame](/windows/windows-app-sdk/api/winrt/microsoft.ui.xaml.controls.page onde você definiu o Page conteúdo do aplicativo. Para mais informações sobre quadros e páginas, veja Navegação par-a-par entre duas páginas.

    Frame contentFrame = new Frame();
    contentFrame.Navigate(typeof(SecondaryPage));
    

    No entanto, pode-se mostrar qualquer conteúdo XAML no AppWindow, não apenas um Frame e Page. Por exemplo, você pode mostrar apenas um único controle, como o ColorPicker, conforme mostrado mais tarde.

  3. Defina seu conteúdo XAML como a propriedade Content do Window.

    newWindow.Content = contentFrame;
    
  4. Ligue para o Window. Ativar método para mostrar a nova janela.

    newWindow.Activate();
    

Rastreie instâncias de Window

Talvez tu queiras ter acesso às Window instâncias de outras partes da tua aplicação, mas depois de criares uma instância de um Window, não há como aceder a ela a partir de outras partes do código, a menos que mantenhas uma referência a ela. Por exemplo, talvez você queira manipular o Windowarquivo . SizeChanged para MainPage reorganizar os elementos da interface do usuário quando a janela é redimensionada, ou você pode ter um botão 'fechar tudo' que fecha todas as instâncias controladas do Window.

Nesse caso, tu deves usar o WindowId identificador exclusivo para monitorizar as instâncias da janela num Dictionary, com o WindowId como o Key e a Window instância como o Value. (As APIs de eliminação de guias TabView também são usadas WindowId para rastrear o Windows.)

Na sua App classe, crie a Dictionary como uma propriedade estática. Em seguida, adicione cada página ao Dictionary quando a criar e remova-a quando a página for fechada.

// App.xaml.cs
public partial class App : Application
{
    private Window? _window;
    public static Dictionary<WindowId, Window> ActiveWindows { get; set; } = new Dictionary<WindowId, Window>();

    // ...

    protected override void OnLaunched(Microsoft.UI.Xaml.LaunchActivatedEventArgs args)
    {
        _window = new MainWindow();
        _window.Activate();
        // Track the new window in the dictionary.
        ActiveWindows.Add(_window.AppWindow.Id, _window);
    }
}

O código a seguir cria uma nova janela quando um botão é clicado em MainPage. O TrackWindow método adiciona a nova janela ao ActiveWindowsDictionary, e manipula o Window. Evento fechado para removê-lo de ActiveWindows quando a janela é fechada.

// MainPage.xaml.cs
private Window CreateWindow()
{
    Window newWindow = new Window();

    // Configure the window.
    newWindow.AppWindow.Resize(new SizeInt32(1200, 800));
    newWindow.Title = "Window " + newWindow.AppWindow.Id.Value.ToString();
    newWindow.SystemBackdrop = new MicaBackdrop();

    TrackWindow(newWindow);
    return newWindow;
}

private void TrackWindow(Window window)
{
    window.Closed += (sender, args) => {
        App.ActiveWindows.Remove(window.AppWindow.Id, out window);
    };
    App.ActiveWindows.Add(window.AppWindow.Id, window);
}

Obter uma janela monitorizada a partir do código da sua aplicação

Para aceder a uma instância Window do código da sua aplicação, precisa obter a WindowId para a janela atual para recuperá-la a partir da Dictionary estática na sua classe App. Você deve fazer isso no manipulador de eventos Loaded da página em vez de no construtor para que XamlRoot não nullseja .

public sealed partial class SecondaryPage : Page
{
    Window window;

    public SecondaryPage()
    {
        InitializeComponent();
        Loaded += AppWindowPage_Loaded;
    }

    private void AppWindowPage_Loaded(object sender, RoutedEventArgs e)
    {
        // Get the reference to this Window that was stored when it was created.
        // Do this in the Page Loaded handler rather than the constructor to
        // ensure that the XamlRoot is created and attached to the Window.
        WindowId windowId = this.XamlRoot.ContentIslandEnvironment.AppWindowId;

        if (App.ActiveWindows.ContainsKey(windowId))
        {
            window = App.ActiveWindows[windowId];
        }
    }
}