User Interface for .NET / User's Guide / Docking Panels / Tutorials / Docking Framework

In This Topic
    Docking Framework
    In This Topic

    The following tutorial will teach you how to create a simple docking framework from code:

    1. Open Visual Studio, select File->New->Project... command and create a new Windows Application Project.
    2. Add references to "Nevron.System.dll", "Nevron.Presentation.dll" and "Nevron.UI.WinForm.Docking.dll" assemblies.
    3. Open the Form1.cs in the code editor.
    4. Add the following "using" statements:
      C#
      Copy Code
      using Nevron.UI.WinForm.Controls;
      using Nevron.UI.WinForm.Docking;
      
      Visual Basic
      Copy Code
      Imports Nevron.UI.WinForm.Controls
      Imports Nevron.UI.WinForm.Docking
      
    5. Add a private field of type NDockManager:
      C#
      Copy Code
      private NDockManager dockManager;
      
      Visual Basic
      Copy Code
      Private dockManager As NDockManager 
      
    6. Create the dock manager and customize its properties:
      C#
      Copy Code
      protected virtual void CreateDockManager()
      {
          dockManager = new NDockManager();
          dockManager.Form = this;
          dockManager.Palette.Scheme = ColorScheme.LunaBlue;
      }
      
      Visual Basic
      Copy Code
      Protected Overridable Sub CreateDockManager()
          dockManager = New NDockManager()
          dockManager.Form = Me
          dockManager.Palette.Scheme = ColorScheme.LunaBlue
      End Sub
      
    7. Create a simple layout:
      C#
      Copy Code
      protected virtual void CreateSimpleLayout()
      {
          NDockingPanel panel;
          INDockZone root = dockManager.RootContainer.RootZone;
          INDockZone target;
      
          //add panel on the left side of the root
          panel = new NDockingPanel();
          panel.SizeInfo.PreferredSize = new Size(100, 200);
          panel.PerformDock(root, DockStyle.Left);
      
          //add panel on the right side of the root
          panel = new NDockingPanel();
          panel.SizeInfo.PreferredSize = new Size(100, 200);
          panel.PerformDock(root, DockStyle.Right);
      
          //get the parent zone of the panel and add one at the bottom of it
          target = panel.ParentZone;
          panel = new NDockingPanel();
          panel.PerformDock(target, DockStyle.Bottom);
      
          //add panel at the bottom of the root
          panel = new NDockingPanel();
          panel.SizeInfo.PreferredSize = new Size(150, 100);
          panel.PerformDock(root, DockStyle.Bottom);
      
          //add panel at the top of the root
          panel = new NDockingPanel();
          panel.SizeInfo.PreferredSize = new Size(150, 100);
          panel.PerformDock(root, DockStyle.Top);
      
          //add child panel to the last one
          target = panel.ParentZone;
          panel = new NDockingPanel();
          panel.PerformDock(target, DockStyle.Fill);
      }
      
      Visual Basic
      Copy Code
      Protected Overridable Sub CreateSimpleLayout()
          Dim panel As NDockingPanel
          Dim root As INDockZone = dockManager.RootContainer.RootZone
          Dim target As INDockZone 
      
          'add panel on the left side of the root
          panel = New NDockingPanel()
          panel.SizeInfo.PreferredSize = New Size(100, 200)
          panel.PerformDock(root, DockStyle.Left)
      
          'add panel on the right side of the root
          panel = New NDockingPanel()
          panel.SizeInfo.PreferredSize = New Size(100, 200)
          panel.PerformDock(root, DockStyle.Right)
      
          'get the parent zone of the panel and add one at the bottom of it
          target = panel.ParentZone
          panel = new NDockingPanel()
          panel.PerformDock(target, DockStyle.Bottom)
      
          'add panel at the bottom of the root
          panel = New NDockingPanel()
          panel.SizeInfo.PreferredSize = New Size(150, 100)
          panel.PerformDock(root, DockStyle.Bottom)
      
          'add panel at the top of the root
          panel = New NDockingPanel()
          panel.SizeInfo.PreferredSize = New Size(150, 100)
          panel.PerformDock(root, DockStyle.Top)
      
          'add child panel to the last one
          target = panel.ParentZone
          panel = New NDockingPanel()
          panel.PerformDock(target, DockStyle.Fill)
      End Sub
      
    8. Put the above methods in the Form's constructor:
      C#
      Copy Code
      public Form1()
      {
              //
              // Required for Windows Form Designer support
              //
              InitializeComponent();
              
              CreateDockManager();
              CreateSimpleLayout();
      }
      

      Visual Basic
      Copy Code
      Public Sub New()
              '
              ' Required for Windows Form Designer support
              '
              InitializeComponent()
              
              CreateDockManager()
              CreateSimpleLayout()
      End Sub
      
    9. Compile and run the application. You should see the following: