XAML 在不更改颜色的情况下更改背景不透明度

本文关键字:情况下 背景 不透明度 颜色 XAML | 更新日期: 2023-09-27 18:06:54

在我的C#/WPF/.NET 4.5应用程序中,我想实现一个Trigger,在不更改其颜色的情况下切换控件的背景不透明度。

通常要设置控件的背景画笔,我会使用以下Setter

<Setter TargetName="TargetControl" Property="Background">
<Setter.Value>
  <SolidColorBrush Color="Red" Opacity="0.2"/>
</Setter.Value>

现在我处于一种情况,我只需要改变不透明度而不是颜色。在这种情况下,我不在乎背景是什么颜色,但我想在改变不透明度的同时保留颜色,我的二传手会是什么样子?

更多详情:

这样做的原因是我正在研究一个ItemsControl,其中背景颜色根据项目的AlternationIndex而变化:

<ItemsControl ItemsSource="{Binding SomeCollection}" AlternationCount="6">
  <ItemsControl.ItemTemplate>
    <DataTemplate>
      <Grid x:Name="GridWithin">
      <!-- ... -->
      </Grid>
      <DataTemplate.Triggers>
        <!-- Aternating colors for each row -->
        <Trigger Property="ItemsControl.AlternationIndex" Value="0">
          <Setter TargetName="GridWithin" Property="Background">
            <Setter.Value>
              <SolidColorBrush Color="Red" Opacity="0.2"/>
            </Setter.Value>
          </Setter>
        </Trigger>
        <Trigger Property="ItemsControl.AlternationIndex" Value="1">
          <Setter TargetName="AllGesturesDataTemplateGrid" Property="Background">
            <Setter.Value>
              <SolidColorBrush Color="Green" Opacity="0.2"/>
            </Setter.Value>
          </Setter>
        </Trigger>
        <!-- ... -->
        <!-- Highlight when a hit is registered -->
        <DataTrigger>
          <DataTrigger.Conditions>
            <Condition Binding="{Binding IsHit}" Value="True" />
          </MultiDataTrigger.Conditions>
          <!-- The culprit -->
          <Setter TargetName="GridWithin" Property="Background">
            <Setter.Value>
              <SolidColorBrush Opacity="0.7"/>
            </Setter.Value>
          </Setter>
          <!-- /culprit -->
        </DataTrigger>
      </DataTemplate.Triggers>
    </DataTemplate>
  </ItemsControl.ItemTemplate>
</ItemsControl>

XAML 在不更改颜色的情况下更改背景不透明度

我花了一点时间才想到最好的方法......事实证明,这比我最初想象的要棘手。尽管如此,这是可能的,但它确实涉及相当多的代码。为了能够定位Background Brush对象的实际Opacity属性,您需要使用StoryBoard...这就是此代码示例如此冗长的原因。

因为我们需要在 DataTrigger 中使用 Storyboard 对象,这意味着我们必须将DataTrigger.EnterActions用作在正常DataTrigger.Setters集合中无法使用的Storyboard。因此,我们还必须使用 DataTrigger.ExitActions 提供另一个Storyboard,将 Opacity 属性设置回其原始值。试试这个:

<Grid Name="YourGrid">
    <Grid.Background>
        <SolidColorBrush Color="Green" Opacity="0.2" />
    </Grid.Background>
    <Grid.Style>
        <Style TargetType="{x:Type Grid}">
            <Style.Triggers>
                <DataTrigger Binding="{Binding IsMouseOver, ElementName=YourGrid}" 
                    Value="True">
                    <DataTrigger.EnterActions>
                        <BeginStoryboard>
                            <Storyboard>
                                <DoubleAnimationUsingKeyFrames 
Storyboard.TargetProperty="Background.(SolidColorBrush.Opacity)">
                                    <LinearDoubleKeyFrame Value="0.7" KeyTime="0:0:0"/>
                                </DoubleAnimationUsingKeyFrames>
                            </Storyboard>
                        </BeginStoryboard>
                    </DataTrigger.EnterActions>
                    <DataTrigger.ExitActions>
                        <BeginStoryboard>
                            <Storyboard>
                                <DoubleAnimationUsingKeyFrames 
Storyboard.TargetProperty="Background.(SolidColorBrush.Opacity)">
                                    <LinearDoubleKeyFrame Value="0.2" KeyTime="0:0:0"/>
                                </DoubleAnimationUsingKeyFrames>
                            </Storyboard>
                        </BeginStoryboard>
                    </DataTrigger.ExitActions>
                </DataTrigger>
            </Style.Triggers>
        </Style>
    </Grid.Style>
</Grid>

尽管实现此方法需要大量代码,但它确实完全符合您的要求。但是,有一种更简单的方法可以获得相同的整体效果,但代码略少。您可以简单地在每个Grid单元格的背面添加一个Rectangle,或者划分并设置颜色和不透明度。使用此方法,您可以直接设置Rectangle.Opacity值,尽管您将使用额外的控件...选择权在你。

这个答案几乎与@Sheridans相同,但它节省了几行 XAML(而且总是

太多了......
Grid Name="YourGrid">
    <Grid.Background>
        <SolidColorBrush Color="Green" Opacity="0.2" />
    </Grid.Background>
    <Grid.Style>
        <Style TargetType="{x:Type Grid}">
            <Style.Triggers>
                <DataTrigger Binding="{Binding IsMouseOver, ElementName=YourGrid}" 
                    Value="True">
                    <DataTrigger.EnterActions>
                        <BeginStoryboard>
                            <Storyboard Storyboard.TargetProperty="Background.(SolidColorBrush.Opacity)">
                                <DoubleAnimation To="0.7" Duration="0" />
                            </Storyboard>
                        </BeginStoryboard>
                    </DataTrigger.EnterActions>
                    <DataTrigger.ExitActions>
                        <BeginStoryboard>
                            <Storyboard Storyboard.TargetProperty="Background.(SolidColorBrush.Opacity)">
                                <DoubleAnimation To="0.2" Duration="0" />
                            </Storyboard>
                        </BeginStoryboard>
                    </DataTrigger.ExitActions>
                </DataTrigger>
            </Style.Triggers>
        </Style>
    </Grid.Style>
</Grid>
">

网格"有自己的"不透明度"属性以及"背景"属性。 也许使用触发器来更改不透明度并保留背景颜色?