1. Home
  2. Forum
  3. WPF
  4. How to display UserControl as MDI child in WPF, using outlook styled ribbon control.

How to display UserControl as MDI child in WPF, using outlook styled ribbon control.

How to display UserControl as MDI child in WPF, using outlook styled ribbon control.

7 Replies
ON Olety Nikhilesh Olety Nagendra Syncfusion Team March 2, 2020 09:50 AM UTC

Hi Imran,

Thank you for contacting Syncfusion support.

Based on your update we understood that your requirement is to show a usercontrol in Ribbon. We have created a outlook based sample and in the project we have created a window (NewWindow) and a usercontrol (usercontrol added in NewWindow ) and in the Ribbon we have added a new button (Open new window) in View Tab and the NewWindow will be shown in the button click. Please find the code snippet below.

 private void RibbonButton_Click(object sender, RoutedEventArgs e)
        {
            Window newWindow = new NewWindow();
            newWindow.Show();
        }



Please find the sample below.

Please let us know if this fulfills your requirement or if you have any further queries.

Regards,
Nikhilesh O 



IM Imran March 2, 2020 05:08 PM UTC

Hi Nikhilesh,

Thank you so much for replying. 

I need following as described below and in attached image.

1. At top of the page a "Ribbon Control"
2. At the rest of the whole page there should be a Window or UserControl as a Child/MDI element fit to available space below the Ribbon Control.


Thank you

Attachment: MyRequirement_7bb23366.rar

ON Olety Nikhilesh Olety Nagendra Syncfusion Team March 3, 2020 06:58 AM UTC

Hi Imran,

Thank you for update.

In order the show a usercontrol inside a MDI Window, you can our Syncfusion DocumentContainer which allows to the show content as MDI or TDI window.



Please refer the documentation below for DocumentContainer.

We have modified the previous provided sample to display the user controls in a TDI window.

Please let us know if this fulfills your requirement.

Regards,
Nikhilesh O 


IM Imran March 6, 2020 08:01 AM UTC

Hi Nikhilesh,

Thank you so much, we are almost there!

After so much google I could not find a solution that, how to open multiple user controls inside document container on buttons click.

I agree with your solution, but in your solution you have opened single user control named "TreeViewModified" in XAML, by default.

I need to open multiple user control using code behind (let say C#), when user will click on ribbon button(s).

Example:

As there are multiple buttons inside outlook styled ribbon control Tab e.g. "Home" tab, so

  • When user will click on "New Email" button, UserContorl1 should be opened  inside document container.
  • When user will click on "New Items" button, UserContorl2 should be opened  inside document container.
  • and so on
Regards,
Imran Ullah

ON Olety Nikhilesh Olety Nagendra Syncfusion Team March 9, 2020 09:00 AM UTC

Hi Imran, 
 
Thank you for the update. 
 
Since you have multiple requirement, we have prepared a simple sample where we have added an outlook inspired Ribbon and a document container below. Based on the button click in the Ribbon we have added user control into the DocumentContainer. 
 
Please refer the output image below. 
 
  

 
 
Please refer the sample below. 
 
Please let us know if this fulfills your requirement. 
 
Regards, 
Nikhilesh O 


IM Imran March 9, 2020 05:46 PM UTC

Hi Nikhilesh,

Thank you so much, you are awesome!!

It fulfills my requirements.

Regards,
Imran Ullah

ON Olety Nikhilesh Olety Nagendra Syncfusion Team March 10, 2020 08:42 AM UTC

Hi Imran, 
 
Thanks for the appreciation. 
 
We are glad that the query has been resolved. Please get back to us if you need any other assistance. 
 
Regards, 
Nikhilesh O 


Loader.
Up arrow icon