字节小程序开发平台制造的小游戏可以导出吗?

核心提示可以。字节跳动小游戏是一种开放能力。允许用户基于给定的 API 编写游戏代码,最终生成可运行在接入小游戏功能的各产品 APP 上。小游戏的运行环境不同于 Web 环境,在真机上运行时,没有BOM API,因此也就没有 window 对象以及

可以。

字节跳动小游戏是一种开放能力。允许用户基于给定的 API 编写游戏代码,最终生成可运行在接入小游戏功能的各产品 APP 上。

小游戏的运行环境不同于 Web 环境,在真机上运行时,没有BOM API,因此也就没有 window 对象以及其上面的各种属性。所以,从 H5 迁移过来的游戏,开发者需要自己实现 window 对象的兼容(如果是利用游戏引擎开发的小游戏,导出的小游戏版本一般已经包含了一份 adapter,适配了 window 对象)。同时,在小游戏的运行环境中,提供了全局对象 GameGlobal,所有全局定义的变量都是 GameGlobal 的属性。

用flash制作。

一、制作背景

1.进入Flash MX 界面,选取菜单栏中的“File”(文件)/“import”(导入)命令(或按“Ctrl+R”),插入一幅背景。在属性面板中将的“W”值设置为:550,“H”值设置为400,“X”和“Y”坐标值都设置为0,即背景正好覆盖默认的工作区。

2.选取菜单栏中的“Insert”(插入)/New Symbol”(新建组件)命令(或按 “Ctrl+F8”),在弹出的“Create New Symbol”(新建组件)对话框中,将“Name”改为:文字,然后点选“Graphic”选项,新建一文字组件。

3.单击绘图工具栏中的“文字”按钮,然后在工作区中单击鼠标,当出现闪烁的输入符号时,利用全拼或五笔输入法,输入“枪打出头鸟”五个字。选取菜单栏中的“Modify”(修改)/“Break Apart”(分解组件)命令(或按 “Ctrl+B”),将刚才输入的文字分解分别设置字体。单击绘图工具栏中的 “箭头”按钮,将分解后的文字调整至如上图中所示的形态。

4.在Scene 1(场景1)的编辑状态中,新建一图层“Layer 2”层。选取菜单栏中的“Window(窗口)/Library”(图库)命令,调出库面板。将库面板中的“文字”组件拖曳至工作区的左上角位置。在属性面板的“Color”(颜色)选项右侧的窗口中选择“Alpha”(透明度)选项,并将右侧窗口中的数值设置为:70。

二、制作主要元素:枪及小鸟

1.按 “Ctrl+F8”,在弹出的“Create New Symbol”对话框中,将“Name”改为:“鸟”,并点选“Movie Clip”选项,新建一影片剪辑组件。

2.按 “Ctrl+R”键,在弹出的“import”对话框中,选择一个小鸟飞翔的Gif小动画,将其导入到当前的文件中。

注意:导入的小鸟飞翔Gif小动画,小鸟在飞翔过程中每一幅不能有背景。

下面我们再来制作小鸟被枪击中后的形态。

3.按“Ctrl+F8”,在弹出的“Create New Symbol”对话框中,将“Name”改为:击中鸟,并点选”Graphic”选项,新建一图形组件。

4.在库面板中将“鸟”影片剪辑中第1帧的鸟拖曳至工作区的中心位置。选取菜单栏中的“Modify(修改)/Trans-form(转换)/Flip Vertical”(垂直翻转)命令,将鸟垂直翻转。

5.按 “Ctrl+F8”,在弹出的“Create New Symbol”对话框中,将“Name”改为:击中,并点选“Movie Clip”选项,新建一影片剪辑组件。

6.在库面板中,将“鸟”影片剪辑组件拖曳至工作区的中心位置。新建一图层“Layer 2”层,在库面板中将“击中鸟”图形组件拖曳至工作区的中心位置。

7.在图层控制区中,单击“Layer 2”层的第1帧,当鼠标变为符号时,按下鼠标向右拖曳,其形态如图2所示,至第2 帧位置处释放鼠标,将“Layer 2”层的第1帧调整至第2 帧位置处。

调整帧时的形态 调整图层时的形态

图2

图3

8.将鼠标移动到“Layer 2”层的名称处,按下鼠标向下拖曳,当“Layer 1”层的周围出现灰色边框时,如图3所示,释放鼠标,将“Layer 2”层调整至“Layer 1”层的下方。

9.单击图层控制区中的“新建引导层”按钮,新建一引导层。选择“引导层”的第2帧,选取菜单栏中的“Insert(插入)/Keyframe”(关键帧)命令(或按键盘上的“F6”),插入一关键帧。

单击绘图工具栏中的按钮,在其下的选项栏中选择平滑选项。

10.将鼠标移动到工作区中“击中鸟”组件的中心位置绘制出如图4所示的路径。

图4

11.选择“引导层”的第10帧,选取菜单栏中的“Insert(插入)/frame”(帧)命令(或按键盘中的“F5”);选择“Layer 2”层的第10帧,按 “F6”,插入关键帧。在工作区中,将“击中鸟”组件调整至图5所示的位置。

图5

在制作引导层动画时,“贴紧对象”按钮必须处于激活状态。这样,拖动运动物体到运动路径的起点和终点位置时,才能使运动物体主动吸附在路径上,从而顺利的完成物体沿路径运动。

注意:“击中鸟”组件的中心一定要吸附在路径的起点和终点上。

12.在工作区中选择“Layer 2”层第10帧的“击中鸟”组件,选取菜单栏中的“Modify/Transform/Flip Vertical”命令,将“击中鸟”垂直翻转。

13.选择“Layer 2”层第2帧,并在其上单击鼠标右键,在弹出的右键菜单中选择“Create Motion Tween”选项,创建引导层动画。

14.按“Ctrl+F8”,在弹出的“Create New Symbol”对话框中,将“Name”改为:dan,并点选“Graphic”选项,新建一图形组件。

15.单击绘图工具栏中的“文字”按钮,在文本属性面板中,将“字体”设置为:“文鼎CS大隶书”,“字号”设置为:6,“字体颜色”设置为:红色。单击按钮,在弹出的选项中选择“Vertical, Left to Right”(垂直自左向右)选项。

16.将鼠标移动到工作区中单击,输入“枪打出头鸟”五个字。连续按两次“Ctrl+F8”,将输入的文字彻底分解。选取菜单栏中的“Modify/Transform/Distort”(扭曲)命令,将扭曲后的文字调整到你想要的形态。

17.按“Ctrl+F8”,在弹出的“Create New Symbol”对话框中,将“Name”改为:弹,并点选“Movie Clip”选项,新建一影片剪辑组件。

18.在库面板中将“dan”图形组件拖曳至工作区的中心位置。选择“Layer 1”层的第10帧,按键盘上的“F6”,插入关键帧,在工作区中选择“dan”组件,将其“Y”坐标值改为:-400。

19.选择“Layer 1”层的第1帧,单击鼠标右键,在弹出的右键菜单中选择“Create Motion Tween”选项,创建动画。

20.按“Ctrl+F8”,在弹出的“Create New Symbol”对话框中,将“Name”改为:枪,并点选“Movie Clip”选项,新建一影片剪辑组件。

21.在库面板中将“弹”组件拖曳至工作区的中心位置,在属性面板中将其命名为:dan。

22.新建一图层“Layer 2”层,按“Ctrl+R”,导入一幅枪的,(注意,导入的枪也不能有背景)。

三、整合游戏

1.在场景的编辑中,新建一图层“Layer 3”层。

2.在库面板中将“枪”影片剪辑组件拖曳至工作区的下方位置,并在属性面板中,将其命名为:qiang。

3.新建一图层“Layer 4”层,在库面板中将“击中”影片剪辑组件拖曳至工作区的上方位置,并在属性面板中,将其命名为:niao。

4.在库面板中,编辑“弹”影片剪辑组件。选择“Layer 1”层的第1帧,单击鼠标右键,在弹出的右键菜单中选择“Actions”(动作)选项,调出“Actions”面板,在弹出的“Actions-frame”面板中,依次单击左侧窗口中的“Actions/Movie Control”选项,然后双击其下的“go to”命令,在右侧的窗口中点选“Go to and Shop”(转到并停止)命令,如图6所示。

图6

5.编辑“击中”影片剪辑组件中,选择“Layer 1”层的第1帧,在“Actions-frame”面板中,双击左侧窗口中的“Actions/Movie Control/Stop”(停止)命令;选择“Layer 2”层的第10帧,在“Actions-frame”面板中,双击左侧窗口中的“Actions/Movie Control/go to”命令;然后双击左侧窗口中的“Actions/Movie Clip Control/Set Property”命令;在右侧窗口“Property”选项的下拉菜单中选择“_x(X position)”选项,在“Target”选项右侧的窗口中输入“_root.niao”,在“Value”选项右侧的窗口中输入“50+random(450)”,并勾选其右侧的“expression”选项,如图7所示。

图7

6.切换到场景的编辑状态,在工作区中选择“枪”组件,此时的“Actions-frame”面板即显示为“Actions-Movie Clip”面板。在“Actions-Movie Clip”面板左侧的窗口中双击“Actions/Miscellaneous Actions/evaluate”命令,在“expression”选项右侧的窗口中输入“_root.qiang.StartDrag(1,20,360,530,360)”;在左边窗口中再双击“evaluate”命令,在“expression”选项右侧的窗口中输入“_root.qiang.dan.Stop()”;在右边框中选择最后一个大括号,在左边的窗口中双击“Actions/Movie Clip Control/Duplicate Movie Clip”命令,在右侧的“Target”选项窗口中输入“_root.qiang.dan”,在“New Name”选项窗口输入“mm”,在“Depth”选项窗口中输入“1”;在右侧的窗口中选择“on Clip Event(load)”选项,在上面的“Event”选项窗口中点选“Mouse down”选项。完整的动作语句如图8所示。

图8

7.在工作区中选择“击中”影片剪辑组件,在“Actions-Movie Clip”面板左侧的窗口中双击“Actions/Conditions/loops/if”命令,在“Condition”选项右侧的窗口中输入“_root.qiang. mm.hitTest(_root.niao)”;在右侧的窗口中选择“on Clip Event(load)”选项,在上面的“Event”选项窗口中点选“Enter frame”选项;在左边窗口中双击“Actions/Movie Clip Control/Set Property”命令,在右侧窗口“Property”选项的下拉菜单中选择“_visible(Visibility)”选项,在“Target”选项右侧的窗口中输入“_root.qiang.mm”,在“Value”选项右侧的窗口中输入“0”,并勾选其右侧的“expression”选项;在左边的窗口中双击“Actions/Miscellaneous Actions/evaluate”命令,在右侧“expression”选项的窗口中输入“_root.niao.play()”;双击“Actions/Conditions/loops/else”命令;然后双击“if”命令,在右侧的“Condition”选项窗口中输入“_root. _currentframe==6”;双击“Set Property”命令,在右侧窗口“Property”选项的下拉菜单中选择“_x(X Position)”选项,在“Target”选项右侧的窗口中输入“_root.niao”,在“Value”选项右侧的窗口中输入“random(450)+50”,并勾选其右侧的“expression”选项。完整的动作语句如图9所示。

图9

8.在时间线控制栏中将“Layer 1”至“Layer 4”层的第6帧同时选择,按键盘上的“F5”,插入静止帧。

四、制作成绩单及Actions命令的修改

1.新建一图层“Layer 5”层。单击绘图工具栏中的“矩形”按钮,然后在颜色工具栏中,单击按钮,在属性面板中,单击线形选项窗口右侧的按钮,在弹出的列表中选择如图10所示的线形。

图10

图11

2.在工作区的右下角绘制一“W”值为70,“H”值为45的矩形。

3.新建一图层“Layer 6”层,单击绘图工具栏中的“文字”按钮,在文本属性面板中,将“字体”设置为:“文鼎特粗宋简”,“字号”设置为:16,“字体颜色”设置为:红色。单击按钮,在弹出的下拉列表中选择“Horizontal”(水平)选项,然后在刚才绘制的矩形上方单击鼠标,依次输入“发射”和“击中”两组文字。在文本属性面板中的“文本类型”选项窗口中选择“Dynamic text”(动态文本)选项,并单击其右侧的“居中对齐”按钮。在工作区中的“发射”和“击中”文字右侧分别拖曳出一个动态文本框,并在属性面板的“Var”选项窗口中分别输入“fashe”和“jizhong”,文字及文本框在工作区中的形态如图11所示。

4.在工作区中选择“枪”组件,并在其上单击右键,在弹出的右键菜单中选择“Actions”选项,调出“Actions-Movie Clip”面板。在“Actions-Movie Clip”面板右侧的窗口中选择最后一行语句,双击左边窗口中的“Actions/Miscellaneous Actions/evaluate”命令,在右侧“expression”选项的窗口中输入“_root.fashe++”;在左边窗口中双击“if”命令,在右侧的“Condition”选项窗口中输入“_root.fashe>10”;双击“Actions/Variables/Set Variable”命令,在右侧的“Variable”选项窗口中输入“_root.fashe”,在“Value”选项窗口中输入“1”,并勾选其右侧的“expression”选项。

再次双击“Set Variable”命令,在右侧的“Variable”选项窗口中输入“_root.jizhong”,在“Value”选项窗口中输入“0”,并勾选其右侧的“expression”选项。

5.在工作区中选择“击中”组件。在“Actions-Movie Clip”面板右侧的窗口中选择“_root.niao.play()”语句,然后在左边的窗口中双击“evaluate”命令,在右侧的“expression”选项窗口中输入“_root.jizhong++”。

五、添加音乐

1.按“Ctrl+R”,导入一个合适的音乐文件。

2.新建一图层“Layer 7”层。选择“Layer 7”层的第1帧,在库面板中将导入的音乐组件拖曳至工作区中,完成音乐的添加。

3.选择“Layer 1”层的第1帧,并在其上单击右键,在弹出的右键菜单中,选择“Actions”选项。

在弹出的“Actions-frame”面板中,双击左侧窗口中的“Actions/Browser/neTwork/fscommand”命令,在右侧的“Commands for standalone Player”下拉选项菜单中选择“Full screen[True/False]”选项,如图12所示。

图12

4.设置全屏幕播放语句

选取菜单栏中的“Control(控制)/Test Movie”(测试影片)命令(或按“Ctrl+Enter”),打开播放器窗口,即可测试制作的小游戏了。

 
友情链接
鄂ICP备19019357号-22