왼쪽 메뉴 및 메인 창 페이지 로딩 설정 완료

네비게이션 추가

화면에 왼쪽 사이드 메뉴 추가하기

새 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 빈 페이지 템플릿 선택

BlankPage.xaml 내부 Grid 부분을 아래처럼 수정합니다. 페이지 구분이 쉽도록 각 페이지에 다른 텍스트를 보여주는 TextBlock을 배치합니다.

Page와 Window는 서로 다른 컨트롤입니다

    <Grid>
        <TextBlock Text="This is a blank page." 
HorizontalAlignment="Center" 
VerticalAlignment="Center" FontSize="24"/>
    </Grid>Code language: C++ (cpp)
네비게이션 바 및 페이지 로딩

메인 창 기본 페이지 설정

메인 창의 Frame 컨트롤에 위에서 만든 빈 페이지를 기본으로 불러오도록 설정합니다

Frame은 HTML의 iframe과 유사한 개념으로, 독립적인 영역에 다른 페이지 내용을 불러와 표시합니다.

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에 작성해야 UI 초기화와 페이지 이동을 안전하게 처리할 수 있습니다
    MainWindow::MainWindow()
    {
        InitializeComponent();
        // Frame이 BlankPage를 불러와 표시하도록 설정
        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 영역에 해당 빈 페이지가 출력됩니다.

왼쪽 메뉴 및 메인 창 페이지 로딩 설정 완료

답글 남기기

이메일 주소는 공개되지 않습니다. 필수 필드는 *로 표시됩니다