- 源于遥感影像的金字塔显示方式
- 提供了与高分辩率图像进行交互的能力
- 可以快速绽放图像而不影响应用的性能
- 加载或平衡图像时可以光滑过渡,Spring Animatio
n可做的图像分类有两种,为如下:
- Single 单一图片
- Collection 系列图片
制作 DeepZoom 图像需要到微软的下载网站下载DeepZoomComposer 工具
MultiScaleImage 的使用
- 打开、放大和平移多分辩率图像
- 快速任意缩放展示大图像、高分辩率图像的应用程序
- 属性 Source -Web URI UseSprings-Spring animation ViewportOrigin -中心点 ViewportWidth -缩放级别
下面是一张对中心点和缩放级别的效果:
事件
- ImageFailed 下载超时、打开错误时触发
- ImageOpenFaild 图像打开失败触发
- ImageOpenSuccesded 图像打开成功后触发
代码如下:
public partial class Page : UserControl { Point lastMousePos = new Point(); Point lastMouseLogicalPos = new Point(); Point lastMouseViewPort = new Point(); bool duringDrag = false; double zoom = 1; double minzoom = 0.001; bool duringOpen = false; public Page() { InitializeComponent(); } /// <summary> /// 鼠标滚轮缩放 /// </summary> /// <param name="sender"></param> /// <param name="e"></param> void ZoomImage_MouseWheel(object sender, System.Windows.Input.MouseWheelEventArgs e) { double newzoom = zoom; if (e.Delta > 0) newzoom /= 1.3; else newzoom *= 1.3; Point logicalPoint = this.ZoomImage.ElementToLogicalPoint(this.lastMousePos); this.ZoomImage.ZoomAboutLogicalPoint(zoom / newzoom, logicalPoint.X, logicalPoint.Y); zoom = newzoom; e.Handled = true; } /// <summary> /// 原始大小 /// </summary> /// <param name="sender"></param> /// <param name="e"></param> private void Home_Click(object sender, MouseButtonEventArgs e) { this.ZoomImage.ViewportOrigin = new Point(0, 0); this.ZoomImage.ViewportWidth = 1; zoom = 1; } /// <summary> /// 放大 /// </summary> /// <param name="sender"></param> /// <param name="e"></param> private void ZoomIn_Click(object sender, MouseButtonEventArgs e) { double newzoom = zoom / 1.3; if (newzoom < minzoom) { newzoom = minzoom; } Point logicalPoint = this.ZoomImage.ElementToLogicalPoint(new Point(this.ActualWidth / 2, this.ActualHeight / 2)); this.ZoomImage.ZoomAboutLogicalPoint(zoom / newzoom, logicalPoint.X, logicalPoint.Y); zoom = newzoom; } /// <summary> /// 缩小 /// </summary> /// <param name="sender"></param> /// <param name="e"></param> private void ZoomOut_Click(object sender, MouseButtonEventArgs e) { double newzoom = zoom * 1.3; if (newzoom > 1) { newzoom = 1; } Point logicalPoint = this.ZoomImage.ElementToLogicalPoint(new Point(this.ActualWidth / 2, this.ActualHeight / 2)); this.ZoomImage.ZoomAboutLogicalPoint(zoom / newzoom, logicalPoint.X, logicalPoint.Y); zoom = newzoom; } /// <summary> /// 鼠标按下 /// </summary> /// <param name="sender"></param> /// <param name="e"></param> private void ZoomImage_MouseLeftButtonDown(object sender, MouseButtonEventArgs e) { //获取按下时图像坐标位置 lastMouseLogicalPos = e.GetPosition(this.ZoomImage); //获取视区中心点位置 lastMouseViewPort = this.ZoomImage.ViewportOrigin; duringDrag = true; } /// <summary> /// 鼠标抬起 /// </summary> /// <param name="sender"></param> /// <param name="e"></param> private void ZoomImage_MouseLeftButtonUp(object sender, MouseButtonEventArgs e) { duringDrag = false; this.ZoomImage.UseSprings = true; } /// <summary> /// 鼠标移动 /// </summary> /// <param name="sender"></param> /// <param name="e"></param> private void ZoomImage_MouseMove(object sender, MouseEventArgs e) { if (duringDrag) { Point newPoint = lastMouseViewPort; Point thisMouseLogicalPos = e.GetPosition(this.ZoomImage); //将最后一次的坐标位置和控件的真实宽度和缩放级别进行计算 newPoint.X += (lastMouseLogicalPos.X - thisMouseLogicalPos.X) / this.ZoomImage.ActualWidth * this.ZoomImage.ViewportWidth; newPoint.Y += (lastMouseLogicalPos.Y - thisMouseLogicalPos.Y) / this.ZoomImage.ActualWidth * this.ZoomImage.ViewportWidth; //这样的计算将产生平移的效果 this.ZoomImage.ViewportOrigin = newPoint; } } /// <summary> /// 图像加载成功 /// </summary> /// <param name="sender"></param> /// <param name="e"></param> private void ZoomImage_ImageOpenSucceeded(object sender, RoutedEventArgs e) { duringOpen = true; } /// <summary> /// 图像加载完成 /// </summary> /// <param name="sender"></param> /// <param name="e"></param> private void ZoomImage_MotionFinished(object sender, RoutedEventArgs e) { if (duringOpen) { duringOpen = false; // zoom out a tad bit. this.ZoomImage.ViewportOrigin = new Point(-0.4, -0.1); this.ZoomImage.ViewportWidth = 1.8; } } }
这里参考了以下文章,关于WP7http://www.cnblogs.com/TerryBlog/archive/2011/01/27/1946536.html