Udostępnij przez


Pokaż wiele okien dla aplikacji

W aplikacji WinUI 3 możesz wyświetlać zawartość aplikacji w oknach pomocniczych, nadal pracując nad tym samym wątkiem interfejsu użytkownika w każdym oknie.

Aplikacja Galeria WinUI 3 zawiera interaktywne przykłady większości kontrolek, funkcji i funkcji interfejsu WinUI 3. Pobierz aplikację ze Sklepu Microsoft lub pobierz kod źródłowy w witrynie GitHub

Wskazówka

Typowym powodem korzystania z wielu okien jest zezwolenie na rozdanie kart TabView w nowym oknie. Aby uzyskać informacje i przykłady specyficzne dla tego scenariusza, zobacz Tab tear-out w artykule Widok tabulacji .

Przegląd interfejsu API

Poniżej przedstawiono niektóre ważne interfejsy API używane do wyświetlania zawartości w wielu oknach.

XAML Window i AppWindow

Klasy Window i AppWindow mogą służyć do wyświetlania części aplikacji w oknie pomocniczym. Ważną cechą okien WinUI jest to, że każda instancja korzysta z tego samego wątku przetwarzania interfejsu użytkownika (w tym dyspozytor zdarzeń), na którym je utworzono, co upraszcza działanie aplikacji wielookienkowych.

Zobacz Omówienie obsługi okien dla platform WinUI i Windows App SDK, aby uzyskać bardziej szczegółowe wyjaśnienie elementów Window i AppWindow.

AppWindowPresenter

Interfejs API AppWindowPresenter umożliwia łatwe przełączanie okien do wstępnie zdefiniowanych konfiguracji, takich jak FullScreen lub CompactOverlay. Aby uzyskać więcej informacji, zobacz Zarządzanie oknami aplikacji.

XamlRoot

Klasa XamlRoot zawiera drzewo elementów XAML , łączy je z obiektem hosta okna i udostępnia informacje, takie jak rozmiar i widoczność. Nie tworzysz obiektu XamlRoot bezpośrednio. Zamiast tego, jest tworzony, gdy dołączasz element XAML do elementu Window. Następnie możesz użyć właściwości UIElement.XamlRoot , aby pobrać plik XamlRoot.

WindowId

WindowId jest unikatowym identyfikatorem okna aplikacji. Jest on tworzony automatycznie i identyfikuje zarówno plik HWND najwyższego poziomu, z AppWindow którą jest skojarzony.

Z poziomu elementu wizualizacji można uzyskać dostęp do elementu UIElement.XamlRoot; następnie XamlRoot.ContentIslandEnvironment; następnie właściwość ContentIslandEnvironment.AppWindowId zawiera identyfikator okna, w którym znajduje się element UIElement.

Pokaż nowe okno

Możesz utworzyć nowy Window w XAML lub w kodzie. Jeśli tworzysz element Window w języku XAML, faktycznie tworzysz podklasę Window klasy . Na przykład, zobacz MainWindow.xaml, który został utworzony przez szablon aplikacji programu Visual Studio.

Przyjrzyjmy się krokom wyświetlania zawartości w nowym oknie.

Aby utworzyć nowe okno za pomocą języka XAML

  1. W okienku Eksplorator rozwiązań kliknij prawym przyciskiem myszy nazwę projektu i wybierz polecenie Dodaj > nowy element...
  2. W oknie dialogowym Dodawanie nowego elementu wybierz pozycję WinUI na liście szablonów po lewej stronie okna.
  3. Wybierz pusty Window szablon.
  4. Nazwij plik .
  5. Naciśnij przycisk Dodaj.

Aby wyświetlić nowe okno

  1. Utwórz nowe wystąpienie klasy Window lub podklasę Window, jeśli utworzyłeś podklasę Window za pomocą pliku .xaml.

    Window newWindow = new Window();
    
  2. Utwórz zawartość okna.

    Jeśli utworzono podklasę Window z plikiem .xaml , możesz dodać zawartość okna bezpośrednio w języku XAML. W przeciwnym razie należy dodać zawartość w kodzie, jak pokazano tutaj.

    Często należy utworzyć obiekt XAML Frame, a następnie przejść do Frame strony XAML [Page](/windows/windows-app-sdk/api/winrt/microsoft.ui.xaml.controls.page) gdzie zdefiniowano zawartość aplikacji. Aby uzyskać więcej informacji na temat ramek i stron, zobacz sekcję o nawigacji między dwiema stronami typu peer-to-peer.

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

    Można jednak wyświetlić dowolną zawartość XAML w AppWindow, nie tylko Frame i Page. Na przykład możesz wyświetlić tylko jedną kontrolkę, na przykład ColorPicker, jak pokazano później.

  3. Ustaw zawartość XAML na właściwość Content obiektu Window.

    newWindow.Content = contentFrame;
    
  4. Wywołaj metodę Window. Aktywuj metodę, aby wyświetlić nowe okno.

    newWindow.Activate();
    

Śledzenie wystąpień Window

Możesz chcieć mieć dostęp do instancji Window z innych części aplikacji, ale po utworzeniu instancji obiektu Window nie ma możliwości dostępu do niej z innej części kodu, chyba że zachowasz do niej odwołanie. Na przykład możesz chcieć obsłużyć element Window. Zdarzenie SizeChanged w pliku w MainPage celu zmiany kolejności elementów interfejsu użytkownika po zmianie rozmiaru okna lub może mieć przycisk "Zamknij wszystko", który zamyka wszystkie śledzone wystąpienia Windowprogramu .

W takim przypadku należy użyć unikatowego identyfikatora WindowId do śledzenia wystąpień okien w Dictionary, przy czym WindowId jako Key oraz wystąpienie Window jako Value. (Interfejsy API łzawiące tabView używają WindowId również do śledzenia systemu Windows).

W swojej klasie utwórz właściwość App jako statyczną. Następnie dodaj każdą stronę do Dictionary obiektu podczas jego tworzenia i usuń ją po zamknięciu strony.

// 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);
    }
}

Poniższy kod tworzy nowe okno po kliknięciu przycisku w pliku MainPage. Metoda TrackWindow dodaje nowe okno do ActiveWindowsDictionaryelementu i obsługuje elementWindow . Zamknięte zdarzenie, z ActiveWindows których ma być usuwane po zamknięciu okna.

// 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);
}

Pobierz monitorowane okno z kodu aplikacji

Aby uzyskać dostęp do wystąpienia Window z kodu aplikacji, musisz uzyskać WindowId dla bieżącego okna, aby pobrać je ze statycznej Dictionary w klasie App. Należy to zrobić w procedurze obsługi zdarzeń załadowanych na stronie, a nie w konstruktorze, aby kod XamlRoot nie nullbył .

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];
        }
    }
}