Question

如何为UI元素添加色彩效果？

例如，它应该看起来更黄，因此像素的颜色更黄。我需要的是让我的黑色形状有点白，而它是不活跃的。

Answer 1

我最近需要一种渐变效果，从指定颜色到该颜色的较浅版本。我偶然发现了这个post。

以下是作为扩展方法的代码

public static Color Interpolate(this Color color1, Color color2, float percentage)
    {
        double a1 = color1.A / 255.0, r1 = color1.R / 255.0, g1 = color1.G / 255.0, b1 = color1.B / 255.0;
        double a2 = color2.A / 255.0, r2 = color2.R / 255.0, g2 = color2.G / 255.0, b2 = color2.B / 255.0;
        byte a3 = Convert.ToByte((a1 + (a2 - a1) * percentage) * 255);
        byte r3 = Convert.ToByte((r1 + (r2 - r1) * percentage) * 255);
        byte g3 = Convert.ToByte((g1 + (g2 - g1) * percentage) * 255);
        byte b3 = Convert.ToByte((b1 + (b2 - b1) * percentage) * 255);
        return Color.FromArgb(a3, r3, g3, b3);
    }

在我的情况下，我混合了50％的白色

BackgroundColor.Interpolate(Colors.White, .5f);

Answer 2

根据您的说明，您希望实现的效果是在客户区域上放置半透明的胶合板，并以编程方式调整其外观。这方面的技术是使用WPF网格。该控件允许分层。这是一个Xaml片段，它设置了两个层......

<Window.Resources>
    <SolidColorBrush Color="Yellow" x:Key="MyVeneerBrush"/>
</Window.Resources>
<Grid>
    <Grid Background="{StaticResource MyVeneerBrush}" Opacity="{Binding VeneerOpacity}"/>
    <Grid>
        <DockPanel>
            <!--Layout goes here-->
            <TextBlock Text="Hello" FontSize="52"/>
        </DockPanel>
    </Grid>
</Grid>

第一层包含胶合代码，第二层包含内容。第一层上的不透明度可以设置为0（完全透明）到1（完全可见），并且在两个值之间将提供半透明质量。您需要沿着这些行编写ViewModel ...

public class ViewModel :INotifyPropertyChanged
{
    public ViewModel()
    {
        TurnVeneerOn();
    }
    private void TurnVeneerOff()
    {
        VeneerOpacity = 0;
    }
    private void TurnVeneerOn()
    {
        VeneerOpacity = 0.4;
    }
    private double _veneerOpacity;
    public double VeneerOpacity
    {
        [DebuggerStepThrough]
        get { return _veneerOpacity; }
        [DebuggerStepThrough]
        set
        {
            if (value != _veneerOpacity)
            {
                _veneerOpacity = value;
                OnPropertyChanged("VeneerOpacity");
            }
        }
    }
    #region INotifyPropertyChanged Implementation
    public event PropertyChangedEventHandler PropertyChanged;
    protected virtual void OnPropertyChanged(string name)
    {
        var handler = System.Threading.Interlocked.CompareExchange(ref PropertyChanged, null, null);
        if (handler != null)
        {
            handler(this, new PropertyChangedEventArgs(name));
        }
    }
    #endregion
}

此VM公开绑定到View的属性，并控制Xaml中第一层的不透明度。有两种指示性方法可以帮助您入门。

您需要尝试使用窗口背景和画笔以及不同级别的不透明度来获得您所追求的精确效果，但这里有足够的效果。

关键是使用网格的分层功能。

Answer 3

为了增强黄色像素，您可以混合彩色图层Photoshop样式。对于Photoshop风格混合模式，您可以使用Cory Plotts' library并尝试不同的混合模式。但是，对于您想要做的事情，这可能有点过分;在这种情况下，您应该尝试以下方法：

如果您希望元素具有简单的褪色外观，只需在元素顶部添加一个半透明图层，建议keftmedei。这是一个例子：

<yourElement Width="100" Height="100" Canvas.Top="50" />

这将改为：

<Grid Width="100" Height="100" Canvas.Top="50">
    <yourElement />
    <Rectangle Fill="#60FFFFFF" />
</Grid>

通过更改60

中的Fill="#60FFFFFF"来更改不透明度级别

用于UI元素的WPF颜色效果

3 个答案: