RadTabTitem styling

4 posts, 1 answers
  1. FirstName
    FirstName avatar
    6 posts
    Member since:
    Sep 2017

    Posted 08 Nov 2017 Link to this post

    Hi, everyone. For example, I have such chunk of code:

    01.<telerik:RadTabControl
    02.    Name="someNamehere"
    03.    HorizontalAlignment="Stretch"
    04.    Height="100" Margin="7"
    05.    VerticalAlignment="Center"
    06.    Foreground="anyColor"
    07.    telerik:TouchManager.IsTouchHitTestVisible="False"
    08.    BorderThickness="1 3 1 1"
    09.    BorderBrush="{telerik:Windows8Resource ResourceKey=BasicBrush}"
    10.    Style="{DynamicResource InnovaRadTabControlStyle}"
    11.    ItemsSource="{Binding anyViewModelHere, UpdateSourceTrigger=PropertyChanged}"
    12.    SelectedIndex="{Binding anyIndexValueHere, UpdateSourceTrigger=PropertyChanged}">
    13. 
    14.    <telerik:RadTabControl.Resources>
    15.        <Style TargetType="telerik:RadTabItem" BasedOn="{StaticResource CustomStyleHere}">
    16.            <Setter Property="HeaderForeground" Value="Red"/>
    17.        </Style>
    18.    </telerik:RadTabControl.Resources>
    19.    <telerik:RadTabControl.ContentTemplate>
    20.        <DataTemplate DataType="Unit1:ViewModel2Here">
    21.        <unit1:ViewModel2 DataContext="{Binding DataContext, RelativeSource={RelativeSource Self}, UpdateSourceTrigger=PropertyChanged}"/>
    22.    </DataTemplate>
    23.    </telerik:RadTabControl.ContentTemplate>
    24.</telerik:RadTabControl>

     

    Why style for telerik:RadTabItem (lines 14-18) is not working at all ? Thanks in advance !

  2. Answer
    Sia
    Admin
    Sia avatar
    745 posts

    Posted 10 Nov 2017 Link to this post

    Hello,
     
    I am not sure what is behind CustomStyleHere. If it is a custom style that targets RadTabItem and you use implicit styling, it should be based on the Telerik RadTabItemStyle that we provide with our source. However I have tested on my end the following custom style (in the RadTabControl.Resources) and it works as expected:
    <Style TargetType="telerik:RadTabItem" BasedOn="{StaticResource RadTabItemStyle}">
        <Setter Property="HeaderForeground" Value="Red"/>
    </Style>

    If you use StyleManager, just remove the BasedOn from the style above.
    In case you still experience issues with this style, I would appreciate if it is possible to send us a small project with all related customizations.

    Regards,
    Sia
    Progress Telerik
    Want to extend the target reach of your WPF applications, leveraging iOS, Android, and UWP? Try UI for Xamarin, a suite of polished and feature-rich components for the Xamarin framework, which allow you to write beautiful native mobile apps using a single shared C# codebase.
  3. Anthony
    Anthony avatar
    3 posts
    Member since:
    Dec 2017

    Posted 20 Mar in reply to Sia Link to this post

    I created a WPF <UserControl></UserControl> and replaced it with <telerik:RadTabItem></telerik:RadTabItem>.  I also changed the inherited class in the code behind.  Tabs are added with Region.RequestNavigation and display at run-time correctly, but in the designer there is no styling and I cannot see the tab's content.  I had to put that content in a separate user control and view it there.  I prefer not do do that.

    I had a similar problem with the RadDocumentTab and found the following article which corrected the design time behavior.

    https://docs.telerik.com/devtools/wpf/styling-and-appearance/styling-apperance-styling-the-controls

    this is my app.xaml

     

    <ResourceDictionary.MergedDictionaries>
                 <ResourceDictionary Source="/Telerik.Windows.Themes.Office2016;component/Themes/System.Windows.xaml" />
                 <ResourceDictionary Source="/Telerik.Windows.Themes.Office2016;component/Themes/Telerik.Windows.Controls.xaml" />
                 <ResourceDictionary Source="/Telerik.Windows.Themes.Office2016;component/Themes/Telerik.Windows.Controls.Input.xaml" />
                 <ResourceDictionary Source="/Telerik.Windows.Themes.Office2016;component/Themes/Telerik.Windows.Controls.Data.xaml" />
                 <ResourceDictionary Source="/Telerik.Windows.Themes.Office2016;component/Themes/Telerik.Windows.Controls.Navigation.xaml" />
                 <ResourceDictionary Source="/Telerik.Windows.Themes.Office2016;component/Themes/Telerik.Windows.Controls.Docking.xaml" />
                 <ResourceDictionary Source="/Telerik.Windows.Themes.Office2016;component/Themes/Telerik.Windows.Controls.FixedDocumentViewers.xaml" />
                 <ResourceDictionary Source="/Telerik.Windows.Themes.Office2016;component/Themes/Telerik.Windows.Controls.GridView.xaml" />
             </ResourceDictionary.MergedDictionaries>
     
             <Style x:Key="custRadDocumentPaneStyle" TargetType="telerik:RadPane"       BasedOn="{StaticResource RadPaneStyle}"></Style>
             <Style x:Key="custRadTabControlStyle"   TargetType="telerik:RadTabControl" BasedOn="{StaticResource RadTabControlStyle}"></Style>
             <Style x:Key="custRadTabItemStyle"      TargetType="telerik:RadTabItem"    BasedOn="{StaticResource RadTabItemStyle}"></Style>

     

    in my user control I have this

     

    <telerik:RadTabItem  x:Class="Membership.Module.Views.Partial.PersonNotesTab"
             xmlns:i="http://schemas.microsoft.com/expression/2010/interactivity"        
             xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"
             xmlns:prism="http://prismlibrary.com/"
             prism:ViewModelLocator.AutoWireViewModel="True" 
             Style="{StaticResource custRadTabItemStyle}"
             Header="Notes" >

    My views are in a separate PRISM module if that makes a difference and I am using the NoXaml dlls.

     

    Thanks in advance

    Anthony

     

     

     

  4. Sia
    Admin
    Sia avatar
    745 posts

    Posted 22 Mar Link to this post

    Hello,

    Can you please send us the custom UserControl implementation and the way the TabItems are added in your application? Why do you need these UserControls? The best option would be if you manage to isolate them in a separate project and check whether the same issue appears. 

    Regards,
    Sia
    Progress Telerik
    Want to extend the target reach of your WPF applications, leveraging iOS, Android, and UWP? Try UI for Xamarin, a suite of polished and feature-rich components for the Xamarin framework, which allow you to write beautiful native mobile apps using a single shared C# codebase.
Back to Top