WPF中利用RadialGradient模拟放大镜效果
原文:WPF中利用RadialGradient模拟放大镜效果
--------------------------------------------------------------------------------
引用时请保留以下信息:
大可山 [MSN:a3news(AT)hotmail.com]
http://www.zpxp.com 萝卜鼠在线图形图像处理
--------------------------------------------------------------------------------
原图:
使用RadialGradient覆盖后的突起效果:
另一种效果:
放大镜效果:
XAML代码:
<Window
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
x:Class="LinearGradientButton.OpacityMask"
x:Name="Window"
Title="OpacityMask"
Width="640" Height="480" xmlns:d="http://schemas.microsoft.com/expression/blend/2006" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d">
<Grid x:Name="LayoutRoot">
<Image Source="20070419171727764.jpg" Stretch="Fill" HorizontalAlignment="Right" Margin="0,8,8,21.429" Width="291.6"/>
<Image OpacityMask="{x:Null}" HorizontalAlignment="Left" Margin="8,8,0,21.429" Width="291.6" Source="20070419171727764.jpg" Stretch="Fill"/>
<Image Source="20070419171727764.jpg" Stretch="Fill" Margin="290.6,-100.213,-72.15,-44.572">
<Image.Clip>
<PathGeometry>
<PathFigure IsClosed="True" IsFilled="True" StartPoint="221.9,234">
<BezierSegment Point1="221.9,283.429485109856" Point2="181.829485109856,323.5" Point3="132.4,323.5" IsSmoothJoin="True" IsStroked="True"/>
<BezierSegment Point1="82.970514890144,323.5" Point2="42.9,283.429485109856" Point3="42.9,234" IsSmoothJoin="True" IsStroked="True"/>
<BezierSegment Point1="42.9,184.570514890144" Point2="82.970514890144,144.5" Point3="132.4,144.5" IsSmoothJoin="True" IsStroked="True"/>
<BezierSegment Point1="181.829485109856,144.5" Point2="221.9,184.570514890144" Point3="221.9,234" IsSmoothJoin="True" IsStroked="True"/>
</PathFigure>
</PathGeometry>
</Image.Clip>
</Image>
<Path HorizontalAlignment="Right" Margin="0,175.01,9.24,126.01" Width="144.51" Stretch="Fill" Stroke="#FF000000" Data="M478.74999,202.74993 L600.25097,319.24811 C600.25097,319.24811 616.75089,322.74789 622.23106,303.00905 624.44394,295.03853 501.74347,175.51037 501.74347,175.51037 501.74347,175.51037 489.50009,192.0001 478.74999,202.74993 z">
<Path.Fill>
<LinearGradientBrush EndPoint="0.507,0.499" StartPoint="0.396,0.608" SpreadMethod="Reflect">
<GradientStop Color="#FF000000" Offset="0"/>
<GradientStop Color="#FFFFFFFF" Offset="1"/>
</LinearGradientBrush>
</Path.Fill>
</Path>
<Ellipse d:LayoutOverrides="HorizontalAlignment, Height" Margin="332.4,43.786,119.6,222.214" Width="180" Height="180" Stroke="{x:Null}">
<Ellipse.Fill>
<RadialGradientBrush>
<GradientStop Color="#00000000" Offset="0.885"/>
<GradientStop Color="#FF0D0C0C" Offset="0.986"/>
<GradientStop Color="#B3635D5D" Offset="0.962"/>
<GradientStop Color="#FFDFD7D7" Offset="0.976"/>
</RadialGradientBrush>
</Ellipse.Fill>
</Ellipse>
<Rectangle HorizontalAlignment="Left" Margin="8,8,0,21.429" Width="291.6" Stroke="{x:Null}">
<Rectangle.Fill>
<RadialGradientBrush>
<GradientStop Color="#00000000" Offset="0.885"/>
<GradientStop Color="#FF050000" Offset="1"/>
<GradientStop Color="#B3635D5D" Offset="0.962"/>
<GradientStop Color="#FFDFD7D7" Offset="0.976"/>
</RadialGradientBrush>
</Rectangle.Fill>
</Rectangle>
</Grid>
</Window>
扩展说明:
可以使用C#得到放大镜所在的位置而将相应区域放大,真正实现放大镜的动态模拟。今后如有时间和精力,我将制作完成之后贴出源代码。
WPF中利用RadialGradient模拟放大镜效果的更多相关文章
- 在WPF中使用PlaneProjection模拟动态3D效果
原文:在WPF中使用PlaneProjection模拟动态3D效果 虽然在WPF中也集成了3D呈现的功能,在简单的3D应用中,有时候并不需要真实光影的3D场景.毕竟使用3D引擎会消耗很多资源,有时候使 ...
- 利用jquery模拟select效果
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- WPF中利用后台代码实现窗口分栏动态改变
在WPF中实现窗口分栏并能够通过鼠标改变大小已经非常容易,例如将一个GRID分成竖排三栏显示,就可以将GRID先分成5列,其中两个固定列放GridSplitter. <Grid Backgrou ...
- WPF中利用DynamicDataDisplay快速实现示波器功能
DynamicDataDisplay控件是一个功能很强的绘图工具,除了能生成曲线外,还有很多其他功能,具体见http://dynamicdatadisplay.codeplex.com/.这里你也能下 ...
- WPF中利用控件的DataContext属性为多个TextBox绑定数据
工作上需要从给定的接口获取数据,然后显示在界面的编辑框中,以往肯定会一个一个的去赋值,但这样太麻烦而且效率很低,不利于维护,于是想到了数据绑定这一方法,数据绑定主要利用INotifyPropertyC ...
- WPF设置VistualBrush的Visual属性制作图片放大镜效果
原文:WPF设置VistualBrush的Visual属性制作图片放大镜效果 效果图片:原理:设置VistualBrush的Visual属性,利用它的Viewbox属性进行缩放. XAML代码:// ...
- wpf实现IE菜单栏自动隐藏效果
IE菜单栏默认为隐藏状态,按下键盘Alt键后显示,菜单失去焦点则自动隐藏.下面说说WPF中如何实现这样的效果. 第一步:Menu默认设置为隐藏(Visibility="Collapsed&q ...
- WPF在3D Cad模型中利用TextureCoordinates实现颜色渐变显示偏差值的变化
原文:WPF在3D Cad模型中利用TextureCoordinates实现颜色渐变显示偏差值的变化 注:最近在做3D机械模型重建方面的软件,需要根据光栅传感器采集的数据绘制3D图形,并显示出色差以及 ...
- 关于jQuery中实现放大镜效果
1.1.1 摘要 相信大家都见过或使用过放大镜效果,甚至实现过该效果,它一般应用于放大查看商品图片,一些电商网站(例如:凡客,京东商城,阿里巴巴等)都有类似的图片查看效果. 在接下来的博文中,我们将向 ...
随机推荐
- NASM Syntax
NASM has a simplified syntax designed to let the user code with minimum overhead. In its simplest fo ...
- 算法练习--二分搜索哈希表-JS 实现
1. 以哈希KEY的值建立二叉哈希表 2. 依据传入的哈希值使用二分法搜索 详细实现例如以下: function binarySearchTable(comp){ this.comp = comp; ...
- JavaWeb网站技术架构
JavaWeb网站技术架构总结 题记 工作也有几多年了,无论是身边遇到的还是耳间闻到的,多多少少也积攒了自己的一些经验和思考,当然,博主并没有太多接触高大上的分布式架构实践,相对比较零碎,随时补充 ...
- thinkphp3.2二维码扩展
//简易二维码 public function qrcode(){ Vendor('phpqrcode.phpqrcode'); //生成二维码图片 $object = new \QRcode(); ...
- 解决gvim 8.1中zip插件打开zip文件内容时,而文件路径带有空格的问题。
解决gvim 8.1中zip插件打开zip文件内容时,而文件路径带有空格的问题. 现象是只能打开一次,第二次打开就显示为空了. 通过 lcd切换工作目录.使得命令行操作中不再有带空格的路径 vim81 ...
- 使用openoffice转换ms_office to pdf
java源代码: package com.jeecms.common.office2pdf; import java.io.File; import java.io.FileInputStream; ...
- Android Wear之android穿戴式设备应用开发平台
Android Wear于2014年03月19日公布,并有Moto 360和LG watch两款产品. 眼下源代码还没有开放.可是开发人员能够下载它的Image及相应的开发SDK,这样开发人员通过模拟 ...
- spring 输出mvc
http://flysnowxf.iteye.com/blog/1187580 http://viralpatel.net/blogs/spring-requestheader-example/ 基于 ...
- 解析C#内存管理
C#内存管理解析 前言:对于很多的C#程序员来说,经常会很少去关注其内存的释放,他们认为C#带有强大的垃圾回收机制,所有不愿意去考虑这方面的事情,其实不尽然,很多时候我们都需要考虑C#内存的管理问题, ...
- Django之富文本编辑器kindeditor 及上传
1.什么是富文本编辑器 百度百科(https://baike.baidu.com/item/%E5%AF%8C%E6%96%87%E6%9C%AC%E7%BC%96%E8%BE%91%E5%99%A8 ...