Insert controls via code behind an how to collapse a area

[Leixit]

I am new in this topic and need a little help.

I have made a UI via XAML and design tools. For the UI i use a DockingManager.
Unfortunately, I do not know how i can insert custome controls in the ContentControl areas of the DockingManager via code behind.
Inside XAML i can make it like...

<ContentControl syncfusion:DockingManager.Header="Docking Left" syncfusion:DockingManager.SideInDockedMode= "Left" >
    <Button Width="70" Height="30">This is what i want</Button>
</ContentControl>

But how to insert the Button via code behind?
Do i need another Container?

Next.
I need to insert a Custom Ribbon in the top area of the DockingManager. The Ribbon has a collapse functionality. If the Ribbon is collapsed, all u see is the the TabMenu of the Ribbon. The top area should accept the same size as the menu and after-slides everything shall below up. If the Ribbon uncollapsed again, everything then shall slip to below.

How can i change the size of the Dockingarea via code behind?

It would be terrific if you could help me.

[Marimuthu Sivalingam]

Hi Harald,

Thank you for contacting Syncfusion Support.

We have checked your query “How can I change the size of the Docking area via code behind” and we have prepared the sample to meet your requirement. In this sample, we have added Ribbon control at the top of the Docking area and added ContentControl with button at the bottom of the Ribbon. While Ribbon is in collapsed state we have updated DockingManager attached property of DesiredHeightInDockedMode for Ribbon view to resize the Docking areas. Please find the sample for the same from the below link.

Sample:DockingManager_RibbonSample

Note: While, using Ribbon control inside any window, other than RibbonWindow, we should set margin for Ribbon control to update the header view.

Please let us know, if you need further assistance on this.

Regards,
Marimuthu S.

[Leixit]

This is excellent. Thank you very much.

One more question.

The DockingManager has no Center DockSide.

So i know, i can add for example a rtf editor in this center via DockingManager.ClientControl and XAML.

If i am tall, i  will be a rtf editor  <- code is not showing

How can i add a DockingManager.ClientControl via code behind?

[Marimuthu Sivalingam]

Hi Harald,

Thanks for your update.

We have checked your query “ DockingManager has no center dock side”. To create document window in the DockingManager, set UseDocumentContainer as True for DockingManager and set its state as Document. Also, we have modified the sample to add the Document window to DockingManager via code behind. Please find the code snippet and sample for the same from the below link.

Code example:  

XAML:   

   

<syncfusion:DockingManager x:Name="Docking" UseDocumentContainer="True"/>   

 

 C#   

Docking.UseDocumentContainer = true;   

ViewB control3 = new ViewB();   

DockingManager.SetState(control3, DockState.Document);   

 

  

Sample:  https://www.syncfusion.com/downloads/support/directtrac/general/ze/DockingMaanger_RibbonSample-29421580.zip
 

  

Regards,
Marimuthu S.