Aracılığıyla paylaş


Uygulamanız için birden çok pencere gösterme

WinUI 3 uygulamanızda, her pencerede aynı kullanıcı arabirimi iş parçacığı üzerinde çalışırken uygulama içeriğinizi ikincil pencerelerde gösterebilirsiniz.

WinUI 3 Galeri simgesi WinUI 3 Galeri uygulaması, WinUI denetimlerinin ve özelliklerinin etkileşimli örneklerini içerir. uygulamayı Microsoft Store adresinden alın veya GitHub üzerindeki kaynak koduna göz atın.

İpucu

Birden çok pencere kullanmanın yaygın bir nedeni , TabView sekmelerinin yeni bir pencereye ayrılmasına izin vermektir. Bu senaryoya özgü bilgiler ve örnekler için, Sekme yırtılma kısmına, Sekme görünümü makalesinde bakın.

API’ye genel bakış

Birden çok penceredeki içeriği göstermek için kullandığınız önemli API'lerden bazıları aşağıdadır.

XAML Window ve AppWindow

Window ve AppWindow sınıfları, bir uygulamanın bir bölümünü ikincil pencerede görüntülemek için kullanılabilir. WinUI pencerelerinin önemli bir özelliği, her örneğin oluşturuldukları kullanıcı arabirimi işleme iş parçacığını (olay dağıtıcısı dahil) paylaşması ve bu da çok pencereli uygulamaları basitleştirmesidir.

Bkz. WinUI ve Windows App SDK için Windowing'e genel bakış daha ayrıntılı bir açıklama için Window ve AppWindow.

AppWindowPresenter

AppWindowPresenter API'si, pencereleri veya FullScreengibi CompactOverlay önceden tanımlanmış yapılandırmalara kolayca geçiş yapmanıza olanak tanır. Daha fazla bilgi için bkz. Uygulama pencerelerini yönetme.

XamlRoot

XamlRoot sınıfı bir XAML öğe ağacı tutar, bunu pencere konak nesnesine bağlar ve boyut ve görünürlük gibi bilgiler sağlar. Doğrudan bir XamlRoot nesnesi oluşturmazsınız. Bunun yerine, bir XAML öğesi Window öğesine eklediğinizde bir öğe oluşturulur. Daha sonra XamlRoot'ı almak için UIElement.XamlRoot özelliğini kullanabilirsiniz.

WindowId

WindowId bir uygulama penceresi için benzersiz bir tanımlayıcıdır. Otomatik olarak oluşturulur ve ilişkili olduğu AppWindow ile en üst düzey Win32 HWND'yi tanımlar.

Bir görsel öğesinden UIElement.XamlRoot'a erişebilirsiniz; ardından XamlRoot.ContentIslandEnvironment; ardından ContentIslandEnvironment.AppWindowId özelliği UIElement'in bulunduğu pencerenin kimliğini içerir.

Yeni bir pencere göster

XAML veya kodda bir Window oluşturabilirsiniz. XAML'de bir Window oluşturursanız, aslında sınıfın bir alt sınıfını Window oluşturmuş olursunuz. Örneğin, bkz. Visual Studio uygulama şablonu tarafından oluşturulan MainWindow.xaml.

Şimdi içeriği yeni bir pencerede gösterme adımlarına göz atalım.

XAML ile yeni bir pencere oluşturmak için

  1. Solution Explorer bölmesinde proje adına sağ tıklayın ve > Yeni Öğe Ekle... öğesini seçin.
  2. Yeni Öğe Ekle iletişim kutusunda, pencerenin sol tarafındaki şablon listesinde WinUI'yi seçin.
  3. Boş Window şablonu seçin.
  4. Dosyayı adlandırın.
  5. Ekle'ye basın.

Yeni bir pencere göstermek için

  1. Yeni bir Window örneği başlatın veya bir Window dosyasıyla bir Window alt sınıfı oluşturduysanız, .xaml alt sınıfından bir örnek oluşturun.

    Window newWindow = new Window();
    
  2. Pencere içeriğini oluşturun.

    Eğer bir Window alt sınıfı .xaml dosyasıyla oluşturduysanız, pencere içeriğini doğrudan XAML içinde ekleyebilirsiniz. Aksi takdirde, içeriği burada gösterildiği gibi koda eklersiniz.

    Bir XAML Frame oluşturmak ve daha sonra uygulama içeriğinizi tanımladığınız bir XAML sayfasına Frame taşımak [Page](/windows/windows-app-sdk/api/winrt/microsoft.ui.xaml.controls.page yaygın bir yöntemdir. Çerçeveler ve sayfalar hakkında daha fazla bilgi için iki sayfa arasında eşler arası gezinmekısmına bakınız.

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

    Ancak, yalnızca bir AppWindow ve Frame değil, Page içinde herhangi bir XAML içeriğini gösterebilirsiniz. Örneğin, daha sonra gösterildiği gibi ColorPicker gibi tek bir denetimi gösterebilirsiniz.

  3. XAML içeriğinizi öğesinin content özelliğine Windowayarlayın.

    newWindow.Content = contentFrame;
    
  4. Yeni pencereyi göstermek için Window.Activate metodunu çağırın.

    newWindow.Activate();
    

Örneklerini izleme Window

Uygulamanızın diğer bölümlerinden Window örneklerine erişim isteyebilirsiniz, ancak bir Window örneği oluşturduktan sonra, ona başka bir koddan erişmenin bir yolu yoktur, tabii bir referansını tutmadığınız sürece. Örneğin, pencere yeniden boyutlandırıldığında kullanıcı arabirimi öğelerini yeniden düzenlemek için Window içinde olayını işlemek isteyebilirsiniz veya izlenen tüm MainPage örneklerini kapatan bir 'tümünü kapat' düğmeniz olabilir.

Bu durumda, bir WindowId içindeki pencere örneklerini izlemek için Dictionary benzersiz tanımlayıcıyı kullanmalısınız, WindowId öğesini Key olarak ve Window örneğini Value olarak belirlemelisiniz. (TabView sekme ayırma API'leri de Windows'u izlemek için WindowId kullanır.)

Sınıfınızda App oluşturun ve Dictionary'i statik bir özellik olarak belirleyin. Ardından, oluşturduğunuz her sayfayı Dictionary öğesine ekleyin ve sayfa kapatıldığında kaldırın.

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

Aşağıdaki kod, içinde MainPagebir düğmeye tıklandığında yeni bir pencere oluşturur. TrackWindow yöntemi yeni pencereyi ActiveWindowsDictionary içerisine ekler ve Window.Closed olayını ele alarak pencere kapandığında onu ActiveWindows'dan kaldırır.

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

Uygulama kodunuzdan izlenen bir pencere edinin

Uygulama kodunuzdan bir Window örneğine erişmek için, geçerli pencerenin WindowId almanız ve Dictionary sınıfınızdaki statik App'den bunu çıkarmanız gerekir. Oluşturucuda değil, XamlRoot'un olmayacağı şekilde, bunu sayfanın null olay işleyicisinde yapmalısınız.

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