【C#/WPF】Image图片的Transform变换:平移、缩放、旋转
WPF中图像控件Image的变换属性Transform:
- 平移
- 缩放
- 旋转
即要想实现图片的平移、缩放、旋转,是修改它所在的Image控件的Transform变换属性。
下面在XAML中定义了Image图片的Transform属性。
<Image>
<Image.RenderTransform>
<TransformGroup>
<TranslateTransform/>
<ScaleTransform/>
<RotateTransform/>
</TransformGroup>
</Image.RenderTransform>
</Image>
图像平移:
按住鼠标左键,拖拽移动图片;松开鼠标左键,完成图像平移。
MVVM将鼠标事件绑定命令Command后在控制层处理。
private Image movingObject; // 记录当前被拖拽移动的图片
private Point StartPosition; // 本次移动开始时的坐标点位置
private Point EndPosition; // 本次移动结束时的坐标点位置
/// <summary>
/// 按下鼠标左键,准备开始拖动图片
/// </summary>
/// <param name="p"></param>
private void MouseLeftButtonDownCommand(object[] p)
{
object sender = p[0];
MouseButtonEventArgs e = p[1] as MouseButtonEventArgs;
Image img = sender as Image;
movingObject = img;
StartPosition = e.GetPosition(img);
}
/// <summary>
/// 按住鼠标左键,拖动图片平移
/// </summary>
/// <param name="p"></param>
private void MouseMoveCommand(object[] p)
{
object sender = p[0];
MouseEventArgs e = p[1] as MouseEventArgs;
Image img = sender as Image;
if (e.LeftButton == MouseButtonState.Pressed && sender == movingObject)
{
EndPosition = e.GetPosition(img);
TransformGroup tg = img.RenderTransform as TransformGroup;
var tgnew = tg.CloneCurrentValue();
if (tgnew != null)
{
TranslateTransform tt = tgnew.Children[0] as TranslateTransform;
var X = EndPosition.X - StartPosition.X;
var Y = EndPosition.Y - StartPosition.Y;
tt.X += X;
tt.Y += Y;
}
// 重新给图像赋值Transform变换属性
img.RenderTransform = tgnew;
}
}
/// <summary>
/// 鼠标左键弹起,结束图片的拖动
/// </summary>
/// <param name="p"></param>
private void MouseLeftButtonUpCommand(object[] p)
{
object sender = p[0];
MouseButtonEventArgs e = p[1] as MouseButtonEventArgs;
Image img = sender as Image;
movingObject = null;
}
图像缩放:
界面上准备两个按钮,点击分别实现图像的放大和缩小。
/// <summary>
/// 图片放大
/// </summary>
/// <param name="img">被操作的前台Image控件</param>
public void ZoomIn(Image img)
{
TransformGroup tg = img.RenderTransform as TransformGroup;
var tgnew = tg.CloneCurrentValue();
if (tgnew != null)
{
ScaleTransform st = tgnew.Children[1] as ScaleTransform;
img.RenderTransformOrigin = new Point(0.5, 0.5);
if (st.ScaleX > 0 && st.ScaleX <= 2.0)
{
st.ScaleX += 0.05;
st.ScaleY += 0.05;
}
else if (st.ScaleX < 0 && st.ScaleX >= -2.0)
{
st.ScaleX -= 0.05;
st.ScaleY += 0.05;
}
}
// 重新给图像赋值Transform变换属性
img.RenderTransform = tgnew;
}
/// <summary>
/// 图片缩小
/// </summary>
/// <param name="img">被操作的前台Image控件</param>
public void ZoomOut(Image img)
{
TransformGroup tg = img.RenderTransform as TransformGroup;
var tgnew = tg.CloneCurrentValue();
if (tgnew != null)
{
ScaleTransform st = tgnew.Children[1] as ScaleTransform;
img.RenderTransformOrigin = new Point(0.5, 0.5);
if (st.ScaleX >= 0.2)
{
st.ScaleX -= 0.05;
st.ScaleY -= 0.05;
}
else if (st.ScaleX <= -0.2)
{
st.ScaleX += 0.05;
st.ScaleY -= 0.05;
}
}
// 重新给图像赋值Transform变换属性
img.RenderTransform = tgnew;
}
图像旋转:
界面上准备两个按钮,点击分别实现图像的左转和右转。
/// <summary>
/// 图片左转
/// </summary>
/// <param name="img">被操作的前台Image控件</param>
public void RotateLeft(Image img)
{
TransformGroup tg = img.RenderTransform as TransformGroup;
var tgnew = tg.CloneCurrentValue();
if (tgnew != null)
{
RotateTransform rt = tgnew.Children[2] as RotateTransform;
img.RenderTransformOrigin = new Point(0.5, 0.5);
rt.Angle -= 5;
}
// 重新给图像赋值Transform变换属性
img.RenderTransform = tgnew;
}
/// <summary>
/// 图片右转
/// </summary>
/// <param name="img">被操作的前台Image控件</param>
public void RotateRight(Image img)
{
TransformGroup tg = img.RenderTransform as TransformGroup;
var tgnew = tg.CloneCurrentValue();
if (tgnew != null)
{
RotateTransform rt = tgnew.Children[2] as RotateTransform;
img.RenderTransformOrigin = new Point(0.5, 0.5);
rt.Angle += 5;
}
// 重新给图像赋值Transform变换属性
img.RenderTransform = tgnew;
}
【C#/WPF】Image图片的Transform变换:平移、缩放、旋转的更多相关文章
- WPF/Silverlight中图形的平移,缩放,旋转,倾斜变换演示
原文:WPF/Silverlight中图形的平移,缩放,旋转,倾斜变换演示 为方便描述, 这里仅以正方形来做演示, 其他图形从略. 运行时效果图:XAML代码:// Transform.XAML< ...
- Graphics平移缩放旋转(转载)+点睛
点睛:可以进行多次旋转和平移,也就是平移以后再平移,旋转以后再旋转,有时候一次达不到要求,如果你想一次调整完美的话很麻烦,所以最好多次,上代码 private void btnTranslate_Cl ...
- 图片在 canvas 中的 选中/平移/缩放/旋转,包含了所有canvas的2D变化,让你认识到数学的重要性
1.介绍 canvas 已经出来好久了,相信大家多少都有接触. 如果你是前端页面开发/移动开发,那么你肯定会有做过图片上传处理,图片优化,以及图片合成,这些都是可以用 canvas 实现的. 如果你是 ...
- WPF 触摸屏多点触控图像的缩放旋转和移动
<dxc:DXWindow xmlns:dxe="http://schemas.devexpress.com/winfx/2008/xaml/editors" xmlns:d ...
- WPF中的平移缩放和矩阵变换(TranslateTransform、ScaleTransform、MatrixTransform)
在WPF中的平移缩放都是通过RenderTransform这个类来实现这些效果的,在这个类中,除了平移和缩放还有旋转.扭曲变换.矩阵变换.这些都差不多的,都是坐标的变换. 这里我就先简单弄个平移和缩放 ...
- 好吧,CSS3 3D transform变换,不过如此!
一.写在前面的秋裤 早在去年的去年,我就大肆介绍了2D transform相关内容.看过海贼王的都知道,带D的家伙都不是好惹的,2D我辈尚可以应付,3D的话,呵呵,估计我等早就在千里之外被其霸气震晕了 ...
- 好吧,CSS3 3D transform变换,不过如此!——张鑫旭
一.写在前面的秋裤 早在去年的去年,我就大肆介绍了2D transform相关内容.看过海贼王的都知道,带D的家伙都不是好惹的,2D我辈尚可以应付,3D的话,呵呵,估计我等早就在千里之外被其霸气震晕了 ...
- Safari 3D transform变换z-index层级渲染异常的研究
by zhangxinxu from http://www.zhangxinxu.com/wordpress/?p=5569 一.Safari是新时代的IE6 在2年前介绍currentColor变量 ...
- 第98天:CSS3中transform变换详解
transform变换详解 本文主要介绍变形transform. Transform字面上就是变形,改变的意思.在CSS3中transform主要包括以下几种:旋转rotate.扭曲skew.缩放sc ...
随机推荐
- 获取网站资源 getResourceAsStream
获取网站资源(重点) public void doGet(HttpServletRequest request, HttpServletResponse response)throws Servlet ...
- 【转】SVN与Git比较
摘要Svn是目前得到大多数人认可,使用得最多的版本控制管理工具,而Git的优势在于易于本地增加分支和分布式的特性,可离线提交,解决了异地团队协同开发等svn不能解决的问题.本文就这两种版本控制工具的异 ...
- Python监控文件变化:watchdog
Python监控文件变化有两种库:pyinotify和watchdog.pyinotify依赖于Linux平台的inotify,后者则对不同平台的的事件都进行了封装.也就是说,watchdog跨平台. ...
- CSS:关于CSS Hack
CSS Hack由于不同厂商的浏览器,如Internet Explorer,Safari,Mozilla Firefox,Chrome 等,或者是同一厂商的浏览器的不同版本,如IE6和IE7,对CSS ...
- iOS高级教程:处理1000张图片的内存优化
一.项目需求 在实际项目中,用户在上传图片时,有时会一次性上传大量的图片.在上传图片前,我们要进行一系列操作,比如:旋转图片为正确方向,压缩图片等,这些操作需要将图片加载到内存中,下面对内存的使用做详 ...
- php Zend虚拟机
在前⾯的章节中,我们了解到⼀个PHP⽂件在服务器端的执⾏过程包括以下两个⼤的过程:1. 递给php程序需要执⾏的⽂件, php程序完成基本的准备⼯作后启动PHP及Zend引擎, 加载注册的扩展模块.2 ...
- 解决idea中Activiti的bpmn编辑器的中文乱码问题
我使用的是idea2017+activiti6.0版本. 该文章主要是为了解决安装activiti插件后创建的流程模板中文乱码的问题. 1.安装Activiti流程编辑器插件. 1.1网上资料很多,这 ...
- IIS6.0中布署MVC站点
http://www.cnblogs.com/anny-1980/articles/2616657.html
- linux文件系统管理的工作原理
一.系统在初始化时如何识别硬盘 1.系统初始时根据MBR的信息来识别硬盘,其中包括了一些执行文件就来载入系统,这些执行文件就是MBR里前面446bytes里的boot loader 程式,而后面的16 ...
- LeetCode总结 -- 一维数据合并篇
合并是一维数据结构中非经常见的操作, 一般是排序, 分布式算法中的子操作. 这篇总结主要介绍LeetCode中关于合并的几个题目: Merge Two Sorted ListsMerge Sorted ...