具有相同颜色（不透明度）和不同字体大小的两个文本块出现不同

Posted 2023-03-06

【中文标题】具有相同颜色（不透明度）和不同字体大小的两个文本块出现不同

【英文标题】：Two TextBlocks with same Color (Opacity) and diffrent Fontsizes appear diffrently

【发布时间】：2021-01-02 00:16:40

【问题描述】：

我有两个具有相同前景的 TextBlock，但显示方式不同。 TextBlocks 之间的差异是 FontSize。放大/缩小时，颜色也会发生变化。

First Image

Second Image

Third Image

Fourth Image

通过设置<Setter Property="TextOptions.TextFormattingMode" Value="Display" /> 它可以工作，但是 ViewBox 中显示的文本会变得模糊。 TextFormattingMode "Display" 不能在 ViewBox 中使用，请参阅here。

为什么会这样？为什么默认颜色不同？有什么解决办法吗？

<Window x:Class="ColoringWithOpacity.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:local="clr-namespace:ColoringWithOpacity"
    mc:Ignorable="d"
    Title="MainWindow" Height="450" Width="800"
    Background="Black">
<Window.Resources>
<Style TargetType="x:Type TextBlock">
  <Setter Property="FontFamily" Value="Segoe UI"/>
  <Setter Property="FontWeight" Value="Semibold"/>
</Style>

<Style TargetType="x:Type Run">
  <Setter Property="FontFamily" Value="Segoe UI"/>
  <Setter Property="FontWeight" Value="Semibold"/>
</Style>

<SolidColorBrush x:Key="W25" Opacity="0.25" Color="#FFFFFF"/>
</Window.Resources>
 <UniformGrid Columns="1">

<Grid>
  <Grid.RowDefinitions>
    <RowDefinition Height="*" />
    <RowDefinition Height="*" />
  </Grid.RowDefinitions>
  <Grid.ColumnDefinitions>
    <ColumnDefinition Width="*"></ColumnDefinition>
    <ColumnDefinition Width="*"></ColumnDefinition>
  </Grid.ColumnDefinitions>

  <Viewbox Grid.RowSpan="2">

    <TextBlock Foreground="StaticResource W25" Text="13.55" >
      <!--<Run Text="13.55"/>-->  <!--Works the same-->
    </TextBlock>
  </Viewbox>
  <Viewbox Grid.Row="2" Grid.Column="2">

    <TextBlock Foreground="StaticResource W25" Text="mm" >
      <!--<Run Text="mm"/>--> <!--Works the same-->
    </TextBlock>
  </Viewbox>
</Grid>
<Viewbox>
  <TextBlock Foreground="StaticResource W25">
    <Run Text="13.55" FontSize="64"/>
    <Run Text="mm" FontSize="40"/>
  </TextBlock>
</Viewbox>

【问题讨论】：

出于好奇，设置Foreground="#3FFFFFFF"时它的行为是否相同？

@Clemens 是的，它的行为是一样的。

【参考方案1】：

我在使用 WPF 应用程序时遇到了同样的问题。我不明白为什么 SolidColorBrush 上的 Opacity 不起作用，但解决方案是在 UI 元素上移动不透明度，而不是 SolidColorBrush。

<Window x:Class="WpfApp1.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:WpfApp1"
        mc:Ignorable="d"  Background="Black"
        Title="MainWindow" Height="450" Width="800">
    <Window.Resources>
        <Style TargetType="x:Type TextBlock">
            <Setter Property="FontFamily" Value="Segoe UI"/>
            <Setter Property="FontWeight" Value="Semibold"/>
            <Setter Property="Opacity" Value="0.25"/>
        </Style>

        <Style TargetType="x:Type Run">
            <Setter Property="FontFamily" Value="Segoe UI"/>
            <Setter Property="FontWeight" Value="Semibold"/>
        </Style>

        <SolidColorBrush x:Key="W25" Color="#FFFFFF" />
    </Window.Resources>
    <UniformGrid Columns="1">

        <Grid>
            <Grid.RowDefinitions>
                <RowDefinition Height="*" />
                <RowDefinition Height="*" />
            </Grid.RowDefinitions>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="*"></ColumnDefinition>
                <ColumnDefinition Width="*"></ColumnDefinition>
            </Grid.ColumnDefinitions>

            <Viewbox Grid.RowSpan="2">
                <TextBlock Foreground="StaticResource W25" Text="13.55" >
                 <!--<Run Text="13.55"/>-->  <!--Works the same-->
                </TextBlock>
            </Viewbox>
            <Viewbox Grid.Row="2" Grid.Column="2">
                <TextBlock Foreground="StaticResource W25" Text="mm" >
                <!--<Run Text="mm"/>--> <!--Works the same-->
                </TextBlock>
            </Viewbox>
        </Grid>
        <Viewbox>
            <TextBlock Foreground="StaticResource W25">
                <Run Text="13.55" FontSize="64"/>
                <Run Text="mm" FontSize="40"/>
            </TextBlock>
        </Viewbox>
    </UniformGrid>
</Window>

【讨论】：

我们使用画笔的原因之一是出于性能考虑：docs.microsoft.com/en-us/dotnet/desktop/wpf/advanced/…。我们有多个具有不同不透明度的项目需要混合。使用 Elements 不透明度会很耗时，并且可能会影响性能；(.

我使用 if 来渲染图表标签，性能没有任何问题，但您的情况可能不同。