WPF TabControl 所選項目顏色從背面代碼更改

Question

我是 C# 和 WPF 的新手，所以如果有愚蠢的問題，請原諒:-)。 我想從后面的代碼中動態更改選定的選項卡顏色屬性。 我發現很少有解決方案，但僅適用於 static 顏色變化。 未選中選項卡的動態顏色更改已完成。 請看代碼：

XAML：

<TabControl x:Name="tabSections" Margin="0,400,0,20" Width="1348" BorderBrush="{x:Null}" FontSize="16" FontWeight="Bold" Visibility="Visible" TabStripPlacement="Top" Cursor="Hand" SelectionChanged="tabSections_SelectionChanged">
    <TabControl.Background>
        <SolidColorBrush Color="#FF464646" Opacity="1"/>
    </TabControl.Background>
    <TabItem x:Name="tabSect1"  Width="168" Height="30" Header="Section 1">
    </TabItem>
    <TabItem x:Name="tabSect2" Width="168" Height="30" Header="Section 2">
    </TabItem>
    <TabItem x:Name="tabSect3" Width="168" Height="30" Header="Section 3">
    </TabItem>
    <TabItem x:Name="tabSect4" Width="168" Height="30" Header="Section 4">
    </TabItem>
    <TabItem x:Name="tabSect5" Width="168" Height="30" Header="Section 5">
    </TabItem>
    <TabItem x:Name="tabSect6" Width="168" Height="30" Header="Section 6">
    </TabItem>
    <TabItem x:Name="tabSect7" Width="168" Height="30" Header="Section 7">
    </TabItem>
    <TabItem x:Name="tabSect8" Width="168" Height="30" Header="Section 8">
    </TabItem>
</TabControl>

C#：

  for (int i = 0; i < SectionCount; i++)
    {
        if (TabsColors[i])
        {
            TabBrushes[i] = Brushes.Orange;
        }
        else
        {
            TabBrushes[i] = Brushes.LightGreen;
        }
    }
    for (int j = SectionCount; j < 8; j++)
    {
        TabBrushes[j] = Brushes.DarkGray;
    }
    tabSect1.Background = TabBrushes[0];
    tabSect2.Background = TabBrushes[1];
    tabSect3.Background = TabBrushes[2];
    tabSect4.Background = TabBrushes[3];
    tabSect5.Background = TabBrushes[4];
    tabSect6.Background = TabBrushes[5];
    tabSect7.Background = TabBrushes[6];
    tabSect8.Background = TabBrushes[7];

提前感謝您的幫助。 祝你今天過得愉快。

Answer 1

您始終可以通過引用SelectedItem屬性來獲取Selector控件的選定項。

要使用Style ，只需將Brush作為動態資源引用並從例如您的代碼隱藏中更改它：

主窗口.xaml

<Window>
  <Window.Resources>
    <SolidColorBrush x:Key="SelectedItemBackgroundBrush"
                     Color="Red" /> 

    <Style TargetType="{x:Type TabItem}">
      <Setter Property="Template">
        <Setter.Value>
          <ControlTemplate TargetType="{x:Type TabItem}">
            <Border x:Name="Border"
                    Margin="0,0,-4,0"
                    CornerRadius="2,12,0,0"
                    Background="{TemplateBinding Background}"
                    BorderBrush="{TemplateBinding BorderBrush}"
                    BorderThickness="{TemplateBinding BorderThickness}">
              <ContentPresenter x:Name="ContentSite"
                                VerticalAlignment="Center"
                                HorizontalAlignment="Center"
                                ContentSource="Header"
                                Margin="12,2,12,2"
                                RecognizesAccessKey="True" />
            </Border>
            
            <ControlTemplate.Triggers>
              <Trigger Property="IsMouseOver"
                       Value="True">
                <Setter Property="Background"
                        Value="LightGray" />
              </Trigger>
              <Trigger Property="IsSelected"
                       Value="True">
                <Setter Property="Panel.ZIndex"
                        Value="100" />
                <Setter Property="Background"
                        Value="{DynamicResource SelectedItemBackgroundBrush}" />
              </Trigger>
            </ControlTemplate.Triggers>
          </ControlTemplate>
        </Setter.Value>
      </Setter>
    </Style>
  </Window.Resources>
</Window>

主窗口.xaml.cs

this.Resources["SelectedItemBackgroundBrush"] = Brushes.GreenYellow;

當您需要訪問集合的每個元素時，您永遠不應該顯式訪問它。 而是您會遍歷集合：

for (int tabItemIndex = 0; tabItemIndex < this.tabSections.Count; tabItemindex++)
{
  var tabItem = this.tabSections.Items[tabItemIndex] as TabItem;
  tabItem.Background = this.TabBrushes[tabItemIndex];
}

// Alternative way to change the color of the selected item
var selectedTabItem = this.tabSections.SelectedItem as TabItem;
selectedTabItem.Background = this.TabBrushes[tabItemIndex];

Answer 2

首先，我要感謝@BionicCode 的幫助。

我從一開始就犯的錯誤是XAML中的觸發聲明順序。

下面的例子首先聲明了 selected 選項卡屬性，然后啟用了覆蓋的選項卡屬性，因此選擇的屬性沒有機會被看到。

<ControlTemplate.Triggers>
    <Trigger Property="IsMouseOver" Value="True">
        <Setter TargetName="border" Value="LightGray" />
    </Trigger>
    <Trigger Property="IsSelected" Value="True">
        <Setter TargetName="border" Property="Background" Value="{DynamicResource SelectedItemBackgroundBrush}" />
        <Setter Property="Foreground" Value="Black"/>
        <Setter Property="FontWeight" Value="Bold"/>
        <Setter Property="FontSize" Value="16"/>
    </Trigger>
    <Trigger Property="IsEnabled" Value="False">
        <Setter TargetName="border" Property="Background" Value="#FF464646" />
        <Setter Property="Foreground" Value="Gray"/>
        <Setter Property="FontWeight" Value="UltraLight"/>
    </Trigger>
    <Trigger Property="IsEnabled" Value="True">
        <Setter TargetName="border" Property="Background" Value="{DynamicResource EnabledItemBackgroundBrush}" />
        <Setter Property="Foreground" Value="Black"/>
        <Setter Property="FontWeight" Value="UltraLight"/>
    </Trigger>
</ControlTemplate.Triggers>

正確的順序是（啟用屬性之后的選定屬性）：

    <ControlTemplate.Triggers>
        <Trigger Property="IsMouseOver" Value="True">
            <Setter TargetName="border" Value="LightGray" />
        </Trigger>
        <Trigger Property="IsEnabled" Value="False">
            <Setter TargetName="border" Property="Background" Value="#FF464646" />
            <Setter Property="Foreground" Value="Gray"/>
            <Setter Property="FontWeight" Value="UltraLight"/>
        </Trigger>
        <Trigger Property="IsEnabled" Value="True">
            <Setter TargetName="border" Property="Background" Value="{DynamicResource EnabledItemBackgroundBrush}" />
            <Setter Property="Foreground" Value="Black"/>
            <Setter Property="FontWeight" Value="UltraLight"/>
        </Trigger>
        <Trigger Property="IsSelected" Value="True">
            <Setter TargetName="border" Property="Background" Value="{DynamicResource SelectedItemBackgroundBrush}" />
            <Setter Property="Foreground" Value="Black"/>
            <Setter Property="FontWeight" Value="Bold"/>
            <Setter Property="FontSize" Value="16"/>
        </Trigger>
    </ControlTemplate.Triggers>

祝你有美好的一天！