本指南中咱们将按步骤建立一个模拟登山运动服务平台的微型网络。在运用 Flash Catalyst MAX Release时所须要的操作都将在此指南中得到说明展示。要开始这个程序，计算机必须安装Flash Catalyst,Photoshop CS4，并须要 下载PSD文件。作为screencast，此教程 也可有一些小的变动（感谢screencast之父，李布莱姆洛）。
导入图片
可以先阅读 PSD文件。为优化Flash Catalyst操作程序，一些无需运用的图层已被合并。留心图层与文件夹结构。接着打开Flash Catalyst,在“从设计文档中建立新项目”栏中挑选 “从Adobe Photoshop PSD文档---”，并挑选将要下载的文档：Exp endition_Simple.psd.
在此导入界面上有一系列的选项。目前可以将其保存为定值，但Flash Catalyst提供性格化设计打造功能。其中所有的图层都可编辑，并允许导入潜藏图层。而且在左下角有一个高级配置目录，可以通过它逐层指定操作导入文档，编辑或者使其平面化。
Flash Catalyst界面推荐
一旦导入库加载完毕，导入对象将得到显示，与在Photoshop中的显示别无差别。图层都被罗列在左边的图层面板中，在页面底部有一个“时间轴”，而且在“页面／状态”面板中单独呈现“页面一”的状态。此时界面会给出提示：“‘自动效果’无法
用 ”。Flash Catalyst会根据操作者处理对象和内容的形式自动转换状态。假如一次处理很多图层或对象，会使操作速度变慢，因而操作者往往会将其默认关上。Flash Catalyst文档相当基本易操作，只须要在“时间轴”下拉栏中挑选 “自动转换效果”，就可以实现状态间的自动转换功能。
现在一切就绪。首先双击“时间轴”，使其最小化，移出操作界面。接着须要建立一个新状态。在页面上部的“页面∕状态”面板中，点击“复制状态”，便会使页面一中所有的信息复制到页面二中去。在此流程中，界面会产生一些改变。首先“时间轴”会弹回，为页面一与页面二间的转换腾出空间。在图层面板中，所有图层旁边有两个图框，传统面板中只有一个图框。有色图框是分辨哪个图层属于哪个页面或是状态的视觉线索。留心建立的两个页面的边框颜色与图层面板框的颜色一致。接着将页面一重命名为“Main”，而页面二命名为“Most_Popular”(在页面名中不允许存在空格)。
保证“Most_Popular”被挑选，然后点击图层面板中Popular Detail旁边的视窗框，而Popular Detail可以潜藏或者显示文件夹中的所有内容。此流程中，留心时间轴为咱们建立了一整套转换，因为Flash Catalyst检测到“Main”和“Most_Popular”之间的差别是咱们使那些图层可见。现在咱们要做一些自解释打造，所以双击标签潜藏时间轴面板，然后点击Popular Detail文件夹旁边的箭头以显示其内容。
建立自解释／通用组件
首先咱们要在Mont Blanc目录项中建立一个自解释组件。咱们有一个拥有悬浮状态和正常状态的文件夹。点击Mont Blanc Hover旁边的箭头，并挑选所有的子层。点击Control+G（或者Option+G）键组合它们。点击这个组合旁边的箭头之后，所有的图层仍然存在，这只是让它们更容易操作。也可以双击组合文本并将其重命名。可以称其为“Mont Blanc Hover”。现在可以建立自解释组件了。
挑选刚刚建立的组合以及Mont Blanc文件夹中的图层。它该如下图所示。一旦这些被选中，就可以用平视显示器建立一个自解释组件。平视显示器是一个黑色浮动框，它会根据操作者的挑选而改变，所以在处理对象时就会得到正确的文本背景。在这种情况下，咱们有两个挑选对象，并（正确地）假定来处理属性。运用平视显示器可以点击“将图片转换为组件”，并在列表底部挑选 “自解释／通用组件”。此时Mont Blanc Hover文件夹应该显示一个图层“自解释组件一”。双击文本，并将其名改为“Mont Blanc”。
为确实编辑组件，须要在主要设计区域内双击组件。此流程 中，设计视频产生改变，因而咱们只须要处理组件中的内容。此时其他部分无法 运作，在页面／状态面板中只有一个状态栏，而图层面板发生了细微的改变—现在在自解释组件一的标题下，有两个图层（Mont Blanc Hover组合和原先的Mont Blanc图片）。以前处理一个固有的元件，比如按钮的时候，在状态面板里会有向上、覆盖、向下和无效等状态，因为这些是按钮的固有状态。但是在自解释／通用组件中可以建立自己的状态。现在让咱们运用复制状态按钮复制状态一，将其重命名为“正常”，并将状态二命名为“悬浮”。
用时间轴切换
现在咱们须要对状态实行操作。在“正常”状态中，咱们打算显示一些常规图像，所以务必选中“正常”状态，并点击Mont Blanc悬浮图层旁边的视窗。然后双击时间轴标签，就会看到Flash Catalyst自动建立出隐退效果。假如点击播放按钮，就会看到转换效果。但目前还不是非常好的或是有趣的程序，现在让咱们更深入一些吧。咱们想要达到的效果是放大常规图像，并在它变大的时候渐渐现出更多细节性的信息。挑选 “悬浮”状态，然后运用图层面板挑选常规Mont Blanc图像（因为它潜藏在更大的悬浮图像后面，所以主要的设计区域是无法运用的。）现在锁定左下角的蓝色矩形，并将其拖长到与Mont Blanc悬浮对象相同的尺寸。正确操作后，Flash Catalyst会自动产生移动和调整大小的功能，与先前在时间轴面板中的隐退功能共同起作用。然后播放一下看看效果。可以在“正常”与“悬浮”之间的实行切换以检查两者间的转换。
而正如你所见，这些并不圆满 ，但幸运的事，咱们可以在时间轴中实行处理以改动效果。我现在在移动和调整效果结束前，将隐退功能框缩短，并将其移至右边。但假如你想，可以改动它，只要确保“正常—悬浮”与“悬浮—正常”两个状态都得到改动。恭喜！你已经在Flash Catalyst中建立了你的第一个自解释Flex组件。现在点击在设计区域之上黑色条框内的Exp idition_Simple文本，以回到主要运用 区间。
建立互动
咱们已经建立了自解释组件，现在须要为它建立互动，因而当运用者滚动它的时候，就能转到悬浮状态。此时你的自解释组件理应已被选中，假如没有的话，在主要设计区域挑选它，或是在图层面板里点击“Mont Blanc”。现在挑选平视显示器中的互动标签，你将会看到一个编辑组件的按钮，但因为这个步骤已完成，所以咱们将要做的是建立一个自解释互动，可以通过点击加号完成它。咱们将为“鼠标位于按钮上”建立一个新的自解释互动。建立后列表中会添加一个“鼠标位于按钮上”互动项。现在可以点击“内部活动”目录，并挑选 “播放切换状态”。这能调出状态框，因而能更方便的挑选须要转换的状态。在状态框目录中，有两个主要运用 状态：“Main”和“Most_Popular”,另外还有刚刚建立的组件所处的状态。接着挑选 Mont Blanc下的悬浮状态。咱们也须要建立 “鼠标滑出按钮”的效果，所以只须要复制以上步骤，但是状态必须转换为“正常”状态，而不是“悬浮”状态。
您可能会留心
在互动目录下可以处理动作顺序。我暂时不会涉及这个疑问，但假如你想环绕组件外周不断改变的对象，就可以运用动作序列功能。这会使运用 程序的其他部分更灵活地对互动事件产生反映。
页面间操作
既然咱们已经建立了自解释组件，那么现在可以开始建立两个页面间的转换程序了。切换到“Main”状态，会发觉现在建立自解释组件是可见的，那么继续运用图层面板将剩下的通俗图像处理为可视。使瑞尼尔和沃丁顿图像可视，但通俗图像的推荐信息一暂时保持为不可见，待会再做处理。咱们想要达到的效果是那三个图框从页面的右边跳入。在主要设计区域内或图层面板中选中这三个图框，然后只需用箭头或鼠标将它们移出屏幕即可。正如自解释组件一样，Flash Catalyst能自动为咱们生成切换，可以用播放按钮实行测试。
我对有趣的切换很感兴趣，决定对它们做一点改动，使得顶端的瑞尼尔能第一个跳入，其他的紧随其后。假如你想就可以建立它，但咱们的时间轴如下图所示（切记要改动两个状态的切换）：
绘图工具的操作
咱们已经建立了页面和切换，现在运用者须要一条通往页面和切换功能的途径。在右上方有一些文本链接，那么来将“Most_Popular”文本链接转变成一个按钮吧。当带有光标的文本被导入进Flash Catalyst时，产生了文本对象和光标对象，所以先运用图层面板选中它们，然后再用平视显示器将两者转换成按钮组件。操作时显示器工作，使得咱们可以自动编辑任何状态。在显示器中点击“覆盖”状态，就可以开始编辑该按钮了。
现在咱们可以运用内置的绘图工具来建立一个图框，因而当咱们停留在文本上时，该图框就会出现在文本旁边。挑选矩形工具，在文本旁边画出一个矩形。此时平视显示器会弹出，您可以改动一些属性。将填充色改为黑色，光标颜色改为“d0d1d9”，并将不透明度设为70。
但那些看起来似乎不太对劲。正如运用所有的Adobe设计工具可以操纵图层面板改动深度一样，运用 Flash Catalyst中的图层面板，可以将文本下的“Rect1”拖到底部。
咱们也须要改动 “下状态”以包括矩形框，或许把它变得更透明一些。运用页面∕状态目录挑选 “下状态”。
你可能已经留心到“Rect1”在图层面板中淡出，而唯一带色的是蓝色框，在下状态中只会用到它。跟自解释组件操作一样，咱们也可以通过点击视窗栏将它添加到状态中去。务必保证矩形被选中，然后将不透明度改为60，并添加光标宽度为2。
现在回到主要运用 程序，运用平视显示器建立一个点击互动，操作与先前建立 Most_Popular按钮的操作一样。咱们只须要建立一个点击互动和转换到Most_Popular状态的切换。
组件和皮肤操作
只要再配置让人们搜索的功能后，就可以完成运用 了。在界面中有一个矩形框，框中有“搜索旅游”多个字，可以用来建立搜索框。运用图层面板，挑选一下三个图层：搜索旅游图层，图层21，图层21的外光标图层；然后运用平视显示器将图像转换成文本输入组件。这时平视显示器会产生一些改变，编辑组件按钮不见了。接着点击平视显示器。
然后进入先前经常看到的组件编辑模式。运用图层面板选中“搜索旅游”图层，这个图层是真实的文本图层。当点击它时，平视显示器又一次发生改变，并出现“指定部件”对话框，该对话框可以将图像转化成文本输入部件。
在Flex4中出现了皮肤组件这个概念。例如，在可卷起的横条部件中可以看到不同的皮肤组件：记录按钮，向上按钮和向下按钮。当处理复杂一些的组件时，Flash Catalyst允许指定图像与某个特殊的皮肤部件相联系。文本输入控制有一个皮肤部件和实际文本，而Flash Catalyst能够剖析出当你挑选了一个矩形图框和文本图框时，文本必须是“文本视窗”部件。假如想突出这个特征的话，务必保证仍然选中“旅游搜索”图层，并运用 “将图框转换成文本输入部件”将文本指定为“文本视窗”部件。
完成
运用文档>运行项目目录去看看效果。“最受欢迎”按钮可以互动，停在“蒙特布朗克”图像上可以显示细节信息，并且在输入文字后可以进入搜索框。留心 Flash Catalyst精确保存了 Photoshop中的字体信息
。 从这里出发
现在你有多个不同的挑选。咱们一直在处理一个Flex项目。你可以切换到代码视图，看看这些部件和状态是怎样建立起来的。完成之后，可以运用文档目录将效果输出为SWF格式并部署进网页。因为Flash Catalyst项目多，所以须要添加一些逻辑操作与数据。为此，可先以Fxp 文档形式保存这个项目。该Fxp 文档只是一个包含了所有操作
Flex Builder时须要的信息和代码的ZIP文档。运用 Flex Builder的“Gumbo”可以打开完全一样的项目，并对其做一些改良。留心到了吗？当咱们停留在Mont Blanc图像上时，那个小的Goole地图呈现为方形。嗯，运用 Flex Builder Gumbo建立互动的话，将会是件有趣的事。我会在以后的教程 中讲到。
