[C#/WPF/DEVEXPRESS] DockLayoutManager 클래스 : DocumentPanel 속으로 외부 Window 또는 UserControl 로드하기

■ DockLayoutManager 클래스에서 DocumentPanel 속으로 외부 Window 또는 UserControl를 로드하는 방법을 보여준다.

▶ MainWindow.xaml


<Window x:Class="TestProject.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:dxb="http://schemas.devexpress.com/winfx/2008/xaml/bars"
    xmlns:dxc="http://schemas.devexpress.com/winfx/2008/xaml/core"
    xmlns:dxd="http://schemas.devexpress.com/winfx/2008/xaml/docking"
    Width="800"
    Height="600"
    dxc:ThemeManager.ThemeName="Office2007Black"
    Title="Load External Window Or UserControl Into DocumentPanel"
    FontFamily="나눔고딕코딩"
    FontSize="16">
    <dxb:BarManager Name="barManager">
        <dxb:BarManager.Items>
            <dxb:BarButtonItem x:Name="setDocumentPanel1BarButtonItem"
                Content="Set DocumentPanel 1"
                ItemClick="setDocumentPanel1BarButtonItem_ItemClick" />
            <dxb:BarButtonItem x:Name="addDocumentPanel3BarButtonItem"
                Content="Add DocumentPanel 3"
                ItemClick="addDocumentPanel3BarButtonItem_ItemClick" />
            <dxb:BarButtonItem x:Name="setDataContextForUserControlBarButtonItem"
                Content="Set DataContext for UserControl"
                ItemClick="setDataContextForUserControlBarButtonItem_ItemClick" />
        </dxb:BarManager.Items>
        <dxb:BarManager.Bars>
            <dxb:Bar>
                <dxb:Bar.ItemLinks>
                    <dxb:BarButtonItemLink BarItemName="setDocumentPanel1BarButtonItem" />
                </dxb:Bar.ItemLinks>
            </dxb:Bar>
            <dxb:Bar>
                <dxb:Bar.DockInfo>
                    <dxb:BarDockInfo Row="1" />
                </dxb:Bar.DockInfo>
                <dxb:Bar.ItemLinks>
                    <dxb:BarButtonItemLink BarItemName="addDocumentPanel3BarButtonItem"/>
                    <dxb:BarButtonItemLink BarItemName="setDataContextForUserControlBarButtonItem"/>
                </dxb:Bar.ItemLinks>
            </dxb:Bar>
        </dxb:BarManager.Bars>
        <dxd:DockLayoutManager x:Name="dockLayoutManager">
            <dxd:DockLayoutManager.LayoutRoot>
                <dxd:LayoutGroup>
                    <dxd:DocumentGroup x:Name="documentGroup"
                        MDIStyle="MDI"
                        DestroyOnClosingChildren="False"
                        SelectedTabIndex="1">
                        <dxd:DocumentPanel x:Name="documentPanel1"
                            Caption="DocumentPanel 1"
                            MDISize="300 250" />
                        <dxd:DocumentPanel x:Name="documentPanel2"
                            Caption="DocumentPanel 2"
                            MDILocation="100 100"
                            MDISize="300 250"
                            Content="{dxd:RelativeUri UriString=Source\\SourceWindow2.xaml}" />
                    </dxd:DocumentGroup>
                </dxd:LayoutGroup>
            </dxd:DockLayoutManager.LayoutRoot>
        </dxd:DockLayoutManager>
    </dxb:BarManager>
</Window>

<Window x:Class="TestProject.MainWindow"

xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

xmlns:dxb="http://schemas.devexpress.com/winfx/2008/xaml/bars"

xmlns:dxc="http://schemas.devexpress.com/winfx/2008/xaml/core"

xmlns:dxd="http://schemas.devexpress.com/winfx/2008/xaml/docking"

Width="800"

Height="600"

dxc:ThemeManager.ThemeName="Office2007Black"

Title="Load External Window Or UserControl Into DocumentPanel"

FontFamily="나눔고딕코딩"

FontSize="16">

<dxb:BarManager Name="barManager">

<dxb:BarManager.Items>

<dxb:BarButtonItem x:Name="setDocumentPanel1BarButtonItem"

Content="Set DocumentPanel 1"

ItemClick="setDocumentPanel1BarButtonItem_ItemClick" />

<dxb:BarButtonItem x:Name="addDocumentPanel3BarButtonItem"

Content="Add DocumentPanel 3"

ItemClick="addDocumentPanel3BarButtonItem_ItemClick" />

<dxb:BarButtonItem x:Name="setDataContextForUserControlBarButtonItem"

Content="Set DataContext for UserControl"

ItemClick="setDataContextForUserControlBarButtonItem_ItemClick" />

</dxb:BarManager.Items>

<dxb:BarManager.Bars>

<dxb:Bar>

<dxb:Bar.ItemLinks>

<dxb:BarButtonItemLink BarItemName="setDocumentPanel1BarButtonItem" />

</dxb:Bar.ItemLinks>

</dxb:Bar>

<dxb:Bar>

<dxb:Bar.DockInfo>

<dxb:BarDockInfo Row="1" />

</dxb:Bar.DockInfo>

<dxb:Bar.ItemLinks>

<dxb:BarButtonItemLink BarItemName="addDocumentPanel3BarButtonItem"/>

<dxb:BarButtonItemLink BarItemName="setDataContextForUserControlBarButtonItem"/>

</dxb:Bar.ItemLinks>

</dxb:Bar>

</dxb:BarManager.Bars>

<dxd:DockLayoutManager x:Name="dockLayoutManager">

<dxd:DockLayoutManager.LayoutRoot>

<dxd:LayoutGroup>

<dxd:DocumentGroup x:Name="documentGroup"

MDIStyle="MDI"

DestroyOnClosingChildren="False"

SelectedTabIndex="1">

<dxd:DocumentPanel x:Name="documentPanel1"

Caption="DocumentPanel 1"

MDISize="300 250" />

<dxd:DocumentPanel x:Name="documentPanel2"

Caption="DocumentPanel 2"

MDILocation="100 100"

MDISize="300 250"

Content="{dxd:RelativeUri UriString=Source\\SourceWindow2.xaml}" />

</dxd:DocumentGroup>

</dxd:LayoutGroup>

</dxd:DockLayoutManager.LayoutRoot>

</dxd:DockLayoutManager>

</dxb:BarManager>

</Window>

▶ MainWindow.xaml.cs


using System;
using System.Windows;
using System.Windows.Media.Imaging;

using DevExpress.Xpf.Bars;
using DevExpress.Xpf.Docking;

namespace TestProject
{
    /// <summary>
    /// 메인 윈도우
    /// </summary>
    public partial class MainWindow : Window
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Field
        ////////////////////////////////////////////////////////////////////////////////////////// Private

        #region Field

        /// <summary>
        /// DocumentPanel 3
        /// </summary>
        private DocumentPanel documentPanel3 = null;

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Constructor
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 생성자 - MainWindow()

        /// <summary>
        /// 생성자
        /// </summary>
        public MainWindow()
        {
            InitializeComponent();
        }

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Method
        ////////////////////////////////////////////////////////////////////////////////////////// Private
        //////////////////////////////////////////////////////////////////////////////// Event

        #region Set DocumentPanel 1 바 버튼 항목 클릭시 처리하기 - setDocumentPanel1BarButtonItem_ItemClick(sender, e)

        /// <summary>
        /// Set DocumentPanel 1 바 버튼 항목 클릭시 처리하기
        /// </summary>
        /// <param name="sender">이벤트 발생자</param>
        /// <param name="e">이벤트 인자</param>
        private void setDocumentPanel1BarButtonItem_ItemClick(object sender, ItemClickEventArgs e)
        {
            ActivateItem(this.documentPanel1);

            this.documentPanel1.Content = new Uri(@"Source\SourceWindow1.xaml", UriKind.Relative);
        }

        #endregion
        #region Add DocumentPanel 3 바 버튼 항목 클릭시 처리하기 - addDocumentPanel3BarButtonItem_ItemClick(sender, e)

        /// <summary>
        /// Add DocumentPanel 3 바 버튼 항목 클릭시 처리하기
        /// </summary>
        /// <param name="sender">이벤트 발생자</param>
        /// <param name="e">이벤트 인자</param>
        private void addDocumentPanel3BarButtonItem_ItemClick(object sender, ItemClickEventArgs e)
        {
            if(this.documentPanel3 != null)
            {
                return;
            }

            this.documentPanel3 = this.dockLayoutManager.DockController.AddDocumentPanel
            (
                this.documentGroup,
                new Uri(@"Source\SourceUserControl3.xaml", UriKind.Relative)
            );

            this.documentPanel3.Caption = "DocumentPanel 3";

            DocumentPanel.SetMDILocation(this.documentPanel3, new Point(200, 200));
            DocumentPanel.SetMDISize(this.documentPanel3, new Size(400, 300));

            ActivateItem(this.documentPanel3);
        }

        #endregion
        #region Set DataContext For UserControl 바 버튼 항목 클릭시 처리하기 - setDataContextForUserControlBarButtonItem_ItemClick(sender, e)

        /// <summary>
        /// Set DataContext For UserControl 바 버튼 항목 클릭시 처리하기
        /// </summary>
        /// <param name="sender">이벤트 발생자</param>
        /// <param name="e">이벤트 인자</param>
        private void setDataContextForUserControlBarButtonItem_ItemClick(object sender, ItemClickEventArgs e)
        {
            if(this.documentPanel3 == null)
            {
                return;
            }

            Uri uri = new Uri("/Image/background.jpg", UriKind.Relative);

            ImageInformation imageInformation = new ImageInformation();

            imageInformation.Source      = new BitmapImage(uri);
            imageInformation.Description = uri.ToString();

            (this.documentPanel3.Control as SourceUserControl3).SetDataContext(imageInformation);

            ActivateItem(this.documentPanel3);
        }

        #endregion

        //////////////////////////////////////////////////////////////////////////////// Function

        #region 항목 활성화 하기 - ActivateItem(baseLayoutItem)

        /// <summary>
        /// 항목 활성화 하기
        /// </summary>
        /// <param name="baseLayoutItem">BaseLayoutItem 객체</param>
        private void ActivateItem(BaseLayoutItem baseLayoutItem)
        {
            this.dockLayoutManager.LayoutController.Activate(baseLayoutItem);
        }

        #endregion
    }
}

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

133

134

135

using System;

using System.Windows;

using System.Windows.Media.Imaging;

using DevExpress.Xpf.Bars;

using DevExpress.Xpf.Docking;

namespace TestProject

{

/// <summary>

/// 메인 윈도우

/// </summary>

public partial class MainWindow : Window

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Field

////////////////////////////////////////////////////////////////////////////////////////// Private

#region Field

/// <summary>

/// DocumentPanel 3

/// </summary>

private DocumentPanel documentPanel3 = null;

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Constructor

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 생성자 - MainWindow()

/// <summary>

/// 생성자

/// </summary>

public MainWindow()

{

InitializeComponent();

}

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Private

//////////////////////////////////////////////////////////////////////////////// Event

#region Set DocumentPanel 1 바 버튼 항목 클릭시 처리하기 - setDocumentPanel1BarButtonItem_ItemClick(sender, e)

/// <summary>

/// Set DocumentPanel 1 바 버튼 항목 클릭시 처리하기

/// </summary>

/// <param name="sender">이벤트 발생자</param>

/// <param name="e">이벤트 인자</param>

private void setDocumentPanel1BarButtonItem_ItemClick(object sender, ItemClickEventArgs e)

{

ActivateItem(this.documentPanel1);

this.documentPanel1.Content = new Uri(@"Source\SourceWindow1.xaml", UriKind.Relative);

}

#endregion

#region Add DocumentPanel 3 바 버튼 항목 클릭시 처리하기 - addDocumentPanel3BarButtonItem_ItemClick(sender, e)

/// <summary>

/// Add DocumentPanel 3 바 버튼 항목 클릭시 처리하기

/// </summary>

/// <param name="sender">이벤트 발생자</param>

/// <param name="e">이벤트 인자</param>

private void addDocumentPanel3BarButtonItem_ItemClick(object sender, ItemClickEventArgs e)

{

if(this.documentPanel3 != null)

{

return;

}

this.documentPanel3 = this.dockLayoutManager.DockController.AddDocumentPanel

(

this.documentGroup,

new Uri(@"Source\SourceUserControl3.xaml", UriKind.Relative)

);

this.documentPanel3.Caption = "DocumentPanel 3";

DocumentPanel.SetMDILocation(this.documentPanel3, new Point(200, 200));

DocumentPanel.SetMDISize(this.documentPanel3, new Size(400, 300));

ActivateItem(this.documentPanel3);

}

#endregion

#region Set DataContext For UserControl 바 버튼 항목 클릭시 처리하기 - setDataContextForUserControlBarButtonItem_ItemClick(sender, e)

/// <summary>

/// Set DataContext For UserControl 바 버튼 항목 클릭시 처리하기

/// </summary>

/// <param name="sender">이벤트 발생자</param>

/// <param name="e">이벤트 인자</param>

private void setDataContextForUserControlBarButtonItem_ItemClick(object sender, ItemClickEventArgs e)

{

if(this.documentPanel3 == null)

{

return;

}

Uri uri = new Uri("/Image/background.jpg", UriKind.Relative);

ImageInformation imageInformation = new ImageInformation();

imageInformation.Source = new BitmapImage(uri);

imageInformation.Description = uri.ToString();

(this.documentPanel3.Control as SourceUserControl3).SetDataContext(imageInformation);

ActivateItem(this.documentPanel3);

}

#endregion

//////////////////////////////////////////////////////////////////////////////// Function

#region 항목 활성화 하기 - ActivateItem(baseLayoutItem)

/// <summary>

/// 항목 활성화 하기

/// </summary>

/// <param name="baseLayoutItem">BaseLayoutItem 객체</param>

private void ActivateItem(BaseLayoutItem baseLayoutItem)

{

this.dockLayoutManager.LayoutController.Activate(baseLayoutItem);

}

#endregion

}

TestProject.zip