Настройка левого бокового меню и загрузки страниц главного окна завершена

Posted on 2026年7月7日 by jack

Добавить навигацию

Добавить левую боковую панель меню на интерфейс

Создать новый проект WinUI на C++

Откройте файл MainWindow.xaml

Замените только внутренний блок Grid на NavigationView как показано ниже (не заменяйте весь файл целиком)

<NavigationView x:Name="NavView" PaneDisplayMode="Left">
        
   <NavigationView.MenuItems>
       <NavigationViewItem Content="Dashboard" Tag="DashboardPage" 
Icon="Account"/>
       <NavigationViewItem Content="Account" Tag="AnalyticsPage" 
Icon="Add"/>
   </NavigationView.MenuItems>

   <Frame x:Name="MainFrame"/>

</NavigationView>Code language: HTML, XML (xml)

Вид интерфейса после запуска программы показан ниже

Добавить пустую страницу

Создать пустую страницу

Щелкните правой кнопкой по названию проекта → Добавить новый элемент (Add New Item)

Перейдите в раздел Visual C++ → WinUI → шаблон пустой страницы BlankPage.xaml

Измените блок Grid внутри BlankPage.xaml как указано ниже. Для визуального различия страниц на каждой разместим TextBlock с уникальным текстом.

Page (страница) и Window (окно) — разные элементы управления

    <Grid>
        <TextBlock Text="This is a blank page." 
HorizontalAlignment="Center" 
VerticalAlignment="Center" FontSize="24"/>
    </Grid>Code language: C++ (cpp)

Панель навигации и загрузка страниц

Задать пустую страницу по умолчанию для главного окна

Настройте элемент Frame главного окна для автоматической загрузки созданной пустой страницы

Понятие Frame аналогично iframe в HTML: это отдельная область для загрузки и отображения содержимого других страниц.

Откройте файл MainWindow.xaml.h

Удалите реализацию конструктора из заголовочного файла, оставив только его объявление.

Должно остаться только: MainWindow();

Реализуйте логику конструктора в соответствующем файле .cpp.

#include "pch.h"
#include "MainWindow.xaml.h"
#if __has_include("MainWindow.g.cpp")
#include "MainWindow.g.cpp"
#endif

using namespace winrt;
using namespace Microsoft::UI::Xaml;

#include "BlankPage.xaml.h"
#include <winrt/Windows.UI.Xaml.Interop.h>

// To learn more about WinUI, the WinUI project structure,
// and more about our project templates, see: http://aka.ms/winui-project-info.

namespace winrt::App5::implementation
{
    // Реализация конструктора вынесена в cpp-файл для безопасной инициализации интерфейса и перехода между страницами
    MainWindow::MainWindow()
    {
        InitializeComponent();
        // Загрузить и отобразить BlankPage в Frame
        MainFrame().Navigate(xaml_typename<App5::BlankPage>());
    }

    int32_t MainWindow::MyProperty()
    {
        throw hresult_not_implemented();
    }

    void MainWindow::MyProperty(int32_t /* value */)
    {
        throw hresult_not_implemented();
    }


}
Code language: PHP (php)

Для работы функции xaml_typename необходимо подключить заголовок:

#include <winrt/Windows.UI.Xaml.Interop.h>Code language: HTML, XML (xml)

Строка MainFrame().Navigate(xaml_typename()) выполняет переход на страницу BlankPage. При открытии главного окна справа в блоке MainFrame будет отображаться эта пустая страница.