下如何建立个DeepZoom应用
如果你用过DeepZoomComposer
你会发现在DeepZoomComposer中导出
时候“CreateCollection ”选项这里决定了你导出是张整图还是个图片集合有关导出整图你可以参考大V初试Deep Zoom Composer(Step by Step|More Pictures)(超酷+必试) 这篇文章写得很不错(建议你阅读下
和其重复内容我将省略了)有关图片集合下面会讲到和导出整图不
样你不能这样使用:<MultiScaleImage
x:Name="msi"
ViewportWidth="1.0"
Source="/XXXX/info.bin" MouseLeftButtonDown="msi_MouseLeftButtonDown" MouseLeftButtonUp="msi_MouseLeftButtonUp" MouseMove="msi_MouseMove"/>而应该将info.bin替换成:items.bin在导出文件中你会找到该文件这表示你导出是个集合这时运行你
你变可以看到个图片集合显示在那里了但可惜是没有任何交互在那的前我们先了解下MultiScaleImage几个重要属性(我不知道是不是我Silverlight SDK版本不对在MultiScaleImage中其关键几个属性、思路方法和事件没有相关注释所以有必要将我对这几个属性、思路方法、事件理解列举下)Source:即DeepZoomComposer导出
文件(单个文件为Info.Bin,集合为Items.Bin)SubImages:子图片
如果DeepZoomComposer导出为集合话其将集合中每个元素作为个MultiScaleSubImage对象存储在这个集合中对子图片操作就全靠它了UsingSprings:是否启用其默认动画(就是那中很飘逸
感觉取消则比较生硬了)Viewport: 视口位置(可以简单理解成眼睛所在位置
有过3D编程经验比较容易理解)ViewportWidth:视口宽度
视口越宽看到东西越到(感觉上离图片越远或图片缩小了)AspectRatio:宽高比
ElementToLogicPo
:从元素坐标(物理坐标)转换为逻辑坐标 (元素坐标则是我们平时所说普通坐标逻辑坐标则是指元素左上角为0,0点右下角为11点而言相对坐标)LogicToElementPo
:和上述相反ZoomAboutLogicPo
(double, double, double):按逻辑坐标缩放第个参数指定缩放增量后两个参数指定缩放中心MotionFinished事件:动画结束(或者说当你操作图片或子图后其运动结束)
有关子图:
每个子图是
个MultiScaleSubImage对象其在MultiScaleImageSubImages属性中如何移动子图位置:
你可以通过指定该子图
ViportOrgin属性来指定它位置比如subImage.ViportOrgin =
Po(x,y);所以如果你想将子图像WPF中
样排列成Grid元素样没办法个个计算xy然后指定吧如何缩放子图:
你可以通过子图
ViewportWidth属性来控制值越大子图就越小如何显示或隐藏子图:
没有visibility或相关属性
但你可以通过设置其Opacity(不透明度)来实现如何获取指定子图
位置和大小(Rect)参考这个思路方法:
private Rect GetSubImageRect(MultiScaleImage msi, index)
{
(index < 0 || index >= msi.SubImages.Count)
{
Rect.Empty;
}
MultiScaleSubImage image = msi.SubImages[index];
double scaleBy = 1 / image.ViewportWidth;
Rect(-image.ViewportOrigin.X * scaleBy,
-image.ViewportOrigin.Y * scaleBy,
scaleBy,
(1 / image.AspectRatio) * scaleBy);
}如何根据X
Y坐标得到相应位置处子图:参考这个思路方法:
private GetImageIndexFromPosition(MultiScaleImage msi, Po pt)
{
pt = msi.ElementToLogicalPo(pt);
for ( i = 0; i < msi.SubImages.Count; i
)
{
MultiScaleSubImage image = msi.SubImages[i];
double scaleBy = 1 / image.ViewportWidth;
Rect imageRect = this.GetSubImageRect(msi, i);
(imageRect.Contains(pt))
{
i;
}
}
-1;
}
最新评论