Expression Blend 4 -step6 【SketchFlow】

介绍一个新的概念----SketchFlow（草图模式）

SketchFlow，我认为是更加适合设计师的一种工程，他的特点是，以草图模型为基础，默认样式均为草图模式，并可以自建页面以及地图，展示时通过.exe文件用SketchFlow Player打开，可同时展示页面与地图，可以加入简单的导航交互，简单的过场动画，但WPF模式不可以加入手动触发的事件。

可以更加方便的让用户理解整体工程的架构，模拟操作，体验工程的易操作性等等，简单的展示工程风格以便客户提出建议，对于设计师来说，是比较好的工具。

另一方面，SketchFlow中虽然也有代码模式，但其中的代码却并不能方便的让开发人员复制并使用在Application中，因此，对开发人员的帮助并不太大，但对于设计师却是一个利器。

首先打开Blend

在WPF和Silverlight中都有SketchFlow工程，但Windows Phone不支持这个模式。

WPF导出后生成一个.exe的可执行文件，更像是一个应用程序，但不支持在按钮上添加触发事件，而Silverlight则生成一个HTML文件，更像是一个网页，这是二者的区别

设置好路径和文件名，确定

相比于之前介绍的布局，SketchFlow在中部下方多出了SketchFlow Map部分

先说一些基本的，在这里，页面大小的设置需要在代码模式中调整

图中代码第8行，Width和Height是页面宽高，改变数字可调整页面大小

基本的操作，图形，按钮，控件等等，都和前面教程中相同，但是需要注意，在WPF的SketchFlow中，按照前面教程中Behavior部分的操作，可以成功加入交互动作，但是有可能会在导出的时候不成功……（具体原因得看运气了……）

说点儿以前没介绍过的

数遍移至map里面的Screen1，出现

双击蓝色区域，可以修改页面的名称（关联xaml的名称）

下方的按钮，左一是创建一个与本页面有相关链接的页面

（可以用来做软件或网页模型，按键跳转等都可以这样简单完成）

左二是与本没有连接的页面创建一个链接，其实也可以直接拖动页面至目标页

 

左三是创建一个各个页面的模板（或背景）

 

注意：要预先设置好绿色页面的尺寸，否则有可能做了半天，尺寸不对，很郁闷的……

这部分，可以用作网页的顶部，banner，菜单栏，copyright等固定的内容，做一个页面就OK了，省的重复劳动。

然后拖动绿色部分（Screen3）至想要制作同样内容的页面

Map部分的介绍，基本就这些~大家有问题再问我吧~呵呵

还有一点说一下，在SketchFlow工程中，所有的按钮，控件类型，都是默认的草图模式

如果需要让这些草图模式回到默认的正式样式，需要选中控件，右键菜单栏中选择EditTemplate----Apply Resource----FocusControl-Sketch

注意，TabItem控件，需要把面板，选项卡分别修改。

结果如下

 

关于SketchFlow的Storyboard，默认是在程序打开时开始播放的

F5键可以进入SketchFlow播放器或浏览器播放SketchFlow工程

刷新可以重新播放Storyboard，Map可以展开地图，放大缩小就不解释了

下方有我的反馈，可以写一些客户对草图的看法和意见，方便日后修改，反馈面板最右侧按钮，可以导出反馈，记得一定要导出，否则就没有了……

导出的是一个.feedback文件，可以在Blend中导入，比较方便

最后，Sketchflow做好以后，导出演示文件

最终导出的是一个文件夹，记好存在哪儿了，在文件夹中找到.exe文件或者html文件，大功告成。

这就是简单的关于SketchFlow工程的介绍，都是些基础的内容，由于我做的东西涉及版权问题，目前为止都还没有实例教程，我会在做好的东西发布以后，争取做一些实例教程的。

谢谢大家的支持~