【IT168专稿】系列文章一和系列文章二我们介绍了新的工具—SketchFlow，在上一篇中我们讨论了如何使用样例数据实现原型设计阶段中的数据绑定及使用SketchFlow播放器添加反馈与批注信息等问题。在本篇中，我们将探讨打包SketchFlow工程和如何把一个SketchFlow原型工程转换为一个开发型工程等问题。
一、打包SketchFlow工程
您可以快速方便地打包前面所创建的SketchFlow工程原型，以便呈送给有关人员传阅以收集反馈意见。因为所有的项目文件，包括SketchFlow播放机，都被打包在包内，因此评论者不必事先安装Microsoft Expression Blend，他都能够查看你的原型文件。这一点非常类似于Microsoft PowerPoint演示文稿的打包。由于反馈信息可以以文件形式被保存起来并作为一个单独的文件返回到设计师手中，所以，设计师可以再次在Microsoft Expression Blend中打开这个反馈信息文件以便于SketchFlow项目的下一步方案调整与细化设计。
打包步骤如下：
(1)首先打开你的SketchFlow项目，然后打开菜单“File”—“Package SketchFlow Project”，开始打包你的SketchFlow项目。
(2)在“Package SketchFlow Project”对话框中，在文件夹名称框键入文件夹的名称，然后单击“Browse…”以指定你要保存打包文件的位置。最后，单击“OK”，如图28所示。
图1. 打包SketchFlow工程对话框
二、把SketchFlow原型项目转换成一个开发项目
前面提到过，使用SketchFlow进行的是原型开发，而这个原型可以需要经过再三的修改，而且原型设计的精细程度是不同的。为此，Microsoft Expression Blend 3也提供了把原型工程转换为实际工程的支持。
在转换过程中，我们只需要移除对于SketchFlow工程的引用依赖，并把相应内容转换成生产型工程中对应的内容即可。下面给出把一个SketchFlow原型项目转换成一个生产型项目的详细操作步骤：
(1)备份现有工程(使用菜单“File”—“Save Copy of Project…”)，这一步极其重要。
(2)在Projects面板中，右单击Silverlight应用程序项目(而不是下面那个Silverlight库项目)顶层文件夹(例如SilverlightPrototype1)，在Windows资源管理器中打开这个工程所在的文件夹。
(3)在Windows资源管理器中，右单击.csproj文件(例如SilverlightPrototype1.csproj)，单击“用记事本打开”。
(4)在这个文本文件中，找到并删除以下两行(功能标志)：
(5)保存并关闭上述文本文件。切换到Microsoft Expression Blend 3中，当系统提示您是否重新加载项目文件，单击“Yes”。
(6)在上面的Silverlight应用程序项目的References文件夹下，移除对于程序集Microsoft.Expression.Prototyping.Runtime.dll的引用。
(7)再次右键单击Silverlight应用程序项目顶端文件夹，然后单击“Add Reference”。在“Add Reference”对话框中，浏览到Microsoft Silverlight SDK，然后找到并单击程序集System.Windows.Controls.Navigation.dll。默认位置是C:\Program Files\Microsoft SDKs\Silverlight\v3.0\Libraries\Client。
(8)单击Open。
以上完成了对于第一个Silverlight应用程序项目的修改。接下来将要进行对Silverlight库项目的修改。
(1)在Projects面板中，右单击下面的Silverlight库项目顶层文件夹(例如SilverlightPrototype1Screens)，在Windows资源管理器中打开这个工程所在的文件夹。
(2)在Windows资源管理器中，右单击.csproj文件(例如SilverlightPrototype1Screens.csproj)，单击“用记事本打开”。
(3)在这个文本文件中，找到并删除以下两行(功能标志)：
(4)保存并关闭上述文本文件。切换到Microsoft Expression Blend 3中，当系统提示您是否重新加载项目文件，单击“Yes”。
(5)在上面的Silverlight库项目References文件夹下，移除对于程序集Microsoft.Expression.Prototyping.Runtime.dll的引用。
以上完成了对于第二个Silverlight库项目的修改。接下来将要进行对Silverlight应用程序项目的文件App.xaml.cs的修改。
(1)在App.xaml.cs文件中，找到下面代码：
[assembly: Microsoft.Expression.Prototyping.Services.SketchFlowLibraries("MyProject.Screens")]
请记下上面代码中的MyProject.Screens，这是后面的步骤中应当修改为我们自己的工程的屏幕程序集。最后，删除这一行代码。
(2)在App.xaml.cs文件中，找到下面代码：
this.RootVisual = new Microsoft.Expression.Prototyping.Workspace.PlayerWindow();
替换成如下代码：
this.RootVisual = new System.Windows.Controls.Frame() { Source = new Uri("/MyProject.Screens;component/MyFileName.xaml", UriKind.Relative) };
首先，请使用你的工程的屏幕程序集来取代上面代码中的MyProject.Screens，注意请保持与第(1)步中的提示相一致。
然后，使用你想在解决方案中第一个显示的屏幕的名称来取代上面代码中的MyFileName。
另外，请注意，如果按下F5构建工程时遇到如下错误提示：
“The project has no startup scene and may not have a main window visible after running. Do you want to continue?”
请单击“Yes”。这是可以理解的，工程中默认情况下并没有设置启动屏幕，因此在运行时不会出现可视化主窗口。既然上面我们已经修改成了自己的启动屏幕，所以单击“Yes”即可。
至此，整个我们把整个SketchFlow原型项目转换成一个开发项目。你可以按F5键运行观察。然后，在此基础上作进一步的细化开发。
【重要提示】在第一次按F5键运行观察你的工程时，你往往会发现原型设计中的导航工程无法正常工作了。你已知道，上面的步骤中提示你移除对于程序集Microsoft.Expression.Prototyping.Runtime.dll的引用，但是不知什么原因，当你再次检查你的解决方案时，你会发现上面的引用仍然存在。如果是这样，请再次移除之，相信你的导航功能就会可用了。另外，你还会发现状态切换动画可以也无法使用。一种解决办法是，在后台代码中显式调用VisualStateManager类的GoToState方法。
三、总结
Microsoft Expression Blend 3中的SketchFlow提供了各种对Silverlight应用程序(特别是游戏程序)在原型设计阶段的强有力的支持，在快捷的同时保证了很高的灵活性(请注意：凡是在Silverlight中能做的，原型图都能做)，批注功能也很实用。
此外，还提供了将原型图直接导为Word文档以及导入Adobe PhotoShop图像文件、Adobe Illustrator矢量图形文件和Microsoft PowerPoint演示文稿文件等丰富的功能。
最后，借助于SketchFlow提供的原型设计支持，相信你能够以更快的速度和更高的质量开发出更优秀的Silverlight游戏产品。
