[项目分享]Mind+实现魔卡切换

7838浏览
查看: 7838|回复: 4

[项目分享] Mind+实现魔卡切换

[复制链接]
本帖最后由 云天 于 2020-8-24 21:56 编辑

Mind+实现魔卡切换图1

【项目背景】


此项目是“居家元气满满”的子项目。角色可通过“元气量”购买“魔卡”,并使用“魔卡”实现自己的小愿望。在“购买”之前,可通过切换按钮,浏览“魔卡”功能及要消耗的元气量。
【步骤一】制作“魔卡”
本人使用“网页三剑客”之一图像处理软件“Fireworks”来制作“卡片”。
“Fireworks”是我处理图片的常用工具,很好用。


Fireworks是Macromedia公司发布的一款专为网络图形设计的图形编辑软件,它大大简化了网络图形设计的工作难度,无论是专业设计家还是业余爱好者,使用Fireworks都不仅可以轻松地制作出十分动感的GIF动画,还可以轻易地完成大图切割、动态按钮、动态翻转图等,因此,对于辅助网页编辑来说,Fireworks将是最大的功臣。借助于Macromedia Fireworks 8,您可以在直观、可定制的环境中创建和优化用于网页的图像并进行精确控制。Fireworks 业界领先的优化工具可帮助您在最佳图像品质和最小压缩大小之间达到平衡。它与 Macromedia Dreamweaver和 Macromedia Flash共同构成的集成工作流程可以让您创建并优化图像。

Mind+实现魔卡切换图2

制作好的“魔卡”
Mind+实现魔卡切换图3

使用“Fireworks”进行图片处理。
Mind+实现魔卡切换图5Mind+实现魔卡切换图6Mind+实现魔卡切换图7Mind+实现魔卡切换图4

用到的相关图片素材。
【步骤二】查找GIF特效
在Mind+中使用的GIF特效,gif动图需要背景是透明的。
我们可以通过百度图片搜索“光效透明 gif”。
Mind+实现魔卡切换图8

查找到的图片右下角有“动图”字样。
Mind+实现魔卡切换图9

我们需要的是背景为白色的动图。
Mind+实现魔卡切换图10

用“Firewords”打开,可看到背景为透明。
Mind+实现魔卡切换图11

导入Mind+,背景是透明的。


【步骤三】Mind+编程


Mind+实现魔卡切换图12


Mind+实现魔卡切换图13


“魔卡”通过接收到对应的消息,来让自己移到最前面。
Mind+实现魔卡切换图14


Mind+实现魔卡切换图15



Mind+实现魔卡切换图16

左右切换按钮,可切换“魔卡”,播放音乐特效,光效,显示对应“消耗元气量”。

Mind+实现魔卡切换图18

“魔卡”切换物资代码。
Mind+实现魔卡切换图19

购买、使用“魔卡 ”代码
Mind+实现魔卡切换图17



“使用”按钮特效代码。


hnyzcj  版主

发表于 2020-8-25 09:04:58

吼吼,练卡的
回复

使用道具 举报

云天  初级技神
 楼主|

发表于 2020-8-25 11:12:12


想展示Mind+的强大功能
回复

使用道具 举报

云天  初级技神
 楼主|

发表于 2020-8-25 11:17:53

建议Mind+,角色的造型中增加“透明度”设置。
回复

使用道具 举报

hnyzcj  版主

发表于 2020-8-25 11:23:56

云天 发表于 2020-8-25 11:12
想展示Mind+的强大功能

丢丢
回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

为本项目制作心愿单
购买心愿单
心愿单 编辑
[[wsData.name]]

硬件清单

  • [[d.name]]
btnicon
我也要做!
点击进入购买页面
上海智位机器人股份有限公司 沪ICP备09038501号-4

© 2013-2024 Comsenz Inc. Powered by Discuz! X3.4 Licensed

mail