1.用Visual Studio和Silverlight 3 Tools开发环境设置图片
启动Visual Studio，并创建新的Silverlight工程
(1)在Start菜单，指向并单击Visual Studio 2008
注意:如果是首次启动需要设置开发环境，我们选择C#开发环境
(2)点击File->New->Project…
(3)在New Project对话框中Project types列表中点击Silverlight
(4)在Templates中选择Silverlight Application
(5)Name项目填写：HOL
(6)Solution Name:HOL
(7)其余为默认
接下来的过程，你会看到在项目中添加一个图片和按钮
向工程中添加图片并编辑产生3D特效和模糊滤镜，阴影滤镜特效
(1)右击HOL工程项目，选择Rebuild
(2)右击ClintBin 添加桌面图片：LAB1->Add-Pic-Silverlight Tools->Cartoon.jpg
(3)在MainPage.xaml文件中添加代码：
Code highlighting produced by Actipro CodeHighlighter (freeware)
http://www.CodeHighlighter.com/
--><Canvas Width=”1000”,Height=”1000”Background=”Black”>
<Image Source=”Cartoon.jpg”Height=”500”Width=”500”Canvas.Left=”210”Canvas.Top=”0”>
<Image.Protection>
<PlaneProjection Retation X=”50”></PlaneProjection>
</Image.Projection>
</Image>
</Canvas>
(4)Ctrl+F5，您可以看到3D效果的图片
(5)删除<Image.Protection>
Code highlighting produced by Actipro CodeHighlighter (freeware)
http://www.CodeHighlighter.com/
--><PlaneProjection Retation X=”50”></PlaneProjection>
</Image.Projection>
添加<Image.Effect> <BlurEffect x:Name="blurEffect" Radius="100"></BlurEffect>
</Image.Effect>
</Image>
<Slider x:Name="blur" Canvas.Top="10" Canvas.Left="210" Width="500" Minimum="0" Maximum="10" Value="{Binding Radius,Mode=TwoWay,ElementName=blurEffect}"></Slider>
注意: Slider是和Image并列的控件，Slider在Image控件外定义
(6)修改Image属性：Canvas.Left=”250” Canvas.Top=”0”Height=”400”Width=”400”删除BlurEffect控件和Slider控件，添加：
Code highlighting produced by Actipro CodeHighlighter (freeware)
http://www.CodeHighlighter.com/
--><DropShadowEffect x:Name="dropShadowEffect" BlurRadius="5" Color="Blue" Direction="315" Opacity="1" ShadowDepth="5"/>
添加Slider控件：
<Slider Canvas.Top="20" Canvas.Left="250" Width="400" Minimum="0" Maximum="10" Value="{Binding BlurRadius,Mode=TwoWay,ElementName=dropShadowEffect}"></Slider>
<Slider Canvas.Top="30" Canvas.Left="250" Width="400" Minimum="0" Maximum="360" Value="{Binding Direction,Mode=TwoWay,ElementName=dropShadowEffect}"></Slider>
<Slider Canvas.Top="40" Canvas.Left="250" Width="400" Minimum="0" Maximum="1" Value="{Binding Opacity,Mode=TwoWay,ElementName=dropShadowEffect}"></Slider>
<Slider Canvas.Top="10" Canvas.Left="250" Width="400" Minimum="0" Maximum="100" Value="{Binding ShadowDepth,Mode=TwoWay,ElementName=dropShadowEffect}"></Slider>
注意：这里用不同的Slider绑定不同DropShadow特性
2.用Deep Zoom Composer工具制作特效
在以下步骤，你将创建新的Deep Zoom工程，并完成Deep Zoom特效设计
创建新的Deep Zoom项目并添加和导出图片
(1)在主机程序列表中选中Deep Zoom Composer,打开并选择New Project…
(2)在New Project对话框中Name填入HOL，默认路径
(3)点击Add Image…
注意: Add Image…按钮在右上方
(4)在Add Image对话框中，选择路径到桌面->LAB1->Add-Pic-DZcomposer文件夹下，选中其中所有的图片，点击“打开”，此时所有的图片被导入到工程项目中
(5)点击上方的Compose按钮
(6)将下方Image栏中的图片任意拖拽至编辑区域
注意: 您可以选中需要的图片，再用左侧工具对齐
(7)选中Export，您可以在左侧看到预览
(8)选择右侧导航栏的Custom，在Output Type中选择Silverlight Deep Zoom，之后选择Preview
(9)看到预览之后效果，您可以滑动鼠标滚轮和拖拽图片
注意：您可以选择不同的导出方式(Export as a Composition 或者 Export as a Collection)，导出后到导出文件目录查看有什么不同
在下面的步骤中，将为图片添加链接和通过DeepZoomPix发布
为Deep Zoom效果的图片添加链接和将其发布
(1)在上面的第6步中选中任意图片，点击右键，选择Add External Link
(2)在External Links Management 对话框中Name栏填写Silverlight. URL栏填写：http://www.silverlight.net
(3)点击”save”
(4)点击Export，在右侧选择Custom标签，选择Preview现在点击图片即可跳到相应的链接
(5)回到Export，选择DeepZoomPix标签，用Windows Live ID登陆
(6)选择Create new album, 选择Select album cover，再点击Publish
(7)登陆http://deepzoompix.com/ 查看
3.用Mosaic Maniac工具制作马赛克效果的Deep Zoom特效
在下面的步骤中，将创造马赛克效果的Deep Zoom特效
利用Mosaic Maniac工具制作马赛克效果的Deep Zoom特效
(1)在虚拟机启动菜单中选择Mosaic Maniac打开Mosaic Maniac程序
(2)点击 File->Load Master Image, 在桌面的LAB1->Add-Pic-MosaicManiac文件夹中选择(1).jpg作为母板图片
(3)点击File->Image Library->Load Image Directories
(4)将桌面->LAB1->Add-Pic-MosaicManiac文件夹中的图片导入
(5)点击Render->Photo Mosaic
(6)在Build Options 对话框中，我们将number of tiles设置为10*10，点击OK
(7)选择File->Save As->HTML
(8)在Save as Html Options对话框中选择Silverlight Deep Zoom
(9)文件名称为：DeepZoom 点击保存至桌面-〉LAB1文件夹
(10)运行
注意：您将number of tiles改成30*30再看看效果有什么不同
比较Silverlight的Deep Zoom与Flash的Open Zoom
(1)在上一任务的Save as Html Options对话框中选择Flash Open Zoom
(2)点保存至桌面-〉LAB1文件夹，文件名称为OpenZoom
(3)点击保存
(4)比较DeepZoom与OpenZoom效果的差异
1.用Visual Studio和Silverlight 3 Tools开发环境设置图片
启动Visual Studio，并创建新的Silverlight工程
(1)在Start菜单，指向并单击Visual Studio 2008
注意:如果是首次启动需要设置开发环境，我们选择C#开发环境
(2)点击File->New->Project…
(3)在New Project对话框中Project types列表中点击Silverlight
(4)在Templates中选择Silverlight Application
(5)Name项目填写：HOL
(6)Solution Name:HOL
(7)其余为默认
接下来的过程，你会看到在项目中添加一个图片和按钮
向工程中添加图片并编辑产生3D特效和模糊滤镜，阴影滤镜特效
(1)右击HOL工程项目，选择Rebuild
(2)右击ClintBin 添加桌面图片：LAB1->Add-Pic-Silverlight Tools->Cartoon.jpg
(3)在MainPage.xaml文件中添加代码：
Code highlighting produced by Actipro CodeHighlighter (freeware)
http://www.CodeHighlighter.com/
--><Canvas Width=”1000”,Height=”1000”Background=”Black”>
<Image Source=”Cartoon.jpg”Height=”500”Width=”500”Canvas.Left=”210”Canvas.Top=”0”>
<Image.Protection>
<PlaneProjection Retation X=”50”></PlaneProjection>
</Image.Projection>
</Image>
</Canvas>
(4)Ctrl+F5，您可以看到3D效果的图片
(5)删除<Image.Protection>
Code highlighting produced by Actipro CodeHighlighter (freeware)
http://www.CodeHighlighter.com/
--><PlaneProjection Retation X=”50”></PlaneProjection>
</Image.Projection>
添加<Image.Effect> <BlurEffect x:Name="blurEffect" Radius="100"></BlurEffect>
</Image.Effect>
</Image>
<Slider x:Name="blur" Canvas.Top="10" Canvas.Left="210" Width="500" Minimum="0" Maximum="10" Value="{Binding Radius,Mode=TwoWay,ElementName=blurEffect}"></Slider>
注意: Slider是和Image并列的控件，Slider在Image控件外定义
(6)修改Image属性：Canvas.Left=”250” Canvas.Top=”0”Height=”400”Width=”400”删除BlurEffect控件和Slider控件，添加：
Code highlighting produced by Actipro CodeHighlighter (freeware)
http://www.CodeHighlighter.com/
--><DropShadowEffect x:Name="dropShadowEffect" BlurRadius="5" Color="Blue" Direction="315" Opacity="1" ShadowDepth="5"/>
添加Slider控件：
<Slider Canvas.Top="20" Canvas.Left="250" Width="400" Minimum="0" Maximum="10" Value="{Binding BlurRadius,Mode=TwoWay,ElementName=dropShadowEffect}"></Slider>
<Slider Canvas.Top="30" Canvas.Left="250" Width="400" Minimum="0" Maximum="360" Value="{Binding Direction,Mode=TwoWay,ElementName=dropShadowEffect}"></Slider>
<Slider Canvas.Top="40" Canvas.Left="250" Width="400" Minimum="0" Maximum="1" Value="{Binding Opacity,Mode=TwoWay,ElementName=dropShadowEffect}"></Slider>
<Slider Canvas.Top="10" Canvas.Left="250" Width="400" Minimum="0" Maximum="100" Value="{Binding ShadowDepth,Mode=TwoWay,ElementName=dropShadowEffect}"></Slider>
注意：这里用不同的Slider绑定不同DropShadow特性
2.用Deep Zoom Composer工具制作特效
在以下步骤，你将创建新的Deep Zoom工程，并完成Deep Zoom特效设计
创建新的Deep Zoom项目并添加和导出图片
(1)在主机程序列表中选中Deep Zoom Composer,打开并选择New Project…
(2)在New Project对话框中Name填入HOL，默认路径
(3)点击Add Image…
注意: Add Image…按钮在右上方
(4)在Add Image对话框中，选择路径到桌面->LAB1->Add-Pic-DZcomposer文件夹下，选中其中所有的图片，点击“打开”，此时所有的图片被导入到工程项目中
(5)点击上方的Compose按钮
(6)将下方Image栏中的图片任意拖拽至编辑区域
注意: 您可以选中需要的图片，再用左侧工具对齐
(7)选中Export，您可以在左侧看到预览
(8)选择右侧导航栏的Custom，在Output Type中选择Silverlight Deep Zoom，之后选择Preview
(9)看到预览之后效果，您可以滑动鼠标滚轮和拖拽图片
注意：您可以选择不同的导出方式(Export as a Composition 或者 Export as a Collection)，导出后到导出文件目录查看有什么不同
在下面的步骤中，将为图片添加链接和通过DeepZoomPix发布
为Deep Zoom效果的图片添加链接和将其发布
(1)在上面的第6步中选中任意图片，点击右键，选择Add External Link
(2)在External Links Management 对话框中Name栏填写Silverlight. URL栏填写：http://www.silverlight.net
(3)点击”save”
(4)点击Export，在右侧选择Custom标签，选择Preview现在点击图片即可跳到相应的链接
(5)回到Export，选择DeepZoomPix标签，用Windows Live ID登陆
(6)选择Create new album, 选择Select album cover，再点击Publish
(7)登陆http://deepzoompix.com/ 查看
3.用Mosaic Maniac工具制作马赛克效果的Deep Zoom特效
在下面的步骤中，将创造马赛克效果的Deep Zoom特效
利用Mosaic Maniac工具制作马赛克效果的Deep Zoom特效
(1)在虚拟机启动菜单中选择Mosaic Maniac打开Mosaic Maniac程序
(2)点击 File->Load Master Image, 在桌面的LAB1->Add-Pic-MosaicManiac文件夹中选择(1).jpg作为母板图片
(3)点击File->Image Library->Load Image Directories
(4)将桌面->LAB1->Add-Pic-MosaicManiac文件夹中的图片导入
(5)点击Render->Photo Mosaic
(6)在Build Options 对话框中，我们将number of tiles设置为10*10，点击OK
(7)选择File->Save As->HTML
(8)在Save as Html Options对话框中选择Silverlight Deep Zoom
(9)文件名称为：DeepZoom 点击保存至桌面-〉LAB1文件夹
(10)运行
注意：您将number of tiles改成30*30再看看效果有什么不同
比较Silverlight的Deep Zoom与Flash的Open Zoom
(1)在上一任务的Save as Html Options对话框中选择Flash Open Zoom
(2)点保存至桌面-〉LAB1文件夹，文件名称为OpenZoom
(3)点击保存
(4)比较DeepZoom与OpenZoom效果的差异