[英]UWP transparent LinearGradientBrush
我的c#UWP应用程序出了问题。
<Grid VerticalAlignment="Bottom" Height="40" Grid.Row="3" Margin="0,0,0,-1">
<Grid.Background>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="#00000000" Offset="0"/>
<GradientStop Color="{StaticResource stdBackgroundColor}" Offset="1"/>
</LinearGradientBrush>
</Grid.Background>
</Grid>
此代码段应在页面底部显示透明覆盖,但它会创建一个黑色覆盖,就像它在现有背景(也是Color stdBackgroundColor
)之上添加透明值,因此看起来很奇怪(请参阅图片如下)
如何在没有此效果的情况下实现内容的透明叠加(例如ScrollViewer
)?
免责声明,我正在工作,我无法访问我可以测试此代码的平台,但是从我查看的内容中它应该可以正常工作。
潜在的问题是颜色混合,即我们希望从完整的alpha平滑地混合到任意颜色。 从Color.Transparent
开始的问题是,当alpha通道比其他组件进展更多时,您将获得一条白色带。 #00000000
也会出现类似的问题,因为它有黑带。 解决方案是从不透明度设置为0
颜色版本开始。 根据您正在开发的基于XAML的应用程序版本,我们如何解决这个问题略有不同 - 我发现很难保持这些应用程序。 在UWP中,我们没有不透明蒙版,我们无法单独在不透明度上创建渐变。 唯一剩下的就是使用IValueConverter。
GradientStop
的Color
属性是Color
而不是Brush
,因为这会使渲染系统过于复杂。 所以我们需要的第一步是IValueConverter
,它接受任何Color
并IValueConverter
alpha值:
public class TransparentColorConverter : IValueConverter
{
public object Convert(object value, Type targetType,
object parameter, string language)
{
Color convert = (Color) value; // Color is a struct, so we cast
return Color.FromArgb(0, convert.R, convert.G, convert.B);
}
public object ConvertBack(object value, Type targetType,
object parameter, string language)
{
throw new NotImplementedException();
}
}
接下来的挑战是创建一个我们可以使用这种颜色的绑定。 绑定对象允许我们指定一个Source
,它可以是我们传入的任何对象ElementName
不起作用,因为资源是由key引用的,而不是name。
<LinearGradientBrush x:Key="OpacityGradientBrush" StartPoint="0,0" EndPoint="0,1">
<GradientStop Color="{Binding Source={StaticResource stdBackgroundColor},
Converter={StaticResource TransparentColorConverter}}" Offset="0"/>
<GradientStop Color="{StaticResource stdBackgroundColor}" Offset="1"/>
</LinearGradientBrush>
当然,不要忘记将TransparentColorConverter
放在您的Resources
以便您可以在此处引用它。 就个人而言,我宁愿不必使用转换器,但在这种情况下,我认为这是有道理的。
注意:我们在绑定中使用Source
,因此我们可以引用静态资源。 如果我们有一个可以绑定的属性,我们可以使用Path
。
以下答案适用于WPF,但不适用于UWP 。 我希望微软不要以不相容的方式重新定义相同的概念,但这就是我们生活的世界。
您希望更改LinearGradientBrush以使用Opacity属性而不是颜色#00000000
。 问题是它从基本上黑色内插到你想要的颜色。 要获得您想要的效果,您需要设置不透明蒙版画笔,如下所示:
<LinearGradientBrush x:Key="OpacityGradientBrush" StartPoint="0,0" EndPoint="0,1">
<GradientStop Color="#00FFFFFF" Offset="0"/>
<GradientStop Color="#FFFFFFFF" Offset="1"/>
</LinearGradientBrush>
然后在代码中你需要应用不透明蒙版,你可以像这样引用它:
<Grid VerticalAlignment="Bottom" Height="40" Grid.Row="3"
Background="{StaticResource stdBackgroundColor}"
OpacityMask="{StaticResource OpacityGradientBrush} Margin="0,0,0,-1"/>
问题是,如果您希望混合仅影响不透明度,则其余颜色必须相同。 你会得到一个你的起始色彩渐变的乐队,否则会变成结束色。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.