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的操作有一定了解,其次能对事件的应用有一定的累积. 如上图,可以看到,这是放大镜的基本效果,主要分成左右两个部分.左边 ...
随机推荐
- JavaScript 运行时错误: 无法获取未定义或 null 一种解决方案
脚本是肯定没有错误的!! 引用了高版本的jquery jquery-1.10.1.min.js 但在ie10下面就是报错 "JavaScript 运行时错误: 无法获取未定义或 null & ...
- How to browse the entire documentation using XCode 5 Documentation and API Reference ?
file:///Users/yangiori/Library/Developer/Shared/Documentation/DocSets/com.apple.adc.documentation.Ap ...
- REDIS key notification
Commands Clients Documentation Community Download Support License Join us in London October 19th for ...
- sublime 的使用
常见问题: ctrl+`快捷见弹不出console怎么办! 解决方法: 估计适合电脑其他软件的快捷键冲突了,在sublime里面重新设置下快捷键 点击菜单中Preferences下面的Key Bind ...
- MXNet设计笔记之:深度学习的编程模式比较
市面上流行着各式各样的深度学习库,它们风格各异.那么这些函数库的风格在系统优化和用户体验方面又有哪些优势和缺陷呢?本文旨在于比较它们在编程模式方面的差异,讨论这些模式的基本优劣势,以及我们从中可以学到 ...
- 部分用到的python代码
replace file extensions # change .htm files to .html for file in *.htm ; do mv $file `echo $file | s ...
- C#- 反射之 GetType()方法
Type.GetType()在跨程序集反射时返回null的解决方法 在开发中,经常会遇到这种情况,在程序集A.dll中需要反射程序集B.dll中的类型.如果使用稍有不慎,就会产生运行时错误.例如使用T ...
- 【Flask】Flask快速玩框架
最近比较忙 快速玩Flask框架,为微博做些准备 part 1 python程序 from flask importFlask, render_template, session, redirect, ...
- 关于SCRUM站立会议
查询过后对SCRUM站立会议有了初步的了解 站立会议:在敏捷流程的冲刺阶段中,每一天都会举行项目状况会议,强迫每个人向同伴报告进度,迫使大家把问题摆在明面上,这个会议被称为“scrum”或“每日站立会 ...
- 适配器模式(Adapter Pattern)
将一个类的接口转换成客户希望的另外一个接口.Adapter模式使得原本由于接口不兼容而不能一起工作的那些类可以在一起工作. 模式中的角色 目标接口(Target):客户所期待的接口.目标可以是具体的或 ...