How to add usercontrol in the RibbonWindow titlebar

Good morning,

I'm new on syncfusion and i want to add usercontrol(image+text) in the Ribbonwindow titlebar on the right side of the bar near minimize window's button. Which is the best way to achive this?
Thanks

Roberto

19 Replies 1 reply marked as answer

BR Backia Raj Kanagaraj Syncfusion Team November 9, 2020 01:09 PM UTC

Hi Roberto, 

Thanks for contacting our Syncfusion support. 

We are checked your requirement and currently we don't have direct support to load the custom control into the titlebar of RibbonWindow.  But, we are customize this control style and added the control near by the minimize button. For example, We added the help button to near by the minimize button in our sample. Refer the below sample and screenshot. 


Screenshot

 


We also considering your requirement and logged the feature. This feature will be implemented in any of our upcoming release and we will let you know once it completed. 


Regards, 
Backia Raj Kanagaraj

Marked as answer

RB Roberto Becchetti November 10, 2020 09:28 PM UTC

Thanks for answer. Now I'll try with your advice while waiting the new feature.



VR Vijayalakshmi Roopkumar Syncfusion Team November 11, 2020 04:31 AM UTC

Hi Roberto 
 
We are glad that our workaround solution meets your requirement.  
 
Please let us know if you need any further assistance on this. 
 
Regards, 
Vijayalakshmi VR. 



RB Roberto Becchetti November 13, 2020 09:37 PM UTC

I have this problem using control style that you advised. I have an error on syncfusion:TitleBar property "Title" not found in type 'TitleBar'. This because in my project I have class Syncfusion.Windows.Shared.Titlebar and not Syncfusion.Windows.Tools.Controls.TitleBar as in yours. I'm using .NET CORE 3. Is this the problem?
Thanks.
  • Aggiungi al Frasario
    • Non ci sono elenchi di parole per Inglese -> Italiano...
    • Crea un nuovo elenco di parole...
  • Copia
  • Aggiungi al Frasario
    • Non ci sono elenchi di parole per Inglese -> Italiano...
    • Crea un nuovo elenco di parole...
  • Copia


VR Vijayalakshmi Roopkumar Syncfusion Team November 16, 2020 12:25 PM UTC

Hi Roberto 
 
Thank you for your update. 
 
We have checked the reported query that you got error that Title not found in type of TitleBar. This is due that our TitleBar is class which is from Tools.WPF assembly , and it not in Shared. So we suggest you to refer the Titlebar as like Syncfusion shown in our sample., or else define the namespace of Tools.WPF assembly and refer the Titlebar. 
 
 
xmlns:tools="clr-namespace:Syncfusion.Windows.Tools.Controls.Resources;assembly=Syncfusion.Tools.Wpf" 
 
 
 
If you still faces the error, please provide us the issue reproducing sample, it would be helpful for us to proceed on it further. 
 
Regards, 
Vijayalakshmi VR 



RB Roberto Becchetti November 16, 2020 10:40 PM UTC

Thanks for advise. It's works. But how can i hold default win 10 style on Minimize, Maximixe button?

I'd like this style:

instead of this style:


Thanks a lot.

Roberto


VR Vijayalakshmi Roopkumar Syncfusion Team November 17, 2020 04:03 PM UTC

Hi Roberto, 
 
Thank you for your update 
 
We have analyzed your requirement and understood that you want to maintain the standard WPF window system button path in our RibbonWindow. In order to achieve it, you need to change the path of Minimize, Maximize and close button in the following template. 
 
Code:[Office2013Style.xaml] 
 
 
 
 
 
 
 
 
 
Similarly you can use your own desired path in the respective templates as shown above and achieve your requirement. 
 
Please let us know if you need any further assistance on this. 
 
Regards, 
Vijayalakshmi VR 



RB Roberto Becchetti November 17, 2020 09:38 PM UTC

Thanks. But isn't there a simpler method for do the job? Because I don't know the win 10 close button default path. I want to keep the default template of syncfusion RibbonWindow with the maximize, minimize, close default button (windows 10 style) and only can add an image with text in the tile bar without complicate it too much.
Thank for your availability.

Roberto





VR Vijayalakshmi Roopkumar Syncfusion Team November 19, 2020 03:53 AM UTC

Hi Roberto 
 
Thank you for your update. 
 
From your update, we could understand that you want to add custom buttons in titlebar in default style of Ribbon. In order to achieve this, you can edit the template of RibbonWindow by right clicking on designer with edit a copy option in default style and add any control in titlebar as showcase in our sample updated on 9th Nov, 2020. 
 
 
 
Please let us know if you need any further assistance on this. 
 
Regards, 
Vijayalakshmi VR 



RB Roberto Becchetti November 19, 2020 11:09 PM UTC

I have tried with syncfusion:RibbonWindow default template without changing anything but the result is this:


I lose the win 10 Minimize,Maximize, Close button style.


If you want i can attach my simple example.

Thanks.

Roberto



VR Vijayalakshmi Roopkumar Syncfusion Team November 22, 2020 10:42 AM UTC

Hi Roberto, 
 
Thank you for your update. 
 
From your requirement, we could understand that you want to maintain the default Window 10 System buttons, for this you can achieve with our default style of RibbonWindow as shown in following screenshot. 
 
 
 
 
We have also attached the default template file of RibbonWindow. You can access the path of system button using its name MaxButton, MinButton and CloseButton in the following file. 
 
 
Please try this in your application and let us know if it meets your requirement. If you still faces the issue with default template, then please share us the sample , so that we can check and update you the details accordingly. 
 
Kindly let us know if you need any further assistance on this. 
 
Regards, 
Vijayalakshmi VR 



RB Roberto Becchetti November 28, 2020 08:24 AM UTC

I managed to get the desired result. Thanks a lot for the help.

Roberto


VR Vijayalakshmi Roopkumar Syncfusion Team November 30, 2020 04:37 AM UTC

Hi Roberto 
 
Thank you for your update. 
 
Please let us know if you need any further assistance on this. 
 
Regards, 
Vijayalakshmi VR 



RB Roberto Becchetti December 9, 2020 09:33 PM UTC

Now i can modify default template for add texbox on titlebar of ribbonwindow.

I add this part:

<StackPanel Grid.Column="3" HorizontalAlignment="right" VerticalAlignment="Center">
     <Image Source=""/>
     <TextBlock x:Name="PART_UserName" Text="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=UserNameText}"/>
</StackPanel>

in  the property template of <Style TargetType="{x:Type tools:TitleBar}"> of <ControlTemplate TargetType="{x:Type tools:RibbonWindow}">.

I try to use dependency property:

        public static readonly DependencyProperty UserNameTextProperty =
            DependencyProperty.Register("UserNameText", typeof(string), typeof(TitleBar), new FrameworkPropertyMetadata("TEST1"));

to set the "text" property on the "TextBlock" that is defined inside template.
The string "TEST1" appears on the title bar but i can't set another string in code behind. Which is the best approach?
Thanks.

Roberto


VR Vijayalakshmi Roopkumar Syncfusion Team December 11, 2020 03:07 AM UTC

Hi Roberto 
 
Thank you for your update. 
 
Query : The string "TEST1" appears on the title bar but i can't set another string in code behind. Which is the best approach? 
 
We could understood that you are bounding the dependency property with the textbox used in Titlebar template, however your requirement is unclear, so please confirm us if your requirement is to change the default value Test1 for your dependency property named UserNameText. If this is your requirement , then please use the PropertychangedCallBack method and set the new text for your dependency property as shown in following code. This will allow you to change the value of your dependency property. 
 
Code: 
 
 
public static readonly DependencyProperty UserNameTextProperty =
            DependencyProperty.Register("UserNameText", typeof(string), typeof(TitleBar), new FrameworkPropertyMetadata("TEST1”,new PropertyChangedCallback(OnSetTextChanged))); 
 
        public string UserNameText 
        { 
            get { return (string)GetValue(UserNameText); } 
            set { SetValue(UserNameText, value); } 
        } 
 
        private static void OnSetTextChanged(DependencyObject d, 
           DependencyPropertyChangedEventArgs e) 
        { 
     //   add your code 
        } 
 
        private void OnSetTextChanged(DependencyPropertyChangedEventArgs e) 
        { 
            textbox.Text = e.NewValue.ToString(); 
        } 
 
 
 
For more information about PropertyChangedCallBack method, refer the following documentation link: 
 
 
Please try this suggestion and let us know if it is helpful. 
 
Regards, 
Vijayalakshmi VR 



RB Roberto Becchetti December 11, 2020 06:16 PM UTC

My problem is that I can't refer to the specific texbox object inside template (PART_UserName) .

If in code behind I set:

UserNameText = "MyUserName";

I don't see the string in the TitleBar in the RibbonWindow.

And I don't know how to refer PART_UserName object for set PART_UserName.Text="MyUserName";

Thanks.

Roberto



VR Vijayalakshmi Roopkumar Syncfusion Team December 14, 2020 12:32 PM UTC

Hi Roberto 
 
Thank you for your update. 
 
We have checked your query and understood that you want to access the textblock which is maintained in TitleBar of RibbonWindow. For this requirement, you need to access the following code in the loaded event of RibbonWindow , as shown in following code: 
 
 
Code:[C#] 
 
 
 
private void RibbonWindow_Loaded(object sender, RoutedEventArgs e) 
{ 
TitleBar bar = this.Template.FindName("PART_TitleBar", this) as TitleBar; 
if (bar != null) 
{ 
// Accessing the textblock maintained in titlebar. 
TextBlock text = Syncfusion.Windows.Shared.VisualUtils.FindDescendant(bar, typeof(TextBlock)) as TextBlock; 
// set text for the textblock 
text.Text = "Ribbon"; 
} 
} 
 
 
 
 
If you still having any queries on accessing the textblock or you face any trouble on setting the text for Ribbon, please provide your customized sample, so that we can check and provide you the solution accordingly. 
 
Please let us know if you need any other assistance on this. 
 
Regards, 
Vijayalakshmi VR 



RB Roberto Becchetti December 14, 2020 09:22 PM UTC

Thanks for advice. To work I had make the following modify to the proposed code.

TitleBar bar = this.Template.FindName("PART_TitleBar", this) as TitleBar;
if (bar != null)
{
     TextBlock text = bar.Template.FindName("PART_UserName", bar) as TextBlock;
text.Text = "Ribbon";
}


Thanks for your availability.

Roberto


VR Vijayalakshmi Roopkumar Syncfusion Team December 15, 2020 07:46 AM UTC

Hi Roberto

We are glad that our solution helps you to meet your requirement with Ribbon.

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

Regards,
Vijayalakshmi VR

Loader.
Up arrow icon