This is a migrated thread and some comments may be shown as answers.

Image in Pane Header

4 Answers 100 Views
Docking
This is a migrated thread and some comments may be shown as answers.
Bradley
Top achievements
Rank 1
Bradley asked on 22 Jan 2010, 07:25 PM
Is there any easy way to place an image in the header of a pane before the header text?

Regards,
Brad Serbu

4 Answers, 1 is accepted

Sort by
0
Konstantina
Telerik team
answered on 26 Jan 2010, 01:54 PM
Hi Bradley,

Thank you for contacting us.

Putting an image in the pane's header is an easy task. All you need to do is to edit the TitleTemplate of the pane. You can do that for example like so:
<telerikDocking:RadDocking>
   <telerikDocking:RadSplitContainer>
        <telerikDocking:RadPaneGroup>
             <telerikDocking:RadPane Header="Pane 1">
                  <telerikDocking:RadPane.TitleTemplate>
                      <DataTemplate>
                         <StackPanel Orientation="Horizontal">
                             <Image Source="images/Button.png" />
                             <TextBlock Text="HeaderText" VerticalAlignment="Center"/>
                          </StackPanel>
                       </DataTemplate>
              </telerikDocking:RadPane.TitleTemplate>
              </telerikDocking:RadPane>
      </telerikDocking:RadPaneGroup>
   </telerikDocking:RadSplitContainer>
</telerikDocking:RadDocking>


If you have further questions please feel free to contact us again.

All the best,
Konstantina
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
0
Bradley
Top achievements
Rank 1
answered on 26 Jan 2010, 02:01 PM
Konstantina,

This seems really easy.  I'll give it a shot.  Thank you!

Regards,
Brad Serbu
0
Garry Clark
Top achievements
Rank 1
answered on 09 Feb 2010, 03:31 PM
Konstantina,
I am trying this solution in a MVVM Prism application I am working on and I can't quite get the image to show up on my pane. The Header="Binding HeaderInfo" works well, but I do not believe it is actually even looking at the titletemplate as I can change the Text="Hello World" and it will still display the Header="Binding HeaderInfo" as its text.

Any ideas?

Here is my ViewModel Properties ( I have also tried a .png in case it was an image format issue)
public string HeaderInfo  
        {  
            get { return Resources.HelpTitle; }  
        }  
 
        public ImageSource HeaderIcon  
        {  
            get { return new BitmapImage(ResourceService.GetPackUri("Resources/Help.ico")); }  
        } 

Here is my View
<telerikDocking:RadPane x:Class="VistaAdmin.Help.Presentation.HelpView" 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    xmlns:v="clr-namespace:VistaAdmin.Help.Presentation" 
    xmlns:p="clr-namespace:VistaAdmin.Help.Properties" 
    xmlns:telerikDocking="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls.Docking" 
    Header="{Binding HeaderInfo}">  
    <telerikDocking:RadPane.TitleTemplate> 
        <DataTemplate> 
            <StackPanel Orientation="Horizontal">  
                <Image Source="{Binding HeaderIcon}" /> 
                <TextBlock Text="{Binding HeaderInfo}" VerticalAlignment="Center"/>  
            </StackPanel> 
        </DataTemplate> 
    </telerikDocking:RadPane.TitleTemplate> 

</

 

telerikDocking:RadPane>

 

 

 

 

0
Konstantina
Telerik team
answered on 11 Feb 2010, 03:20 PM
Hello Garry,

Thank you for contacting us.

The Title of the Pane is of type string. Therefore, the content of the TitleTemplate is of type string. So, it cannot be bound and access your ViewModel properties. We are considering improvement of the Pane's TitleTemplate.
Sorry for any inconveniences caused by not providing the particular required features.

If you have further questions please feel free to ask again.

All the best,
Konstantina
the Telerik team

Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
Follow the status of features or bugs in PITS and vote for them to affect their priority.
Tags
Docking
Asked by
Bradley
Top achievements
Rank 1
Answers by
Konstantina
Telerik team
Bradley
Top achievements
Rank 1
Garry Clark
Top achievements
Rank 1
Share this question
or