Elazar Leibovich
Elazar Leibovich

Reputation: 33583

Hide the TabControl header

What's the programmatic way (ie not using styles as in this question, but using code) to hide the TabControl header? I'll be glad for a snippet.

Upvotes: 48

Views: 62884

Answers (7)

Ronnie
Ronnie

Reputation: 261

If you use C# and set the x:Name for the TabItem, you can also manipulate the Visibility like so:

tabItemName.Visibility = Visibility.Collapsed;

Upvotes: 1

user3549063
user3549063

Reputation: 1

private void TabItemControl_MouseEnter(object sender, MouseEventArgs e)
{
    if (this.TabItemControl.IsSelected == false)
    {
        this.TabItemControl.Opacity = 100;
    }
}

private void TabItemControl_MouseLeave(object sender, MouseEventArgs e)
{
    if (this.TabItemControl.IsSelected == false)
    {
        this.TabItemControl.Opacity = 0;
    }
}

private void TabAllControl_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
    if (this.TabItemControl.IsSelected == false)
    {
        this.TabItemControl.Opacity = 0;
    }
}

Upvotes: -3

Eric Eggers
Eric Eggers

Reputation: 84

I've tried this in some code where I populate the tab items manually...

tabItemToAdd.Visibility = Visibility.Collapsed;

...but then I had a weird thing happen where the second time I'd clear out the tab control's items, create the tab item again and use this approach before adding it to the tab control, the entire tab item and its contents were gone, not just the tab header. So I've had success with the programmatic equivalent of this solution:

tabItemToAdd.Template = new ControlTemplate();

Upvotes: 1

Sebastian
Sebastian

Reputation: 395

Simple XAML Style

<TabControl>
    <TabControl.ItemContainerStyle>
        <Style TargetType="{x:Type TabItem}">
            <Setter Property="Visibility" Value="Collapsed"/>
        </Style>
    </TabControl.ItemContainerStyle>
    ...
</TabControl>

Upvotes: 22

EightyOne Unite
EightyOne Unite

Reputation: 11795

Actually, it's very straight forward to hide the tab strip. You just set each TabItems Visibility to Collapsed. You still see the tab content,...just not the tab header itself.

Upvotes: 94

Thomas Levesque
Thomas Levesque

Reputation: 292345

Style s = new Style();
s.Setters.Add(new Setter(UIElement.VisibilityProperty, Visibility.Collapsed));
tabControl.ItemContainerStyle = s;

Upvotes: 50

Anvaka
Anvaka

Reputation: 15823

Well, there are several ways to do this.

The ugliest way: Use VisualTreeHelper to find TabPanel (or any other Panel you use to host items), and set it's Visibility property to Visibility.Collapsed. Why ugly? It's easy to create few annoying bugs here or break this approach with 'harmless' style update if you was not careful enough...

I prefer using combination of Xaml and code behind. You bind either TabItem's visibility to view model property or TabPanel's visibility to view model property. In both cases you have to override style (either ItemContainer's style or whole TabControl's style). In both cases you have view model. Now, to toggle tab header's visibility, you just update a property in the view model. Here is an example with TabItems:

XAML

<Window x:Class="WpfApplication5.Window1"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:local="clr-namespace:WpfApplication5"
        Title="Tab Settings"
        Height="300"
        Width="300">
  <Window.Resources>
    <local:TabControlViewModel x:Key="tabVM" />
    <BooleanToVisibilityConverter x:Key="booleanToVisibilityConverter" />
  </Window.Resources>
  <Grid>
    <TabControl DataContext="{StaticResource tabVM}">
      <TabControl.ItemContainerStyle>
        <Style TargetType="{x:Type TabItem}">
          <Setter Property="Visibility"
                  Value="{Binding TabHeaderVisible, Converter={StaticResource booleanToVisibilityConverter}}" />
        </Style>
      </TabControl.ItemContainerStyle>
      <TabItem Header="Tab 1">
        <StackPanel>
          <TextBlock Text="Content" />
          <Button Content="Toggle Header"
                  Click="ToggleHeaderClick" />
        </StackPanel>
      </TabItem>
      <TabItem Header="Tab 2 Header">
        <TextBlock Text="Tab 2 Content" />
      </TabItem>
    </TabControl>
  </Grid>
</Window>

C#

using System.ComponentModel;
using System.Windows;
using System.Windows.Input;

namespace WpfApplication5
{
  public partial class Window1 : Window
  {
    public Window1()
    {
      InitializeComponent();
    }

    private void ToggleHeaderClick(object sender, RoutedEventArgs e)
    {
      var tabControlVM =
        ((FrameworkElement)sender).DataContext as TabControlViewModel;
      if (tabControlVM != null)
      {
        tabControlVM.TabHeaderVisible = !tabControlVM.TabHeaderVisible;
      }
    }
  }

  public class TabControlViewModel : INotifyPropertyChanged
  {
    private bool _tabHeaderVisible = true;

    public ICommand ToggleHeader
    {
      get; private set;
    }

    public bool TabHeaderVisible
    {
      get { return _tabHeaderVisible; }
      set
      {
        _tabHeaderVisible = value;
        OnPropertyChanged("TabHeaderVisible");
      }
    }

    public event PropertyChangedEventHandler PropertyChanged;

    private void OnPropertyChanged(string name)
    {
      var changed = PropertyChanged;
      if (changed != null)
      {
        changed(this, new PropertyChangedEventArgs(name));
      }
    }
  }
}

Upvotes: 9

Related Questions