【全面解析DeepZoom 之二】Silverlight2及Deep Zoom环境的搭建_app

概述【全面解析DeepZoom 之二】Silverlight2及Deep Zoom环境的搭建周银辉正所谓“工欲善其事，必先利其器”，环境搭建乃是最重要的一步。以前上大学的时候阅过不少大师写的教材，第一章便是讲什么是Hello World，但我却在【全面解析DeepZoom 之二】Silverlight2及Deep Zoom环境的搭建@H_301_9@ 周银辉 @H_301_9@@H_301_9@ 正所谓“工欲善其事，必先利其器”，环境搭建乃是最重要的一步。以前上大学的时候阅过不少大师写的教材，第一章便是讲什么是Hello World，但我却在环境搭建上郁闷得要死，于是要在屏幕上显示一条Hello World是那么的艰难。 @H_301_9@ 需要安装的软件有 Visual Studio 2008， Silverlight2 beta1 tools for VS2008， Expression Blend2.5 ， Deep Zoom Composer @H_301_9@注意：在安装Silverlight2 beta1 tools for VS2008之前，确保将你以前可能安装过的Silverlight插件，Silverlight SDK,Expression Blend等先卸载掉，如果安装不了Silverlight2 beta1 tools for VS2008，那么你的VS2008中就找不到Silverlight2的项目模板，也就没法创建Sliverlight2项目了。@H_301_9@至于如何使用Silverlight和VS创建一个Hello World项目，大家可以参考Scott博客中文版中的一篇文章：@H_301_18@@H_301_18@ 使用Silverlight 2 和 VS 2008创建“Hello World”程序 @H_301_9@ Blend的使用想必大家都比较熟悉了，如果有不熟悉的，可以到这里观看视频教程@H_301_9@ Deep Zoom Composer是一个专为DeepZoom设计的一个小工具，我翻译了它的用户指南，希望对你有所帮助：@H_301_9@@H_301_9@ --------------------------分割线-------------------------------------@H_301_9@ @H_301_9@ Deep Zoom Composer User GuIDe@H_301_9@ 周银辉译@H_301_9@@H_301_9@

介绍@H_301_18@

微软的@H_301_18@Silverligth2包含了对由“@H_301_18@SeaDargon”团队创建的@H_301_18@Deep Zoom技术的支持。简单地说，@H_301_18@Deep Zoom技术就是能让你查看很大的一副图片但仅仅将当前显示在你屏幕上的部分发送到你的浏览器里。你也可以对图片进行平滑的缩放和平铺。这就像是在线地图将一副很大的图片划分成很多很小的平铺的图片然后将那些你正在查看的发送到你的屏幕上。这所带来的好处就是你不必花大量时间来下载一副很大的图片数据而这些甚至你从来就没有看或注意到过。这项技术非常酷，但说实话，要为这些图片序列创建正确的坐标信息却不是一件容易的事情，而刚好@H_301_18@Expression团队为我们带来了一个工具，我们暂时称为“@H_301_18@Deep Zoom Composer”@H_301_18@

Expression Deep Zone Composer 让我们可以按照任何方式排列一个图片集中的图片（很大的图片哈），然后将他们的最终排列方式发布到@H_301_18@Silverlight2中一个称为@H_301_18@MultiScaleImage的控件中去。我们这个工具的输出是平铺图的一个集合，你最终将看到的是一个@H_301_18@XML文件，一个@H_301_18@BIN文件以及一个编号的文件夹的集合，每个文件夹中包含着最终图片排列的一部分。在一个@H_301_18@MultiScaleImage控件中引用一个@H_301_18@BIN文件所用到的@H_301_18@XAML大致是这个样子：@H_301_18@

谁会使用这样的应用程序呢？任何对@H_301_18@Silverlight2感兴趣并且想对大图进行缩放平铺等高级 *** 作的人。如果没有这项技术要想完成标准带宽下的连接显得异常困难。这个工具的受众是一些很平常的用户，有个几个很普通的场景会用到，地图是其中之一，另外一个可能是在线广告其用于为产品提供一个非常易于交互的和非常细节的观察角度。@H_301_18@

接下来是描述一下用户如何创建一个@H_301_18@Deep Zoom Composer app 项目，排列导入的图像，最后输出为一个@H_301_18@Deep Zoom Image.

启动@H_301_18@

欢迎屏幕@H_301_18@

启动@H_301_18@Deep Zoom Composer后用户会看到一个飞溅屏幕（@H_301_18@splash screen）紧接着是欢迎屏幕，在欢迎屏幕上我们可以看到两个标签页：@H_301_18@Project和@H_301_18@Help.

Project标签页为用户提供了一个最近查看的项目列表以及@H_301_18@New Project和@H_301_18@Open Project *** 作。@H_301_18@

Help@H_301_18@标签页提供了诸如@H_301_18@User GuIDe@H_301_18@之类的有用信息。@H_301_9@

@H_301_9@@H_301_18@ @H_301_9@

项目@H_301_18@

Deep Zoom Composer项目结构如下：@H_301_18@

· @H_301_18@@H_301_18@Default Path: 项目存储在@H_301_18@: C:"Users"<user>"documents"Expression"Seadragon Projects"

· @H_301_18@@H_301_18@Source Images: 所有的项目都有一个@H_301_18@Source Images文件夹用于存放导入的图片@H_301_18@

· @H_301_18@@H_301_18@Working Data: working data 目录包含了那些用于在面板上进行缩放的数据@H_301_18@

· @H_301_18@@H_301_18@Project file: 每个项目都有一个@H_301_18@*.sdprj 文件用于包含项目相关信息@H_301_18@

· @H_301_18@@H_301_18@Output: 当用户选择导出一个@H_301_18@ .sdi (Seadragon Image) 文件时其将被输出到@H_301_18@source images"OutputSdi 文件夹下@H_301_18@.

@H_301_9@@H_301_9@@H_301_9@

1，@H_301_18@工作区@H_301_18@

创建一个@H_301_18@Deep Zome Image的工作流是这样的：@H_301_18@1.导入，@H_301_18@2.构图（排列），@H_301_18@3.输出@H_301_18@

导入：@H_301_18@

在“导入工作区”中，用户可以导入一些图片到项目中@H_301_18@

@H_301_9@

图片栏：@H_301_18@

用户点击“@H_301_18@Add images”按钮来导入图片。这些图片将被显示在一个图片栏中。右击图片并选择“@H_301_18@Delete from project”可以将图片从项目中删除。@H_301_18@

图片预览：@H_301_18@

当用户选择图片栏中的一个图片时在左边可以看到它的预览图。其文件名，尺寸，文件大小等将显示在左下方。@H_301_18@

用户可以指定文件夹，但@H_301_18@Deep Zoom Composer仅仅会导入合法的图片文件类型，也就是说其支持@H_301_18@PNG，@H_301_18@JPEG，@H_301_18@TIFF和@H_301_18@BMP这几种格式，其他文件格式将被忽略。注意：目前@H_301_18@Deep Zoom Composer不支持同名文件的导入。@H_301_18@

构图（排列）@H_301_18@

“@H_301_18@Compose@H_301_18@”工作区为用户提供了定位和排列图片的功能@H_301_18@：@H_301_9@

@H_301_9@

图片栏@H_301_18@

在“@H_301_18@Compose”工作区中，被导入到项目的图片被显示在图片栏，用户可以拖放这些图片到画板中。图片栏为用户提供了如下几个基础的功能：@H_301_18@

“@H_301_18@All Image”标签页，在这里图片栏将显示项目中的所有图片。那些显示成半透明的图片表示其正在被使用（即是被拖到了@H_301_18@Compose工作区中）@H_301_18@

“@H_301_18@Layer VIEw”标签页，这个标签页仅仅显示那些被@H_301_18@Compostion使用中的图片。用户可以面板上的箭头按钮来改变图片在画板上的@H_301_18@Z轴顺序。@H_301_18@

“@H_301_18@Visibility”@H_301_18@在图片旁边的眼睛图标用于设置该图片在画板上的可见性。@H_301_18@

画板@H_301_18@

用户可以在@H_301_18@Compose工作区的画板中创建和编辑“@H_301_18@Compositions”。该工作区提供了一@H_301_18@

个拥有定位和排列图片能力的设计区和一个基础工具集（@H_301_18@selection,pan,zoom）以及基础的排列特性（@H_301_18@align & distribute）。可以通过拖拽的方式将图片栏的图片添加到画板中，用户可以在画板中排列这些图片并通过导航器来导航以及使用几种工具来修改。当然，用户也可以通过拖拽修饰器（技术图片选中状态下的几个小方块）和下面的一排按钮来修改和布局。@H_301_18@

工具：@H_301_18@ @H_301_18@

选择工具，其允许用户选择和 *** 作图片。用户可以通过@H_301_18@Adorner（修饰器？那几个小东东真不知道专业名称叫什么，抱歉）来 *** 作图片@H_301_18@

Pan工具，其允许用户通过点击和拖拽来滚动可视区域。@H_301_18@

缩放工具，当用户选择缩放工具是，其可以点击可视区域中的任何一个位置来缩放放大该点。当按住@H_301_18@ALT并单击时缩小，或使用@H_301_18@ALT+=快捷键来方法或@H_301_18@ALT+-快捷键来缩小。如果用户点击最后一个缩放图标（普通缩放图标的右边那个），在画板中的当前元素将被缩放以适合屏幕。@H_301_18@

布局功能：@H_301_18@

其也支持一些布局和分配功能（比如@H_301_18@Make same height@H_301_18@）@H_301_9@

@H_301_9@ @H_301_18@

当用户点击“@H_301_18@Align/distribute”和“@H_301_18@Make Same”图标时将执行下面的这些选择（之一）：@H_301_18@

@H_301_18@

左对齐，左右居中对齐，右对齐，上对齐，上下居中，下对齐，横向分布，纵向分布，等宽，等高。@H_301_9@@H_301_18@

@H_301_9@

@H_301_18@

输出@H_301_18@

输出工作区中为用户提供了导出为@H_301_18@Deep Zoom Image@H_301_18@或集合的功能@H_301_9@

@H_301_9@@H_301_9@@H_301_18@

输出预览，最终的@H_301_18@composition将被显示在导出标签页中。@H_301_18@

导出设置，用户可以对导出进行一些设置，比如文件名，位置等。那个复选框提供了让用户设置是否将其导出到一个@H_301_18@Deep Zoom Collection中。@H_301_18@

文章来源于 http://www.cnblogs.com/zhouyinhui 版权归原作者所有总结

以上是内存溢出为你收集整理的【全面解析DeepZoom 之二】Silverlight2及Deep Zoom环境的搭建全部内容，希望文章能够帮你解决【全面解析DeepZoom 之二】Silverlight2及Deep Zoom环境的搭建所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。

欢迎分享，转载请注明来源：内存溢出

原文地址: http://outofmemory.cn/web/1056544.html

【全面解析DeepZoom 之二】Silverlight2及Deep Zoom环境的搭建

发表评论

评论列表（0条）