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变换:平移、缩放、旋转的更多相关文章

  1. WPF/Silverlight中图形的平移,缩放,旋转,倾斜变换演示

    原文:WPF/Silverlight中图形的平移,缩放,旋转,倾斜变换演示 为方便描述, 这里仅以正方形来做演示, 其他图形从略. 运行时效果图:XAML代码:// Transform.XAML< ...

  2. Graphics平移缩放旋转(转载)+点睛

    点睛:可以进行多次旋转和平移,也就是平移以后再平移,旋转以后再旋转,有时候一次达不到要求,如果你想一次调整完美的话很麻烦,所以最好多次,上代码 private void btnTranslate_Cl ...

  3. 图片在 canvas 中的 选中/平移/缩放/旋转,包含了所有canvas的2D变化,让你认识到数学的重要性

    1.介绍 canvas 已经出来好久了,相信大家多少都有接触. 如果你是前端页面开发/移动开发,那么你肯定会有做过图片上传处理,图片优化,以及图片合成,这些都是可以用 canvas 实现的. 如果你是 ...

  4. WPF 触摸屏多点触控图像的缩放旋转和移动

    <dxc:DXWindow xmlns:dxe="http://schemas.devexpress.com/winfx/2008/xaml/editors" xmlns:d ...

  5. WPF中的平移缩放和矩阵变换(TranslateTransform、ScaleTransform、MatrixTransform)

    在WPF中的平移缩放都是通过RenderTransform这个类来实现这些效果的,在这个类中,除了平移和缩放还有旋转.扭曲变换.矩阵变换.这些都差不多的,都是坐标的变换. 这里我就先简单弄个平移和缩放 ...

  6. 好吧,CSS3 3D transform变换,不过如此!

    一.写在前面的秋裤 早在去年的去年,我就大肆介绍了2D transform相关内容.看过海贼王的都知道,带D的家伙都不是好惹的,2D我辈尚可以应付,3D的话,呵呵,估计我等早就在千里之外被其霸气震晕了 ...

  7. 好吧,CSS3 3D transform变换,不过如此!——张鑫旭

    一.写在前面的秋裤 早在去年的去年,我就大肆介绍了2D transform相关内容.看过海贼王的都知道,带D的家伙都不是好惹的,2D我辈尚可以应付,3D的话,呵呵,估计我等早就在千里之外被其霸气震晕了 ...

  8. Safari 3D transform变换z-index层级渲染异常的研究

    by zhangxinxu from http://www.zhangxinxu.com/wordpress/?p=5569 一.Safari是新时代的IE6 在2年前介绍currentColor变量 ...

  9. 第98天:CSS3中transform变换详解

    transform变换详解 本文主要介绍变形transform. Transform字面上就是变形,改变的意思.在CSS3中transform主要包括以下几种:旋转rotate.扭曲skew.缩放sc ...

随机推荐

  1. HDUOJ----4004The Frog's Games(二分+简单贪心)

    The Frog's Games Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65768/65768 K (Java/Others) ...

  2. 【LeetCode】164. Maximum Gap (2 solutions)

    Maximum Gap Given an unsorted array, find the maximum difference between the successive elements in ...

  3. OOAD和UML

    ooad: object oriented analysis designer 又有两个分支: ooa(object oriented analysis):what to do ood(object  ...

  4. 安卓开发应该知道的Drawable、Bitmap、Canvas和Paint的关系

    首先让我们理解下Android平台中的显示类是View,但是还提供了底层图形类android.graphics,今天所说的这些均为graphics底层图形接口. Bitmap - 称作位图,一般位图的 ...

  5. C#基础 - C# 的 常见概念简述

    在上篇文章中,你跟着我写了一个HelloWorld,本篇中,我们来谈谈一些C#程序中的小概念 1.C# 程序结构 一个 C# 程序主要包括以下部分: 命名空间声明(Namespace declarat ...

  6. 摘:ClickOnce部署

    ClickOnce部署 http://www.cnblogs.com/weixing/p/3358740.html#undefined (1):一些发布方式 ClickOnce是什么玩意儿,这个问题嘛 ...

  7. LevelDB场景分析2--Open

    1.源码 1 Status DB::Open(const Options& options, const std::string& dbname,      uint64_t new_ ...

  8. python解压压缩包的几种方法

    这里讨论使用Python解压例如以下五种压缩文件: .gz .tar  .tgz .zip .rar 简单介绍 gz: 即gzip.通常仅仅能压缩一个文件.与tar结合起来就能够实现先打包,再压缩. ...

  9. Python isalnum() 方法

    描述 Python isalnum() 方法检测字符串是否由字母和数字组成. 语法 isalnum()方法语法: S.isalnum() 参数 无. 返回值 如果字符串至少有一个字符并且所有字符都是字 ...

  10. print to console or file

    /*----------------------------------------------------------------------*/ /*              Debug for ...