如何为 UI 元素添加颜色效果？
例如，它应该看起来更黄，因此像素的颜色更黄。 我所需要的只是让我的黑色在不活动时稍微变白。
【问题讨论】：
Opacity设置得低一点，同时它在白色背景上。
标签： wpf binding grid opacity effect
为了增强黄色像素，您可以在 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>
通过更改Fill="#60FFFFFF" 中的60 来更改不透明度级别
【讨论】：
Rectangle 应该位于您的内容之上。我已经编辑了我的答案。
根据您的说明，您想要实现的效果是在客户区域上放置半透明单板，并以编程方式调整其外观。实现此目的的技术是使用 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的分层能力。
【讨论】：
我最近需要一种渐变效果，可以从指定颜色变为该颜色的较浅版本。我遇到了这个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);
【讨论】：