본문 바로가기

silverlight

ChildWindow in Silverlight 3

 Silverlight 3 에는 ChildWindow 가 추가 됐습니다.

 ChildWindow 는 Winform 등의 Dialog창과 비슷한데요. 주로, 새로운 Dialog창을 띄워 사용자의 입력을 확인하거나, 사용자에게 경고 또는 공지를 알리는 창입니다.

 우선, ChildWindow 를 사용하기 위해선 Silverlight 3가 설치 되 있어야 합니다. (VS2008 SP1 설치와 VS2008 SP1용 Silverlight 3 개발도구가 설치 되 있어야 합니다.)

  Silverlight 프로젝트에서 ChildWindow 를 생성하려면 Add New Item 에서 Silverlight Child Window 를 선택 하신 후 ChildWindow를 명명한 뒤 Add 하시면 됩니다.

저는 TestChildWindow.cs 라고 명명 했습니다.

 그럼 생성 된 TestChildWindow.cs 를 한 번 살펴 보겠습니다.
<controls:ChildWindow x:Class="ChildWindowTest.TestChildWindow"
           xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
           xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
           xmlns:controls="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls"
           Width="400" Height="300"
           Title="TestChildWindow">
    <Grid x:Name="LayoutRoot" Margin="2">
        <Grid.RowDefinitions>
            <RowDefinition />
            <RowDefinition Height="Auto" />
        </Grid.RowDefinitions>
        <Button x:Name="CancelButton" Content="Cancel" Click="CancelButton_Click" Width="75" Height="23" HorizontalAlignment="Right" Margin="0,12,0,0" Grid.Row="1" />
        <Button x:Name="OKButton" Content="OK" Click="OKButton_Click" Width="75" Height="23" HorizontalAlignment="Right" Margin="0,12,79,0" Grid.Row="1" />
    </Grid>
</controls:ChildWindow>

System.Windows.Contols 네임스페이스가 추가 되 있네요. ChildWindow가 System.Windows.Controls 에 있나 봅니다^^;
그리고, 레이아웃도 일정한 폼으로 정해져 있는데요, 이는 Blend 3 Preview 에서 열어보시면 확인 하실 수 있습니다.

비하인드 코드도 살펴보죠.
public partial class TestChildWindow : ChildWindow
{
    public TestChildWindow()
    {
        InitializeComponent();
    } 

    private void OKButton_Click(object sender, RoutedEventArgs e)
    {
        this.DialogResult = true;
    } 

    private void CancelButton_Click(object sender, RoutedEventArgs e)
    {
        this.DialogResult = false;
    }
}


기본적으로 OK, Cancel 버튼의 이벤트가 구현 되 있네요.
여기서 유념해 보실 사항은, OK, Cancel 버튼 각각은 DialogResult Property의 값을 할당 할 뿐 아무 코드도 추가 되 있지 않다는 것입니다. 이렇게 되 있는데도 ChildWindow를 띄워 동작을 해 보시게 되면, OK, Cancel 버튼 클릭 시 ChildWindow 가 닫히게 됩니다. 이는 ChildWindow 의 DialogResult Property에 값을 할당하면 Closing -> Closed 순으로 ChildWindow 가 닫힌다는 것을 반증하는 것이죠.

그럼, 말씀 드렸던 ChildWindow를 어떻게 띄우는 지 살펴 보겠습니다.
TestChildWindow t = new TestChildWindow();
t.Show();
(너무 쉬운가요? ㅎ)

 MessageBox에 비해 ChildWindow가 가지는 장점은, ChildWindow 의 XAML 내용을 보시면 짐작하시겠지만, 바로 개발자의 마음대로 Content 를 구성할 수 있다는 것입니다. 또한, DialogResult 값으로 사용자의 입력(OK, Cancel)을 ChildWindow를 띄운 MainPage에서 확인 할 수 있다는 것이죠.

 ChildWindow에 DialogResult Property 가 사용자의 입력을 확인 할 수 있는 Property 입니다.(Nullable Boolean) 한 가지, 유의하실 점은 Property 값을 사용하는 시점을 명확하게 해야 한다는 것인데요, Silverlight 에서는 모든 동작이 비동기로 이뤄지기 때문에 DialogResult Property 의 값을 아무곳에서나 사용하게 되면 값이 없거나, 사용자의 입력과 상관 없는 값을 가지고 있을 수 있겠죠.

 그래서, ChildWindow의 Closed 이벤트가 일어나는 시점의 DialogResult 값을 사용하시면 됩니다.
TestChildWindow t = new TestChildWindow();
t.Show();
t.Closed += (s2, e2) =>
{
    bool? result = t.DialogResult;

    if (result != null)
    {
        if((bool)result)
        {
            this.myTextBlock.Text = "Nice to meet you.";
        }
        else
        {
            this.myTextBlock.Text = "Who are you?";
        }
    }
};


 위 코드와 같이 구현하게 되면, 정확히 ChildWindow 가 사용자의 입력에 의해 닫히고, 그 때의 DialogResult 값을 확인 할 수 있게 되는 것이죠 :D (ChildWindow 는 여러모로 활용도가 높은 컨트롤임에도 불구하고, 사용하기 참 쉽네요^^)

<Sample>