2011-08-19 101 views
0

我正在使用TabControl來託管工作區,使用約翰史密斯的This amazing文章中概述的方法。我想知道是否有一種方法可以在標籤控件沒有標籤時添加內容,如圖像。排序默認或空行爲。我想要有應用程序徽標,或者可能是一些有用的箭頭a-la Chrome的第一次使用標籤。WPF空TabControl內容

編輯:這可能有點複雜。我在下面顯示的標準tabcontrol上試過乍得的解決方案。但是,我用於工作區的tabcontrol是由使用數據模板的內容控件呈現的,我無法使用他的解決方案。 HB的解決方案進行了一些改變。

<DataTemplate x:Key="WorkspacesTemplate"> 
    <Grid> 
     <Image Name="image1" Stretch="Uniform" Source="/Affinity;component/Images/affinity_logo.png" Margin="20"/> 
     <TabControl IsSynchronizedWithCurrentItem="True" ItemsSource="{Binding}" 
       ItemTemplate="{StaticResource ClosableTabItemTemplate}" Margin="4"> 
      <TabControl.Style> 
       <Style TargetType="TabControl"> 
        <Style.Triggers> 
         <DataTrigger Binding="{Binding Items.Count, RelativeSource={RelativeSource Self}}" 
         Value="0"> 
          <Setter Property="Visibility" Value="Hidden" /> 
         </DataTrigger> 
        </Style.Triggers> 
       </Style> 
      </TabControl.Style> 
     <TabControl.Template> 
      <ControlTemplate TargetType="TabControl"> 
       <Grid Background="White"> 
        <Grid.RowDefinitions> 
         <RowDefinition Height="Auto" /> 
         <RowDefinition /> 
        </Grid.RowDefinitions> 
        <ScrollViewer HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Hidden" > 
         <StackPanel x:Name="HeaderPanel" 
          Orientation="Horizontal" 
          Panel.ZIndex ="1" 
          KeyboardNavigation.TabIndex="1" 
          Grid.Column="0" 
          Grid.Row="0" 
          Margin="2,2,2,0" 
          IsItemsHost="true"/> 
        </ScrollViewer> 
         <ContentPresenter x:Name="PART_SelectedContentHost" Grid.Row="1" 
              SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" 
              Margin="{TemplateBinding Padding}" 
              ContentSource="SelectedContent"/> 
       </Grid> 
      </ControlTemplate> 
     </TabControl.Template> 
    </TabControl> 
    </Grid> 
</DataTemplate> 

回答

5

如果您的圖片中沒有任何項目,您可以在圖片上疊加TabControl並隱藏它,

<Grid> 
    <Image /> 
    <TabControl> 
     <TabControl.Style> 
      <Style TargetType="TabControl"> 
       <Style.Triggers> 
        <DataTrigger Binding="{Binding Items.Count, RelativeSource={RelativeSource Self}}" 
          Value="0"> 
         <Setter Property="Visibility" Value="Hidden" /> 
        </DataTrigger> 
       </Style.Triggers> 
      </Style> 
     </TabControl.Style> 
    </TabControl> 
</Grid> 

或者你可以換一個ContentControl中的內容,還使用觸發器,如上述方法都contols影響佈局。例如

<ContentControl> 
    <ContentControl.Resources> 
     <Image x:Key="Image"/> 
     <TabControl x:Key="TabControl" ItemsSource="{Binding Data}" /> 
    </ContentControl.Resources> 
    <ContentControl.Style> 
     <Style TargetType="ContentControl"> 
      <Setter Property="Content" Value="{StaticResource TabControl}" /> 
      <Style.Triggers> 
       <DataTrigger Binding="{Binding Data.Count}" 
         Value="0"> 
        <Setter Property="Content" Value="{StaticResource Image}" /> 
       </DataTrigger> 
      </Style.Triggers> 
     </Style> 
    </ContentControl.Style> 
</ContentControl> 

請注意,這裏的DataTrigger應直接綁定到TabControl使用相同的集合。這是因爲如果綁定到TabControl.Items.Count,那麼此綁定將在觸發器觸發時斷開,因爲TabControl將被卸載。

+0

這看起來很有希望,我在我的問題中添加了一些代碼,以顯示我的內容控件如何綁定到工作區集合。我正試圖讓他們現在都工作。 – Tyrsius

+0

你的第一個解決方案結束了一些調整。 – Tyrsius

0

您可以將背景添加到選項卡控件。 XAML看起來像這樣:

<TabControl Height="290" HorizontalAlignment="Left" Margin="12,350,0,0" Name="TabControl" VerticalAlignment="Top" Width="481" TabIndex="200"> 
    <TabControl.Background> 
     <ImageBrush ImageSource="/EffectsViewer;component/res/someimage.png" /> 
    </TabControl.Background> 
</TabControl> 

只要確保您使用的圖像在您的資源中。它不難在Visual Studio中使用GUI添加。至於添加控件,這可能會更復雜一點。我認爲要做到這一點,你需要隱藏控件背後的東西,而它是空的,或者從它派生出來並自己實現它。