当前位置:首页 > 嵌入式 > 嵌入式软件
[导读]我先不说什么,给大家看一个截图。 呵呵,这是一个灰常低水准的滤罩效果,如果你觉得有意思,我贴出XAML来。[html] view plain copy print? <Grid x:Name="LayoutRoot"

我先不说什么,给大家看一个截图。

 

呵呵,这是一个灰常低水准的滤罩效果,如果你觉得有意思,我贴出XAML来。

[html] view plain copy print?
  1. <Grid x:Name="LayoutRoot" Background="Transparent">  
  2.     <Image Source="/lan.jpg" Stretch="Uniform" Canvas.ZIndex="0"/>  
  3.     <Rectangle Canvas.ZIndex="1" Fill="Black" Opacity="0.7"/>  
  4.     <Image x:Name="myImg" Stretch="Uniform" Source="/lan.jpg" Canvas.ZIndex="2">  
  5.         <Image.Clip>  
  6.             <GeometryGroup>  
  7.                 <EllipseGeometry Center="100,129" RadiusX="80" RadiusY="80"/>  
  8.                 <EllipseGeometry Center="280,380" RadiusX="60" RadiusY="60"/>  
  9.                 <EllipseGeometry Center="410,520" RadiusX="65" RadiusY="65"/>  
  10.                 <EllipseGeometry Center="325,36" RadiusX="60" RadiusY="60"/>  
  11.                 <EllipseGeometry Center="125,611" RadiusX="50" RadiusY="50"/>  
  12.                 <EllipseGeometry Center="62,395" RadiusX="75" RadiusY="75"/>  
  13.             </GeometryGroup>  
  14.         </Image.Clip>  
  15.     </Image>  
  16. </Grid>  


上面的码子很简单了,其实,核心就是充分利用了UIElement的Clip,是的,你把它用好了,会弄出不少好玩的东东来的。

 

说说大致的原理。

其实我是用了两个Image,最下面一层的图片不进行Clip而上再盖一个Rectangle,这个矩把透明度稍稍调一下,这样看起来,下面的图片会变暗。然后在最上层再放一个Image控件,这个控件就采用了Clip,于是,几个元素重叠起来就看到了滤罩效果。

如果你把下面的Image和矩形隐藏了,你就知道其中的玄机了。

本站声明: 本文章由作者或相关机构授权发布,目的在于传递更多信息,并不代表本站赞同其观点,本站亦不保证或承诺内容真实性等。需要转载请联系该专栏作者,如若文章内容侵犯您的权益,请及时联系本站删除( 邮箱:macysun@21ic.com )。
换一批
延伸阅读
关闭