Dock zone is an area where the dock controls will be docked and is controlled by the PerDockZone Control. In order to help developers create a fully customized dock zone in ASP.NET web application using C#.NET programming code, our dock controls offer several properties, including the BackColor property to define background color of target dock zone, the Orientation property to decide which direction the dock controls will be populated and the ForbiddenZones property to specify disallowed dock zones for certain dock control.

And in this tutorial, coupled with detailed C#.NET programming examples, we will show you how to create a custom dock zone using ASP.NET AJAX.

Firstly, we need to state that the background color of the dock zone element is not modified via CSS. And here we attach the sample example to show you how to change the dock zone background color in aspx web page.

PerDockZone1.BackColor = System.Drawing.Color.Green;

ZoneOrientation is responsible for which direction the PerDock controls will be placed into the zone. And in following text, we will set the ZoneOrientation="Vertical" as an example to illustrate this property. After we set ZoneOrientation="Vertical", the dock controls will be placed in the dock zone in vertical direction.

You may not observe any difference of setting ZoneOrientation property to vertical if the combined height of all the dock controls is less than the zone height. But when the combined height is larger than the zone height, the zone will add a vertical scrollbar automatically.

PerDockZone1.Orientation = Orientation.Vertical;
PerDockZone1.Width = 320;
PerDockZone1.Height = 150;

If you want to forbid current dock being placed in corresponding zone (to put it in another way, if you want to specify the zones to which the dock control can not be docked), you can use this ForbiddenZones property. And here we provide a sample programming example to illustrate how to create a forbidden dock zone using C# code programmatically.

PerDockZone1.Width = 300;
PerDockZone1.Height = 400;
PerDockZone2.Width = 300;
PerDockZone2.Height = 400;
PerDockZone3.Width = 600;
PerDockZone3.Height = 220;

PerDock1.ForbiddenZones = new string[] { "PerDockZone2", "PerDockZone3" };
PerDock2.ForbiddenZones = new string[] { "PerDockZone1", "PerDockZone3" };
PerDock3.ForbiddenZones = new string[] { "PerDockZone1", "PerDockZone2" };

Apart from this tutorial page for explaining the dock element zone, we also provide developers detailed C# programming guidance on how to customize the setting of another important dock element command.