Qzone社区IT游戏圈 » ·空间攻略 » 【空间攻略】个性模板小制作,在小功能中下功夫

【空间攻略】个性模板小制作,在小功能中下功夫 (3/208)

本帖地址: 复制地址

修改回帖引用楼主：点滴

本文地址：http://qzone.qq.com/blog/81089318-1251526120

相关搜索词: 小制作点滴 IT游戏圈理论

在空间制作中我们往往会忽略一些制作小功能，其实无论在其它设计还是空间设计中，小功能都是重要组成部分。要想做出好的空间模板，不仅要重视布局、素材以及主题的表达，还要重视小功能的使用。小制作，大体现。

小制作、小功能在某些时候只能起到修饰作用，如果没有这种修饰，设计作品上那里就有一些空的，显得少了生气。就拿空间来说，空间模板为何要用FLASH包装，模板中为何要修改左键、添加鼠标跟随，而且大多空间爱好都没有稳定的网络存储空间，为什么大家还要使用FLASH，直接使用图片不是比FLASH稳定好多吗！正因为用制图软件做出的模板经过FLASH这个软件包装后，呈现出来的最络结果比原有的更好，FLASH中可以实现在制图软件中无法实现的小制作、小功能，就像前面说的，模板右键、鼠鼠跟随，这些酷炫的小制作，给空间增添了不少的亮点，通过FLASH把这些小功能特以表现，这些小功能在这些空间模板中已经是点睛的作用。说了这么多，只是希望大家对小功能的重视。
好久没有写模板制作的文章，都生疏了

这篇文章是延伸《Flash制作模板鼠标跟随中的隐秘功能》中的功能，也可以说重新写了一次。先看下方的的效果

图中有一个IT520的图片是显示出来的，图片下方是一蓝色长方块，鼠标在这个长方块在滑动时，上方面的图也会随之跟随移动，当鼠标移开这个长方块时，图片将消失。

这里要在FLASH中制作出以下4种小功能：
1、动画效果：透明到不透明（对Alpha的百分比的变化）
2、动画效果：不透明到透明
3、按钮功能：按钮滑过和滑离
4、鼠标事件：鼠标跟随效果

也许你会说这么一个不起眼的效果会用4种效果才能实现，虽说这是小功能，但花的时间并不少，所以前面才说“小制作，大体现”，请看下面FLASH效果

http://www.yddi.net/qzone/090829.swf

四个蓝色小方块，鼠标滑过时FLASH将执行1、3功能（透明到不透明的效果），鼠标离开蓝色小方块时FLASH将执行2、3功能（不透明到透明的效果），鼠标在蓝色小方块上移动时FLASH将执行第4种功能（鼠标跟随效果）。

模板中如果没有这个功能，那几个小方块就是几个小方块，没有任何效果，模板显得缺少点什么，没有个性纵深的感觉，这也就是上面的所说的“点睛”。

做上面的效果，具体需要：
1、FLASH按钮一个（按理说四个方块，四个按钮在这里为何只需要一个，在下面的过程中会说明）
2、影片一个（影片中制作鼠标在按钮上时显示的内容）

按钮制作：1、启动FLASH软件在新建元件CTRL+F8选择按钮命名随意，点击确定进入按钮元件编辑界面，选中点击这个帧按F6创建关键帧，在左侧工具箱中选择矩形工具，在点击帧上绘制随意大小的长方块，如图所示。

为什么只在点击帧上绘制呢？常常在FLASH制作中要用到很多按钮，在一些按钮不需要文字标识的情况下，我们是可以只在点击帧上随意绘制一个图，这种按钮好处可以多次利用，避免了创建多个按钮增加FLASH的容量。
2、我在按钮上加了音效，按钮上添加声音，已经不是什么稀罕事了，在这里还是说明一下，看到第1步中的图指针经过的和按下这两帧上有一张蓝色的线，这是表示在这两帧上有声音，如果添加上去呢，常用方法有两种：

A、可从库中选中声音文件拖到该帧上B、选中指针经过的帧，打开属性面板，在声音列表中选择库中音乐（库是FLASH中一个存放元件和外部导入文件的地方，类似于PS中的图层面板）

FLASH中只支持mp3、wav这两种声音文件，导入方法：文件——导入——导入到库（导入到舞台也会存在库中）我通常在帧上加音效用B方法，如图所示。

影片制作（把事先准备好的图片导入FLASH中）：
1、新建影片CTRL+F8选中影片命名随意，进入影片编辑界面中，影片中需要两个图层，第一层命名为as第二层命名为img（也可以不命名，我命名是为了方便区别），在as层上的第一帧外写入脚本stop()（打开动作面板F9），因为在鼠标没有放在蓝色小方块上时，影片是不会显示内容的，所以在img层的第5帧处按F6创建关键帧，并从库中拖入一张刚才的图片到影片中同时按F8转换为图形元件，如图所示。

2、在img和as图层的第10帧、第11帧、第16帧处按F6创建关键帧，在AS图层中的第5帧创建关键帧并CTRL+F3打开属性面板，选中AS图层第2帧在属性面板添加帧标签“l1o”、在第11帧添加帧标签“l1c”，在第10帧和16帧处写脚本stop()，如图所示。

如何知道是否帧标签添加成功，可看关键帧上是否有小红旗，有小红旗表示添加成功。
3、选中img图层的第5帧上的图形，CTRL+F3打开属性面板颜色列表中选择Alpha的百分比为0% ，第10帧alpha百分比为100%，第16帧Alpha百分比为0%，如图所示。

第10帧这里可以选择无
4、选择第5帧和第10帧任意帧，CTRL+F3打开属性面板在补间列表中选择动画，第11帧和第16帧也是如此，这样透明到不透明，不透明到透明的效果就做好了，如图所示。

5、第二个图的效果不需要新建图层也不需要新建影片，就在当前影片中，选中as图层中的第5帧和16帧，可按住shift键选进行选中，然后右击选中帧执行复制帧，右击第18帧执行粘贴帧，如图所示。

6、按上面的方法对img图层的第5帧和16帧复制帧、粘贴帧，然后选择img图层18帧上的图形，CTRL+F3打开属性面板执行交换图形操作，如图所示。

依次对后面的几个关键帧上的图形都执行交换操作，并修改as图层上的帧标签，如图所示。

影片的制作在这里只说了两个图的效果，其它两个都是按此方法制作即可。
AS实现最终效果：
1、回到场景中，分别把刚才做的按钮，从库中拖入场景中的四个广场上方（可新建一层按钮层），如图所示。

上面制作按钮的，只在点击帧上绘制的图形，在FLASH制作中这个按钮呈半透明蓝色，成生SWF后，按钮是完成透明的不会有什么影响。2、从库中把刚才做的影片拖入场景中，选中影片打开属性面板加上实例名为“info”，如图所示。

3、选中这个影片按F9打开动作面板写入使影片跟随鼠标的AS代码，如图所示。

这段AS是写在影片上的，不是写在帧上的，这点要注意，代码中出现的数字就是影片跟随鼠标的限定范围，53是离FLASH左边边距53像素，750是离FLASH左边边距为750像素，338是离FLASH上边边距388像素，如何获得这个数值在《Flash制作模板鼠标跟随中的隐秘功能》文中有详细说明。
4、选第一个按钮，F9打开动作面板写入按钮AS，如图所示

看上图AS的意思是：当鼠标滑过按钮时，场景中的实例名为info的影片就从标签l1o这个位置开始播放info影片，鼠标离时就再从l1c这个位置播放。这也是为什么刚刚在制作影片时，要单建AS图层，要在AS图层中添加帧标签，这在FLASH中是常用的。第二个按钮上的AS如图所示。

上图的AS与第一个按钮的大部分一样的唯一的区别是在gotoAndPlay()括号中的帧标签变了，请看影片制作第6步中的第二个图，那里修改的帧标签为l2o和l2c。
在文中有些地方可能说得不太清楚，我将提供源文件供参考：右击下载源文件

结合自身设计的特点，挖掘出更多的小功能、小制作... ...
>>附加小提示
空间教程推荐流程：
推荐到邮箱：itquan@qq.com
邮件主题：[空间攻略]******（*为日志标题）
文章标题：
文章链接：
文章作者：
内容摘要：简单介绍推荐文章所表达的中心内容
>>相关链接
IT游戏圈Q吧：http://itbar520.qbar.qq.com
IT游戏圈空间：http://992126567.qzone.qq.com
游戏博客专区：http://blog.qq.com/game