Adding a button to the Title Bar

8 posts, 0 answers
  1. Laura
    Laura avatar
    11 posts
    Member since:
    Jun 2009

    Posted 20 Aug 2009 Link to this post

    Hello,

    I'd like to add a button to the left of Minimize Button of the RadWindow for WPF. I want to create a custom control based on RadWindow. I'm not very familiar with creating custom controls. I got the control template of the RadWindow by using Blend, but I don't want to redo the whole template; I want to be able to use the RadWindow as it comes and just add that button to the title bar. What is the best way to do so?

    Thanks,
    LauraH
  2. Miroslav Nedyalkov
    Admin
    Miroslav Nedyalkov avatar
    1718 posts

    Posted 24 Aug 2009 Link to this post

    Hello Laura,

    Unfortunately there is no easy way to add button just next to the other buttons of the RadWindow control. The easy way of adding button to the header of the RadWindow control will let you add button just next to the title itself. You can do this just by changing the HeaderTemplate property of the RadWindow control and add your button in it. Notice that this is the ContentTemplate of the ContentPresenter, shown in the header. The header by default is not visible for clicks. To change this you need to set the IsHeaderHitTestVisible property of the RadWindowControl. Here is an example:
    <navigation:RadWindow x:Name="window" Header="Window" IsHeaderHitTestVisible="True"
        <navigation:RadWindow.HeaderTemplate> 
            <DataTemplate> 
                <StackPanel Orientation="Horizontal"
                    <ContentPresenter Content="{Binding}" /> 
                    <Button Content="MyButton" /> 
                </StackPanel> 
            </DataTemplate> 
        </navigation:RadWindow.HeaderTemplate> 
    </navigation:RadWindow> 

    If you need to add button just next to the minimize, maximize and close buttons, you need to change the ControlTemplate of the RadWindow control.

    Regards,
    Miroslav Nedyalkov
    the Telerik team

    Instantly find answers to your questions on the newTelerik Support Portal.
    Check out the tipsfor optimizing your support resource searches.
  3. Adriana
    Adriana avatar
    3 posts
    Member since:
    Oct 2008

    Posted 03 Feb 2011 Link to this post

    Hello,
       I want to include a button consisting of just an icon displayed right next to the minimize button that can be used to launch an About Box. You mentioned that in order to do this you need to change the ControlTemplate of a RadWindow. Can you supply an example of how to do this? I do not have access to Expression Blend.

    Thank you,
    Adriana
  4. George
    Admin
    George avatar
    1332 posts

    Posted 09 Feb 2011 Link to this post

    Hello Adriana,

    With the RadControls installation we provide the control templates. You could edit the template for the RadWindow control and add another button next to the minimize button. 

    Regards,
    George
    the Telerik team
    Let us know about your Windows Phone 7 application built with RadControls and we will help you promote it. Learn more>>
  5. Akram
    Akram avatar
    45 posts
    Member since:
    Dec 2012

    Posted 22 Dec 2012 Link to this post

    Hi
    i used your suggestion and it works but the tool tip does not appear

    this is my xaml for the HeaderTemplate

                        <DataTemplate >
                            <DockPanel >
                               <ContentPresenter Content="{Binding}" DockPanel.Dock="Left"/>
                                <Image Source="resources\palette16.png" Stretch="None"  ToolTip="Select Theme" DockPanel.Dock="Right"/>
                            </DockPanel>
                       </DataTemplate>

    Thanks
    Akram
  6. Akram
    Akram avatar
    45 posts
    Member since:
    Dec 2012

    Posted 22 Dec 2012 Link to this post

    Hi
    I fixed all problems, Also, i was able to add buttons near to maximize,minimize,close buttons

    This is my xaml

    <telerik:RadWindow x:Class="Run32.TestTitleButtonsWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"
    Header="TestTitleButtonsWindow" Height="300" Width="510">
        <telerik:RadWindow.Style>
            <Style  TargetType="telerik:RadWindow">
                <Setter Property="HeaderTemplate">
                    <Setter.Value>
                        <DataTemplate>
                            <Grid>
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition Width="*"/>
                                    <ColumnDefinition Width="*"/>
                                </Grid.ColumnDefinitions>
                                <TextBlock Text="{Binding}" DockPanel.Dock="Left" VerticalAlignment="Center"/>
                                <WrapPanel  Grid.Column="1" FlowDirection="RightToLeft" Margin="2" VerticalAlignment="Center">
                                    <Button Margin="2" Background="#00000000" BorderBrush="#00000000" ToolTip="Select Option1" Content="Click 1"/>
                                    <Button Margin="2" Background="#00000000" BorderBrush="#00000000" ToolTip="Select Option2" Content="Click 2"/>
                                    <Button Margin="2" Background="#00000000" BorderBrush="#00000000" ToolTip="Select Option3" Content="Click 3"/>
                                    <Button Margin="2" Background="#00000000" BorderBrush="#00000000" ToolTip="Select Option4" Content="Click 4"/>
                                </WrapPanel>
                            </Grid>
                        </DataTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
        </telerik:RadWindow.Style>
        <Grid>
            
        </Grid>
    </telerik:RadWindow>

    Thanks
    Akram
  7. Dinesh
    Dinesh avatar
    10 posts
    Member since:
    Feb 2019

    Posted 19 Feb in reply to Miroslav Nedyalkov Link to this post

    how to add the additional information in ribbon control header like (user mail id and project name) 
  8. Dinko
    Admin
    Dinko avatar
    951 posts

    Posted 22 Feb Link to this post

    Hi Dinesh,

    Thank you for the provided image which demonstrates the behavior which you are trying to achieve.   

    The RadRibbonView expose Title and ApplicationName properties which you could set. In your case, you have three string position differently. This behavior couldn't be achieved out of the box. What you could try is extract and edit the default template of the RadRibbonView. You can take a look at the Editing Control Templates help article which describes how you can get the default template of the controls. In your case, you will need to edit the WindowTitle element which represents the title of the RibbonView.

    Another approach which you could try is to set create a custom style which targets WindowTitle and set it to the WindowTitleStyle property. In the custom style, you can create your own ControlTemplate. The tricky part here is that you will need to give more space by setting static Width property to 500 for example. 
    <telerik:RadRibbonView.WindowTitleStyle>
        <Style TargetType="ribbonView:WindowTitle" BasedOn="{StaticResource WindowTitleStyle}">
            <Setter Property="Width" Value="500"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate>
                        <Grid>
                            <TextBlock Text="User:Username@teknotherm.no" HorizontalAlignment="Left"/>
                            <TextBlock Text="Tag test 2: string" HorizontalAlignment="Center"/>
                            <TextBlock Text="DataBase:Centralized" HorizontalAlignment="Right"/>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </telerik:RadRibbonView.WindowTitleStyle>
    The BasedOn property is set if you are using NoXAML binaries. If not you can remove it from the style.

    Regards,
    Dinko
    Progress Telerik
    Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
Back to Top