Close button in one RadTabItem

5 posts, 0 answers
  1. Roy Halvorsen
    Roy Halvorsen avatar
    83 posts
    Member since:
    Oct 2008

    Posted 24 Jun 2010 Link to this post

    I want to ad a close button to 1 out of 2 RadTabItems. The documentation ads the button to all RadTabItems. How can I do this?
    My xaml code is as follows (and I want the close button on the second RadTabItem, never the first one):
    <telerik:RadTabControl> 
    <telerik:RadTabItem Header="{Binding ElementName=operationContentControl, Path=Content.DataContext.Header}" IsSelected="{Binding IsOperationSelected, Mode=TwoWay}"
    <ContentControl x:Name="operationContentControl" cal:RegionManager.RegionName="{x:Static infrastructure:RegionNames.MainRegion}" /></telerik:RadTabItem> 
    <telerik:RadTabItem Header="{Binding ElementName=protocolContentControl, Path=Content.DataContext.Header}" IsSelected="{Binding IsProtocolSelected, Mode=TwoWay}" Visibility="{Binding IsProtocolVisible, Converter={StaticResource boolToVisibilityConverter}}"
    <ContentControl x:Name="protocolContentControl" cal:RegionManager.RegionName="{x:Static infrastructure:RegionNames.ProtocolRegion}" /><telerik:RadTabItem> 
    </telerik:RadTabControl> 
     

    Regards,
    Roy
  2. Tina Stancheva
    Admin
    Tina Stancheva avatar
    3298 posts

    Posted 28 Jun 2010 Link to this post

    Hello Roy Halvorsen,

    You can define a HeaderTemplate for the second TabItem and add the close button there:
    <telerik:RadTabControl>
        <telerik:RadTabItem Header="{Binding ElementName=operationContentControl, Path=Content.DataContext.Header}"
                    IsSelected="{Binding IsOperationSelected, Mode=TwoWay}">
            <ContentControl x:Name="operationContentControl"
                    cal:RegionManager.RegionName="{x:Static infrastructure:RegionNames.MainRegion}" />
        </telerik:RadTabItem>
        <telerik:RadTabItem  IsSelected="{Binding IsProtocolSelected, Mode=TwoWay}"
                     Visibility="{Binding IsProtocolVisible, Converter={StaticResource boolToVisibilityConverter}}">
            <telerikNavigation:RadTabItem.HeaderTemplate>
                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="*"/>
                        <ColumnDefinition Width="Auto"/>
                    </Grid.ColumnDefinitions>
                    <TextBlock Text="{Binding ElementName=protocolContentControl, Path=Content.DataContext.Header}"/>
                    <Button Grid.Column="1" Content="x" Width="16"
                                           Height="20" HorizontalAlignment="Center"
                                           VerticalAlignment="Center"
                                           example:RoutedEventHelper.EnableRoutedClick="True" />
                </Grid>
            </telerikNavigation:RadTabItem.HeaderTemplate>
            <ContentControl x:Name="protocolContentControl"
                    cal:RegionManager.RegionName="{x:Static infrastructure:RegionNames.ProtocolRegion}" />
        <telerik:RadTabItem>
    </telerik:RadTabControl>
    Then for the close button can be implemented the logic described here.

    Give this approach a try and let me know if this is what you had in mind.

    Greetings,
    Tina Stancheva
    the Telerik team
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
  3. UI for WPF is Visual Studio 2017 Ready
  4. Selva
    Selva avatar
    3 posts
    Member since:
    Mar 2009

    Posted 10 Aug 2011 Link to this post

    When i try to add the HeaderTemplate, i get a message stating that "The attachable property "HeaderTemplate" was not found in the type RadTabItem". I am using the telerik WPF Controls 2011 Q2 version. How do i have the close button on each tabitem? That is what i am trying to achieve...
  5. Tina Stancheva
    Admin
    Tina Stancheva avatar
    3298 posts

    Posted 11 Aug 2011 Link to this post

    Hi Selva,

    I am not sure what is causing this issue. This is why I attached a sample project illustrating how to create a RadTabControl where the RadTabItem's Header defines a Close button. The control is databound and two approaches are demonstrated - using the ItemTemplate/ContentTemplate properties of the RadTabControl to apply templates for the tabs, and using ItemContainerStyle to set a HeaderTemplate/ContentTemplate for the RadTabItems.

    Please have a look at the sample and let me know if it helps.

    Greetings,
    Tina Stancheva
    the Telerik team

    Explore the entire Telerik portfolio by downloading the Ultimate Collection trial package. Get now >>

  6. Selva
    Selva avatar
    3 posts
    Member since:
    Mar 2009

    Posted 11 Aug 2011 Link to this post

    Thanks. This is what i was looking for. I was able to figure out. Thanks again.
Back to Top
UI for WPF is Visual Studio 2017 Ready