How can I conditionally hide the TabPanel portion of a TabControl in its entirety?

Question

I've found a lot of variations of this question, but the conversation always seems to revolve around the individual TabItems, and not the TabPanel as a thing unto itself.

My main window has a TabControl on it. The tabs are views. One of those views is special...a navigation display, whereas all of the others are the "sections" that the nav view can open.

What I am trying to accomplish is that when the user is viewing the nav view, the tabs all go away. I.e. hide the whole TabPanel instead of having to hide each TabItem one-by-one. While viewing any other page, the tabs show, for easy movement between views.

I created this question in response to a suggestion made on my other question.

The problem I have is that the TabPanel does not seem to have a Template that I can override in order to do something like a DataTrigger bound to the Visibility property. The closest I have gotten is a plain old Style.Setter.

Any suggestions on how to get what I am after?

Answer 1

You basically provided the answer yourself - the right combination is to use a Style together with a DataTrigger. The trick is to define a Style with TargetType set to {x:Type TabPanel}, and put it as a resource of the TabControl - that way the style will be applied to the TabPanel (because it's an implicit style). Here's an example:

<TabControl (...)>
    <TabControl.Resources>
        <Style TargetType="{x:Type TabPanel}">
            <Style.Triggers>
                <DataTrigger Binding="{Binding SelectedIndex, RelativeSource={RelativeSource AncestorType=TabControl}}"
                             Value="0">
                    <Setter Property="Visibility" Value="Collapsed" />
                </DataTrigger>
            </Style.Triggers>
        </Style>
    </TabControl.Resources>
    (...)
</TabControl>

In this example the panel will be collapsed while the first item is selected.