2

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

例如，它应该看起来更黄，因此像素的颜色更黄。我所需要的只是让我的黑色在不活动时稍微变白。

4

3 回答 3

3

我最近需要一种渐变效果，可以从指定颜色变为该颜色的较浅版本。我遇到了这篇非常好用的帖子。

这是作为扩展方法的代码

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);
于 2013-07-15T08:54:02.273 回答
2

根据您的说明，您想要达到的效果是在客户区域上放置一个半透明的单板，并以编程方式调整其外观。实现此目的的技术是使用 WPF Grid。此控件允许分层。这是一个设置两层的 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 公开了一个属性，该属性绑定到视图并控制它们在 Xaml 中的第一层的不透明度。有两种指示性方法可以帮助您入门。

您将需要尝试使用窗口背景和画笔以及不同级别的不透明度来获得您想要的确切效果，但这里有足够的内容来了解​​它的工作原理。

关键是使用 Grid 的分层能力。

于 2013-07-15T12:33:29.320 回答
1

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

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

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

这将更改为：

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

通过更改60in来更改不透明度级别Fill="#60FFFFFF"

于 2013-07-15T08:39:59.997 回答