Selected tab image change

3 posts, 1 answers
  1. Virag
    Virag avatar
    6 posts
    Member since:
    Jan 2011

    Posted 02 Nov 2012 Link to this post

    I have set the Image in tab header In RadTab . Not I want to change the Image of selected tab.
    I need your help to sort out this issue.

    Following is my code

    <telerik:RadTabControl x:Name="ProductEditTabControl" Grid.Row="0" Style="{StaticResource StyleRadTabControl}" VerticalAlignment="Stretch" HorizontalAlignment="Stretch" SelectionChanged="ProductEditTab_SelectionChanged" >
                        <!-- GENERAL -->
                        <telerik:RadTabItem Name="GeneralTab" Style="{StaticResource TabItemStyle}">
                            <telerik:RadTabItem.HeaderTemplate >
                                <DataTemplate>
                                    <StackPanel>
                                        <StackPanel Name="GeneralStk">
                                            <Image Name="GeneralLogo" Height="75" Width="80" Source="/CROSS.Administration;component/Assets/general_normal_gray.png" VerticalAlignment="Center" Cursor="Hand" />
                                        </StackPanel>
                                    </StackPanel>
                                </DataTemplate>
                            </telerik:RadTabItem.HeaderTemplate>
     
                            <productViews:ProductEditGeneralCtrl />
                        </telerik:RadTabItem>
     
                        <!-- MATERIALS -->
                        <telerik:RadTabItem x:Name="MaterialsTab" Style="{StaticResource TabItemStyle}">
                            <telerik:RadTabItem.HeaderTemplate>
                                <DataTemplate>
                                    <StackPanel>
                                        <StackPanel>
                                            <Image x:Name="MaterialsLogo" Height="75" Width="80" Source="/CROSS.Administration;component/Assets/materials_normal_gray.png" VerticalAlignment="Center" Cursor="Hand" />
                                        </StackPanel>
                                    </StackPanel>
                                </DataTemplate>
                            </telerik:RadTabItem.HeaderTemplate>
     
                            <productViews:ProductEditMaterialCtrl />
                        </telerik:RadTabItem>
      </telerik:RadTabControl>


    Thanks
  2. Answer
    Pavel R. Pavlov
    Admin
    Pavel R. Pavlov avatar
    1183 posts

    Posted 06 Nov 2012 Link to this post

    Hello Virag,

    I am not sure if you are using a data-binding approach in your code snippet. I see static defined (XAML defined) data, such as images in combination with DataTemplates (which are designed to be used in data-binding approach) for the Headers of the RadTabItems.

    In declaratively defined RadTabItems, you can set the RadTabItem.Header property to your custom layout (without using DataTemplates). By doing so you will be able to change the Source of the images property in code-behind when the SelectionChanged event is triggered.

    Take a look at the attached project and let me know if it works in your scenario.

    All the best,
    Pavel R. Pavlov
    the Telerik team

    Explore the entire Telerik portfolio by downloading Telerik DevCraft Ultimate.

  3. DevCraft banner
  4. Virag
    Virag avatar
    6 posts
    Member since:
    Jan 2011

    Posted 06 Nov 2012 Link to this post

    Hi Pavel,

    Thanks for you help . It is almost the same what I needed .

    Thanks a lot :)

Back to Top