Silverlight学习之——如何在 Silverlight 中使用 Deep Zoom

Deep Zoom 使您能够快速缩放和平移高分辨率图像。Deep Zoom 可以使用多分辨率图像来实现上述功能。

         下面演示如何创建使用 Deep Zoom 的非常简单的 Silverlight 应用程序。

创建 Deep Zoom 图像:

         一个 Deep Zoom 图像由多个不同分辨率的 JPEG 或 PNG 图像的图块组成，这些图块构成一个"图像棱锥图"。创建 Deep Zoom 图像的最佳方式是使用 Deep Zoom Composer 之类的工具。

         演示用Deep Zoom Composer创建图像

1.   下载和安装 Deep Zoom Composer。

2.   启动 Deep Zoom Composer 并创建一个新项目。

3.   在"导入"工作区中，单击"添加图像"并向项目添加一个高分辨率图像。

4.   单击"组合"工作区。

5.   在"图像"选项卡上，将图像拖到图形板上。

6.   按需要调整图像大小。

7.   单击"导出"工作区。

8.   单击"自定义"选项卡。

9.   在"输出类型"部分，选择"Silverlight Deep Zoom"。

10. 在"名称"框中，键入 dzc_output。

11. 在"位置"框中，指定位置。

12. 在"图像设置"部分，选择"导出为组合(单个图像)"。

13. 让其他设置保留其默认值。

14. 单击"导出"按钮以导出 Deep Zoom 图像文件。

在VS或Blend中加载Deep Zoom图像：

1. 在 Visual Studio 中，使用 Visual Basic 或 C# 新建一个 Silverlight 应用程序项目。

2. 找到宿主程序的ClientBin文件夹。（注意：在一些资料中介绍的是当前Silverlight应用程序的 Bin\Debug文件夹，但过我的试验在这个文件夹下是不行的）
3. 新建名为 Source 的文件夹。
4. 在由 Deep Zoom Composer 创建的 Working Data 文件夹中，将生成的 dzc_output.xml 文件和 dzc_output_files 文件夹复制到 Source 文件夹。
5. 在 Visual Studio 中，打开 MainPage.xaml。
6. 在 Grid 元素中，添加以下 MultiScaleImage 元素。

[xaml]

<MultiScaleImage x:Name="deepZoomObject" Source="source/dzc_output.xml" />

7. 生成并运行应用程序。

您应能看到 Deep Zoom 图像占据了整个浏览器窗口。

8. 刷新浏览器。

注意，该图像最初模糊，然后变得清晰。

最后，添加相应的交互，不用讲了，在上一篇的最后介绍了一下：http://www.cnblogs.com/shihao/archive/2009/12/29/1634811.html