2010-08-12 269 views
2

我正在嘗試創建一個基本上看起來像中心頂部的按鈕和下面顯示tabitem內容的內容面板上的按鈕控制樣式。WPF TabControl模板+ ItemContainerStyle

我對模板有點新,但到目前爲止,除了一件事外,我的工作非常好。我希望能夠爲文本元素設置默認的背景顏色。通常情況下,我通過使用ContentPresenter和依賴項元素來完成此任務。所以像這樣的東西。

<ContentPresenter TextElement.Foreground="White"/> 

這基本上使此Presenter編寫的任何TextElement控件繼承此屬性。

現在我試圖做同樣的事情,但它不工作!我相信這與我的風格錯誤有關。

風格:

<Style x:Key="MainMenuTab" TargetType="{x:Type TabControl}"> 



     <Setter Property="Template"> 
      <Setter.Value> 

       <ControlTemplate TargetType="{x:Type TabControl}"> 

        <Grid KeyboardNavigation.TabNavigation="Local" Width="{TemplateBinding Width}"> 
         <Grid.RowDefinitions> 
          <RowDefinition Height="Auto"/> 
          <RowDefinition Height="*"/> 
         </Grid.RowDefinitions> 

         <!-- Tab Headers Panel --> 
         <Grid Grid.Row="0" Background="{StaticResource Brush_ApplicationTabBackground}"> 

          <TabPanel 
           Name="HeaderPanel" 
           Grid.Row="0" 
           Panel.ZIndex="1" 
           HorizontalAlignment="Center" 
           VerticalAlignment="Center" 
           IsItemsHost="True" 
           KeyboardNavigation.TabIndex="1" 
           Background="{StaticResource Brush_ApplicationTabBackground}" 
           > 


          </TabPanel> 


         </Grid> 



         <!-- Tab Body --> 
         <Border 
          Name="Border" 
          Grid.Row="1" 
          Background="{StaticResource Brush_ApplicationBackground}" 
          BorderBrush="Transparent" 
          BorderThickness="1" 
          CornerRadius="2" 
          KeyboardNavigation.TabNavigation="Local" 
          KeyboardNavigation.DirectionalNavigation="Contained" 
          KeyboardNavigation.TabIndex="2" > 

          <ContentPresenter 
           Name="PART_SelectedContentHost" 
           Margin="4" 
           ContentSource="SelectedContent" /> 
         </Border> 
        </Grid> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 




     <!-- Each Tab should look like this --> 
     <Setter Property="ItemContainerStyle"> 
      <Setter.Value> 
       <Style> 

        <Setter Property="Control.Template"> 
         <Setter.Value> 

          <ControlTemplate TargetType="{x:Type TabItem}"> 

           <Grid Background="{StaticResource Brush_ApplicationTabBackground}"> 
            <Border Width="50" x:Name="BorderTab" Height="50" Margin="5" BorderThickness="1" ClipToBounds="True" BorderBrush="Transparent" Background="Transparent" CornerRadius="5"> 
             <Rectangle x:Name="BackgroundRec" Fill="Transparent" Stroke="Transparent" Width="50" Height="50" HorizontalAlignment="Center" VerticalAlignment="Center"/> 
            </Border> 
            <ContentPresenter Name="TheHeaderContentPresenter" Width="50" Height="50" Margin="5" ContentSource="Header" HorizontalAlignment="Center" VerticalAlignment="Center" TextElement.Foreground="White"/> 
           </Grid> 

           <ControlTemplate.Triggers> 
            <Trigger Property="IsSelected" Value="True"> 
             <Trigger.Setters> 
              <Setter TargetName="BorderTab" Property="BorderBrush" Value="{StaticResource Brush_ApplicationTabHighlight}"/> 
              <Setter TargetName="BorderTab" Property="BorderThickness" Value="3"/> 
              <Setter TargetName="BackgroundRec" Property="Fill" Value="{StaticResource Brush_ApplicationTabHighlight}"/> 
              <Setter Property="Panel.ZIndex" Value="1"/> 
             </Trigger.Setters> 
            </Trigger> 

            <Trigger Property="IsSelected" Value="False"> 
             <Trigger.Setters> 
              <Setter TargetName="BorderTab" Property="BorderBrush" Value="{StaticResource Brush_ApplicationTabBackground}"/> 
              <Setter TargetName="BorderTab" Property="BorderThickness" Value="0"/> 
              <Setter TargetName="BackgroundRec" Property="Fill" Value="{StaticResource Brush_ApplicationTabBackground}"/> 
             </Trigger.Setters> 
            </Trigger> 
           </ControlTemplate.Triggers> 

          </ControlTemplate> 

         </Setter.Value> 
        </Setter> 

       </Style> 
      </Setter.Value> 
     </Setter> 

在我ItemContainerStyle下ContentPresenter有TextElement.Foreground = 「白」 屬性,但它不會打印白色文字!

我使用這種風格的tabcontrol看起來是這樣的:

<TabControl Grid.Row="2" Style="{StaticResource MainMenuTab}"> 


      <TabItem> 
       <TabItem.Header> 
        <TextBlock VerticalAlignment="Bottom" HorizontalAlignment="Center" Margin="0,0,0,5" Text="{x:Static UIStrings:ClientStrings.MainWindow_TabHeader_SingleWaveLength}"></TextBlock> 
       </TabItem.Header> 
       <TextBlock>TEST PANEL</TextBlock> 


     </TabItem> 
</TabControl> 

我知道這是compicated但我真的很喜歡這個工作。

回答

3

發現的解決方案。

基於HCL的文章,我找到了一個解決方案。我嘗試了同樣的確切問題,我試圖讓內容演示者設置繼承的依賴屬性。相反,我簡單地告訴模板應用依賴屬性,這樣每個tabitem的樣式都具有這個屬性,因此將它設置爲它的所有子節點。

<Setter Property="ItemContainerStyle"> 
    <Setter.Value> 
     <Style TargetType="TabItem"> 

      <Setter Property="TextElement.Foreground" Value="White"/> 

      <Setter Property="Template"> 
       <Setter.Value> 

        <ControlTemplate TargetType="{x:Type TabItem}"> 

         <Grid Background="{StaticResource Brush_ApplicationTabBackground}"> 
          <Border Width="50" x:Name="BorderTab" Height="50" Margin="5" BorderThickness="1" ClipToBounds="True" BorderBrush="Transparent" Background="Transparent" CornerRadius="5"> 
           <Rectangle x:Name="BackgroundRec" Fill="Transparent" Stroke="Transparent" Width="50" Height="50" HorizontalAlignment="Center" VerticalAlignment="Center"/> 
          </Border> 
          <ContentPresenter Name="TheHeaderContentPresenter" Width="50" Height="50" Margin="5" ContentSource="Header" HorizontalAlignment="Center" VerticalAlignment="Center"/> 
         </Grid> 

         <ControlTemplate.Triggers> 
          <Trigger Property="IsSelected" Value="True"> 
           <Trigger.Setters> 
            <Setter TargetName="BorderTab" Property="BorderBrush" Value="{StaticResource Brush_ApplicationTabHighlight}"/> 
            <Setter TargetName="BorderTab" Property="BorderThickness" Value="3"/> 
            <Setter TargetName="BackgroundRec" Property="Fill" Value="{StaticResource Brush_ApplicationTabHighlight}"/> 
            <Setter Property="Panel.ZIndex" Value="1"/> 
           </Trigger.Setters> 
          </Trigger> 

          <Trigger Property="IsSelected" Value="False"> 
           <Trigger.Setters> 
            <Setter TargetName="BorderTab" Property="BorderBrush" Value="{StaticResource Brush_ApplicationTabBackground}"/> 
            <Setter TargetName="BorderTab" Property="BorderThickness" Value="0"/> 
            <Setter TargetName="BackgroundRec" Property="Fill" Value="{StaticResource Brush_ApplicationTabBackground}"/> 
           </Trigger.Setters> 
          </Trigger> 
         </ControlTemplate.Triggers> 

        </ControlTemplate> 

       </Setter.Value> 
      </Setter> 

     </Style> 
    </Setter.Value> 
</Setter> 

所有我真的不添加一行:

<Setter Property="TextElement.Foreground" Value="White"/> 

控制模板之前!我也從內容演示者那裏拿出白色文本,因爲它沒用。

+0

只是一個快速注意。 這最終(在我的情況下)設置所有TabItem的字體樣式,而不僅僅是標題。我正在解決這個問題。 – 2010-08-12 21:15:40