WPF的图片操作效果(一):RenderTransform
一.RenderTransform类的成员:
1.TranslateTransform 平移效果
2.RotateTransform 旋转效果
3.ScaleTransform 缩放效果
4.SkewTransform 扭转效果
5.TransformGroup 组合效果
6.MatrixTransform 是其他几个变形类的基类,矩阵方式实现效果
二.简单效果介绍
1.TranslateTransform 平移效果
<Image Source="logo.png" Width="" Height="">
<Image.RenderTransform>
<TranslateTransform X="" Y=""/>
</Image.RenderTransform>
</Image>
注释:X和Y分别代表图片在X方向和Y方向的偏移量
2.RotateTransform 旋转效果
<Image Source="logo.png" Width="" Height="">
<Image.RenderTransform>
<RotateTransform Angle="" CenterX="" CenterY="" />
</Image.RenderTransform>
</Image>
注释:Angle是偏转角度,CenterX和CenterY是中心点,(0,0)是原点,非零值代表经过偏移之后的中心点
3.ScaleTransform 缩放效果
<Image Source="logo.png" Width="" Height="">
<Image.RenderTransform>
<ScaleTransform CenterX="" CenterY="" ScaleX="0.5" ScaleY="0.5"/>
</Image.RenderTransform>
</Image>
注释:Center代表原点坐标偏移量,ScaleX和ScaleY分别代表X和Y方向的缩放比例
4.SkewTransform 扭转效果
<Image Source="logo.png" Width="" Height="">
<Image.RenderTransform>
<SkewTransform AngleX="" AngleY="" CenterX="" CenterY=""/>
</Image.RenderTransform>
</Image>
注释:AngleX和AngleY的方向扭转 CenterX和CenterY是偏移中心点的偏移量
5.TransformGroup 组合效果
<Image Source="logo.png" Width="" Height="">
<Image.RenderTransform>
<TransformGroup >
<ScaleTransform CenterX="" CenterY="" ScaleX="0.5" ScaleY="0.5"/>
<RotateTransform Angle="" CenterX="" CenterY="" />
</TransformGroup>
</Image.RenderTransform>
</Image>
注释:就是上述简单效果的叠加使用
6.MatrixTransform 是其他几个变形类的基类,矩阵方式实现效果
<Image Source="logo.png" Width="" Height="">
<Image.RenderTransform>
<MatrixTransform Matrix="1 0 0 1 80 40"/>
</Image.RenderTransform>
</Image>
注释:该矩阵效果是通过矩阵计算得出其实际效果,但我不懂,按自己的理解分析出如下:
Matrix的6个参数是通过矩阵计算得出Image的新坐标和效果,第一个和第四个分别控制该图片的X和Y方向的缩放比例,第二个参数和第三个参数分别控制X和Y方向扭转,最后两个参数代表X和Y方向的平移量
三.示例下载
WPF的图片操作效果(一):RenderTransform的更多相关文章
- WPF设置VistualBrush的Visual属性制作图片放大镜效果
原文:WPF设置VistualBrush的Visual属性制作图片放大镜效果 效果图片:原理:设置VistualBrush的Visual属性,利用它的Viewbox属性进行缩放. XAML代码:// ...
- 使用 jQuery 操作页面元素的方法,实现浏览大图片的效果,在页面上插入一幅小图片,当鼠标悬停到小图片上时,在小图片的右侧出现与之相对应的大图片
查看本章节 查看作业目录 需求说明: 使用 jQuery 操作页面元素的方法,实现浏览大图片的效果,在页面上插入一幅小图片,当鼠标悬停到小图片上时,在小图片的右侧出现与之相对应的大图片 实现思路: 在 ...
- WPF中制作立体效果的文字或LOGO图形
原文:WPF中制作立体效果的文字或LOGO图形 较久之前,我曾写过一篇:"WPF绘制党徽(立体效果,Cool) "的博文.有感兴趣的朋友来EMAIL问是怎么制作的?本文解决此类问题 ...
- ECharts外部调用保存为图片操作及工作流接线mouseenter和mouseleave由于鼠标移动速度过快导致问题解决办法
记录两个项目开发中遇到的问题,一个是ECharts外部调用保存为图片操作,一个是workflow工作流连接曲线onmouseenter和onmouseleave事件由于鼠标移动过快触发问题. 一.外部 ...
- C# WPF 显示图片和视频显示 EmuguCv、AForge.Net测试(续)
介绍 本文是接着上文<C# WPF 显示图片和视频显示 EmuguCv.AForge.Net测试>写的,建议先看下上文,因为有些代码还需要了解. 增添 接着上文的代码,我们可以在事件处理方 ...
- 原生 JavaScript 图片裁剪效果
图片裁剪程序效果如下,可鼠标操作. 拖动左边小方框时在右侧实时显示对应的裁剪图片,同时左侧的拖动框里图片完全显示,拖动框外部图片模糊显示.8个控制点可以对显示区域大小进行控制. HTML 和 CS ...
- Swift 2.0 封装图片折叠效果
文/猫爪(简书作者)原文链接:http://www.jianshu.com/p/688c491580e3著作权归作者所有,转载请联系作者获得授权,并标注“简书作者”. 用Swift封装图片折叠效果 b ...
- 原生javascript实现图片放大镜效果
当我们在电商网站上购买商品时,经常会看到这样一种效果,当我们把鼠标放到我们浏览的商品图片上时,会出现类似放大镜一样的一定区域的放大效果,方便消费者观察商品.今天我对这一技术,进行简单实现,实现图片放大 ...
- js实现图片局部放大效果
图片局部放大效果结合的知识点主要是DOM的操作,以及事件的应用,所以首先要对DOM的操作有一定了解,其次能对事件的应用有一定的累积. 如上图,可以看到,这是放大镜的基本效果,主要分成左右两个部分.左边 ...
随机推荐
- CentOS 7 为firewalld添加开放端口及相关资料
1.运行.停止.禁用firewalld 启动:# systemctl start firewalld 查看状态:# systemctl status firewalld 或者 firewall-cm ...
- P,NP,NPC,NPC-HARD
P: 能在多项式时间内解决的问题 NP: 不能在多项式时间内解决或不确定能不能在多项式时间内解决,但能在多项式时间验证的问题 NPC: NP完全问题,所有NP问题在多项式时间内都能约化(Reducib ...
- 机械键盘那些事[我用过的minila Filco cherry 3494 阿米洛87]
用过几月下来.最终现在还能流畅使用的,就剩下3494 跟 minila了. 想起购买的初衷.cherry是泰斗,红轴轻柔,所以三把全红轴. 之后,觉得携带外出不方便,所以就又入了个MINILA. 再后 ...
- sphinx.conf 详解
sphinx的配置文件是在配置的时候最容易出错的了: 我们先要明白几个概念: source:数据源,数据是从什么地方来的. index:索引,当有数据源之后,从数据源处构建索引.索引实际上就是相当于一 ...
- opencv配置(2.49)
转载自浅墨大神http://blog.csdn.net/poem_qianmo/article/details/19809337 OpenCV2.4.9和2.4.8的配置几乎一样,唯一的区别在下文中的 ...
- 事务的ACID特性
事务(Transaction)是并发控制的基本单位. 所谓事务,它是一个操作序列,这些操作要么都执行,要么都不执行,它是一个不可分割的工作单位.例如,银行转帐工作:从一个帐号扣款并使另一个帐号增 ...
- 体验一下cygwin
一直在windows下使用gvim,为了更方便的使用cscope.先是写了bat脚本,发现太不方便了. 于是想到了cygwin.下载安装工具就可以了进行默认安装了,配置比较简单. 调整包: ./set ...
- list control失去焦点后,仍然蓝色高亮度显示
void CReaProSet::OnNMKillfocusReaprolist(NMHDR *pNMHDR, LRESULT *pResult)//指示控件已经失去焦点 { // TODO: 在此 ...
- Following a Select Statement Through Postgres Internals
This is the third of a series of posts based on a presentation I did at the Barcelona Ruby Conferenc ...
- android 4.4.2 开发环境
1.设置环境变量 set "JAVA_HOME=C:\Program Files\Java\jdk1.7.0_75" set "ANT_HOME=D:\tools\and ...