[WinUI3] ContentDialog 사용기

WinUI를 공부하면서 MessageDialog를 쓰려다가..  못했다...

어떤 유튜브 영상에서는 MessageDialog를 사용하던데, WinUI 3 Gallery에는 검색도 되지 않고, learn.microsoft.com(이거 공식 문서인가요?)에서는 윈도우 10 이상에서는 MessageDialog 대신 ContentDialog를 권장한다고 한다. 

 

그래서 ContentDialog를 사용하려다가 뭔 놈의 예외처리 때문에 자꾸 안되가지고 작성하게 되었다.

 

 

우선, 결과는 이러하다.

이하는 코드

//using문 생략

namespace WinUI_Test {
    public sealed partial class MainWindow : Window {
        public MainWindow() {
            this.InitializeComponent();
        }

        private void myButton_Click(object sender, RoutedEventArgs e) {
            dialogUp();
            myButton.Content = "Clicked";
        }

        private async void dialogUp() {
            ContentDialog dialog = new ContentDialog() {
                Title = "Test",
                Content = "Click buttons",
                PrimaryButtonText = "OK",
                CloseButtonText = "Cancel"
            };

            dialog.XamlRoot = myButton.XamlRoot;
            await dialog.ShowAsync();
        }
    }
}

xmal은 처음 프로젝트를 만들 때 기본적으로 만들어지는 것으로 사용했다. 

이 중 가장 중요한 것은 생성한 dialog에 XamlRoot를 꼭 지정해줘야 한댄다. 안 그러면 작동을 안 한다고

 

이렇게 작성하여 버튼을 누를 때의 값을 전달할 수도 있다.

private async void myButton_Click(object sender, RoutedEventArgs e) {
    if(await dialogUp()) {
        myButton.Content = "Clicked";
    }
}

private async Task<bool> dialogUp() {
    bool result = false;
    ContentDialog dialog = new ContentDialog() {
        Title = "Test",
        Content = "Click buttons",
        PrimaryButtonText = "OK",
        CloseButtonText = "Cancel"
    };

    //버튼 클릭을 추가할 때 꼭 매개변수가 2개 들어가야 한다네요
    dialog.PrimaryButtonClick += (_s, _e) => { result = true; };
    dialog.XamlRoot = myButton.XamlRoot;
    await dialog.ShowAsync();

    return result;
}

 

 

하지만!

여기서 만족하고 싶지 않았다.

WinUI3 갤러리에 나오는 예시처럼 dialog에 뭔가 예쁘게 집어넣어보고 싶었다.

xaml

c#

이렇게 갤러리에서는 제공이 되었으나..

새 페이지를 만들어 그 안에 위의 코드를 넣었으나...

왜인지는 몰라도 자꾸 await dialog.ShowAsync()에서 처리되지 않은 예외라며 다이얼로그가 나타나지 않았다

인터넷을 뒤져보니 다들 XamlRoot가 잘못되었다고 말을 하니 이 코드에서도 XamlRoot가 잘못 되었겠거니 싶겠는데,

뭐가 잘못되었는지 잘 모르겠다

 

혹시 이에 대해 아시는 분이 계신다면 댓글로 알려주시면 감사하겠습니다

 

 

---

2023.01.23 18:20 추가작성

 

XamlRoot에 대해 착각하고 있었던 것 같다.
XamlRoot는 띄울 창에 어떤 내용을 넣을까가 아니라, 어디 창에 이걸 띄울까인 것 같다. (추측)

즉, 위 코드의 dialog.XamlRoot에는 Page의 XamlRoot가 아닌 다이얼로그를 띄울 MainWindow의 XamlRoot를 넣어줘야 작동하는 것이다. 

그래서 아래와 같이 코드를 작성했고,

(다이얼로그의 내용물은 Content로 추가해야 하나보다)

// BlankPage1.xaml.cs
public async void Show(XamlRoot xamlRoot) {
    ContentDialog dialog = new ContentDialog() {
        PrimaryButtonText = "Save",
        CloseButtonText = "Cancel",
        Title = "테스트",
        XamlRoot = xamlRoot,
        Content = new BlankPage1()
    };

    var result = await dialog.ShowAsync();
}

// MainWindow.xaml.cs
private void myButton_Click(object sender, RoutedEventArgs e) {
    BlankPage1 page = new BlankPage1();
    page.Show(this.Content.XamlRoot);
}

(MainWindow의 XamlRoot를 매개변수로 전달)

오류없이 다이얼로그 창이 뜬 것을 확인할 수 있었...... 읭?

체크박스도 보이고, 다이얼로그의 타이틀도 잘 나오는데... 아무래도 xaml에 입력한 한글이 깨진 것 같다.

 

한글은 나중에 해결해봐야겠다