问题答疑

问题答疑

提出您在创作作品时遇到的问题和疑惑
BUG反馈

BUG反馈

反馈您在使用Mugeda时遇到的BUG
原创分享

原创分享

分享您的原创作品,创作经验,操作技巧
新功能需求

新功能需求

写下您期待Mugeda增加的新功能
Mugeda培训

Mugeda培训

加入我们的培训,提高您的技巧

2.4.2 行为:帧的行为

mingyueliu 发表了文章 • 0 个评论 • 675 次浏览 • 2016-09-26 15:29 • 来自相关话题

想要了解更多Mugeda功能?>>>猛戳我,学习更多教程
 
本节视频教程请点击此处。

 帧的行为有“播放”“暂停”“下一帧”“上一帧”“跳转并播放”“跳转并停止”

本案例在讲解帧的各种行为之前,已做好一些基础铺垫:

1)新建好图层0、图层1、图层2;
2)如图,在图层0第1 查看全部
想要了解更多Mugeda功能?>>>猛戳我,学习更多教程
 
本节视频教程请点击此处。

 帧的行为有“播放”“暂停”“下一帧”“上一帧”“跳转并播放”“跳转并停止”

本案例在讲解帧的各种行为之前,已做好一些基础铺垫:

1)新建好图层0、图层1、图层2;
2)如图,在图层0第1帧时,在“舞台”上添加“第一帧”文字元素;

2.4-9_.png

图2.4-9

3)同理,在图层0的第2帧放置“第二帧”文字元素,第3帧放置“第三帧”文字元素,第4帧放置“第四帧”文字元素;

2.4-10_.png

图2.4-10

2.4-11_.png

图2.4-11

2.4-12_.png

图2.4-12

4)在图层0第5至第18帧的位置,制作了一个矩形在舞台上由左向右移动的关键帧动画。

2.4-13_.png

图2.4-13

5)在图层1上添加一个矩形,设置其编辑行为为“暂停”,触发条件为“出现”,并在第1至5帧都有该“暂停”行为。

2.4-14_.png

图2.4-14

现在,我们以该案例来解释帧的行为。

1.播放
如图,点击回到时间轴上的第1帧,点击舞台上“播放”按钮元素的“添加/编辑行为”按钮,为其添加编辑行为

2.4-15_.png

图2.4-15

在弹出的“编辑行为”对话框中选择:“动画播放控制”→“播放”→触发条件:点击。即设置好点击即播放的行为。

2.4-16_.png

图2.4-16

2.暂停

同理,点击“暂停”按钮元素的“添加/编辑行为”按钮,在弹出的“编辑行为”对话框中选择:“动画播放控制”→“暂停”→触发条件:点击。即设置好点击即暂停的行为。

2.4-17_.png

图2.4-17

2.4-18_.png

图2.4-18

3.跳转至下一帧

同理,为“舞台”上的“下一帧”按钮元素添加编辑行为:“动画播放控制”→“下一帧”→触发条件:点击。即设置好点击即跳转下一帧的行为。

2.4-19_.png

图2.4-19

2.4-20_.png

图2.4-20

4.跳转至上一帧

同理,为“舞台”上的“上一帧”按钮元素添加编辑行为:“动画播放控制”→“上一帧”→触发条件:点击。即设置好点击即跳转上一帧的行为。

2.4-21_.png

图2.4-21

2.4-22_.png

图2.4-22

5.跳转并播放

同理,为“舞台”上的“跳转并播放”按钮元素添加编辑行为:“动画播放控制”→“跳转到帧并播放”→触发条件:点击。点击“编辑”按钮,进入“参数”对话框

2.4-23_.png

图2.4-23

2.4-24_.png

图2.4-24

在“参数”对话框内填写“帧号”为“6”,点击“确认”。即设置了点击“舞台”上的“跳转并播放”按钮,即可跳转到第6帧并播放动画

2.4-25_.png

图2.4-25

6.跳转并停止

同理,为“舞台”上的“跳转并停止”按钮元素添加编辑行为:“动画播放控制”→“跳转到帧并停止”→触发条件:点击。点击“编辑”按钮,进入“参数”对话框

2.4-26_.png

图2.4-26

2.4-27_.png

图2.4-27

在“参数”对话框内填写“帧号”为“6”,点击“确认”。即设置了点击“舞台”上的“跳转并停止”按钮,即可跳转到第6帧并停止动画

2.4-28_.png

图2.4-28

点击“预览”效果

2.4-29_.png

图2.4-29

我们还可通过关键帧命名的形式添加设置帧的行为。如图,点击选中时间轴上的第4帧,在“关键帧名”输入框内输入关键帧名为“第四帧”

2.4-30_.png

图2.4-30

点击“跳转并停止”按钮元素的“添加/编辑行为”按钮

2.4-31_.png

图2.4-31

在“编辑行为”对话框内点击“编辑”按钮,进入“参数”对话框内,改变参数属性:删除帧号“6”,选择“帧名称”为“第四帧”,点击“确认”。

2.4-32_.png

图2.4-32

2.4-33_.png

图2.4-33

点击“预览”,发现当点击“跳转并停止”按钮时,动画跳转至第4帧并停止。

2.4-34_.png

图2.4-34
 

2.4.1 行为:行为添加以及触发事件

mingyueliu 发表了文章 • 4 个评论 • 775 次浏览 • 2016-09-26 15:16 • 来自相关话题

想要了解更多Mugeda功能?>>>猛戳我,学习更多教程
 
本节视频教程请点击此处。

 1. 行为

如图,点击物体右边的“添加/编辑行为”按钮,弹出“编辑行为”对话框。





图2.4-1

行为包括“动画播放控制”“媒体播放控制”“属性控制”“微信定制”“手机功能”五 查看全部
想要了解更多Mugeda功能?>>>猛戳我,学习更多教程
 
本节视频教程请点击此处。

 1. 行为

如图,点击物体右边的“添加/编辑行为”按钮,弹出“编辑行为”对话框。

2.4-1_.png

图2.4-1

行为包括“动画播放控制”“媒体播放控制”“属性控制”“微信定制”“手机功能”五大部分。

2.4-2_.png

图2.4-2

其中,“动画播放控制”包括“暂停”“播放”“下一帧”“上一帧”等行为功能

2.4-3_.png

图2.4-3

“媒体播放控制”包括“播放声音”“停止所有声音”“控制声音”“播放视频”等行为功能。

2.4-4_.png

图2.4-4

“属性控制”包括“改变元素属性”“设置定时器”“跳转链接”“提交表单”等行为功能。

2.4-5_.png

图2.4-5

“微信定制”包括“定制图片”“录制声音”“显示微信头像”“显示微信昵称”“定义分享信息”等行为功能。

2.4-6_.png

图2.4-6

“手机功能”包括“打电话”“发短信”“发送邮件”“日历事件”“地图”等行为功能。

2.4-7_.png

图2.4-7

2. 触发条件

如下图,选中左边任意行为例如“播放”行为,在右边“触发条件”下拉菜单中有“点击”“出现”“手指按下”“手指抬起”等多种触发行为的条件选项。通过选择不同的“触发条件”组合不同的行为可以形成无数种逻辑表达。

2.4-8_.png

图2.4-8

8月27—9月2日 技术问题汇总

819810364panbei 回复了问题 • 3 人关注 • 1 个回复 • 877 次浏览 • 2016-09-22 16:28 • 来自相关话题

2.3.11 动画:动画运动

mingyueliu 发表了文章 • 0 个评论 • 732 次浏览 • 2016-09-21 15:34 • 来自相关话题

想要了解更多Mugeda功能?>>>猛戳我,学习更多教程
 
本节视频教程请点击此处。

 关键帧动画默认是匀速运动,Mugeda可以设定不同的运动模式,比如淡入、淡出、阻尼进入、阻尼退出等。

如下图,添加一个火箭图像元素,在图层时间轴上设置好由下往上运动的关键帧动画效果


查看全部
想要了解更多Mugeda功能?>>>猛戳我,学习更多教程
 
本节视频教程请点击此处。

 关键帧动画默认是匀速运动,Mugeda可以设定不同的运动模式,比如淡入、淡出、阻尼进入、阻尼退出等。

如下图,添加一个火箭图像元素,在图层时间轴上设置好由下往上运动的关键帧动画效果

2.3-96_.png

图2.3-96

选中起始帧位置,在火箭元素的“属性面板”中设置其“运动”效果为“震荡进入退出”,点击“播放”预览效果

2.3-97_.png

图2.3-97
2.3-97_.png


也可将“运动”效果设为“阻尼进入退出”,点击预览观察效果

2.3-98_.png

图2.3-98

动画运动还可应用在曲线变形动画上,如图,在曲线变形动画的起始帧位置,改变“运动”效果为“碰撞进入退出”,点击预览观察效果

2.3-99_.png

图2.3-99
2.3-100_.png

图2.3-100
 

2.3.10 动画:遮罩

mingyueliu 发表了文章 • 0 个评论 • 938 次浏览 • 2016-09-21 15:28 • 来自相关话题

想要了解更多Mugeda功能?>>>猛戳我,学习更多教程
 
本节视频教程请点击此处。

 遮罩动画可实现很多特殊效果,需要至少两个图层,上面是“遮罩层”,下面是“被遮罩层”。遮罩层为显示区域,被遮罩层为显示的内容。
如下图,在图层0的第1帧添加一个按钮元素





图2.3- 查看全部
想要了解更多Mugeda功能?>>>猛戳我,学习更多教程
 
本节视频教程请点击此处。

 遮罩动画可实现很多特殊效果,需要至少两个图层,上面是“遮罩层”,下面是“被遮罩层”。遮罩层为显示区域,被遮罩层为显示的内容。
如下图,在图层0的第1帧添加一个按钮元素

2.3-82_.png

图2.3-82

点击“新建图层”按钮新添加图层1、图层2

2.3-83_.png

图2.3-83

鼠标点击图层0第1帧,按住Ctrl+C复制该帧上的物体,点击选中图层2第1帧,按住Ctrl+V粘贴进物体

2.3-84_.png


图2.3-84
点击选中图层1的第1帧,在“舞台”上绘制一个白色矩形

2.3-85_.png


图2.3-85
调整白色矩形的透明度为40%

2.3-86_.png


图2.3-86
选择“变形”工具调整其角度,使其右倾一些

2.3-87_.png


图2.3-87

将图层2重命名为“遮罩层”,图层1为“被遮罩层”

2.3-88_.png


图2.3-88
选中“遮罩层”图层,点击“转为遮罩层”按钮

2.3-89_.png


图2.3-89
点击图层0的“关闭可视图层”按钮,关闭图层0上物体的可视化

2.3-90_.png


图2.3-90
如图,在“被遮罩层”内设置一个关键帧动画,即右键→“插入帧”,右键→“插入关键帧动画”

2.3-91_.png


图2.3-91
鼠标选中最后一个关键帧,将“舞台”上的白色半透明矩形移至右侧

2.3-92_.png


图2.3-92
点击图层0的“关闭可视图层”还原图层0物体的可视化,在图层0上选中与“被遮罩层”最后关键帧相同的帧数,右键→“插入帧”补全图层0的帧数。

2.3-93_.png


图2.3-93
同理补全“遮罩层”的帧数

2.3-94_.png


图2.3-94

点击“播放”预览走光动画效果

2.3-95_.png


图2.3-95

2.3.9 动画:分页/加载页

mingyueliu 发表了文章 • 0 个评论 • 832 次浏览 • 2016-09-21 15:23 • 来自相关话题

想要了解更多Mugeda功能?>>>猛戳我,学习更多教程
 
本节视频教程请点击此处。

 如下图,在右侧“加载”页面,选择“加载样式”为“进度条”,在其下拉菜单内可自行设置加载属性。例如填写“提示文字”、设置文字大小、颜色,添加背景图片、前景图片等





图2.3-67

查看全部
想要了解更多Mugeda功能?>>>猛戳我,学习更多教程
 
本节视频教程请点击此处。

 如下图,在右侧“加载”页面,选择“加载样式”为“进度条”,在其下拉菜单内可自行设置加载属性。例如填写“提示文字”、设置文字大小、颜色,添加背景图片、前景图片等

2.3-67_.png

图2.3-67

点击“预览”观察效果

2.3-68_.png

图2.3-68

如图,将样式改为“进度环”,其他属性设置不变

2.3-69_.png

图2.3-69

点击“预览”观察效果

2.3-70_.png

图2.3-70

将样式改为“旋转加载”,可观察到加载效果如下:

2.3-71_.png

图2.3-71

将样式改为“旋转加载+百分比”,可观察到加载效果如下

2.3-72_.png

图2.3-72

将样式改为“首页作为加载页面”可完成更个性化的加载形式定制。

如下图,在首页添加一个火箭图片素材,调整大小与位置。鼠标选中该素材右键→“转换为元件”

2.3-73_.png

图2.3-73

双击该元件进入元件编辑页面。在时间轴20帧的位置右键→“插入帧”,右键→“插入关键帧动画”

2.3-74_.png

图2.3-74

在20帧的位置右键→“插入关键帧”

2.3-75_.png

图2.3-75

鼠标选中第10帧关键帧位置,将火箭图片向上拖动一些位置,制作出火箭上下移动的动画效果

2.3-76_.png

图2.3-76

点击回到“舞台”,新建一个图层1,选中图层1的第一帧,点击“矩形”工具在“舞台”上拉出一个长条矩形作为进度条,可适当调整矩形颜色大小等。

2.3-77_.png

图2.3-77

同时选中图层0、图层1的第30帧,鼠标右键→“插入帧”

2.3-78_.png

图2.3-78

选中图层1的有帧位置,右键→“关键帧动画”

2.3-79_.png

图2.3-79

选中图层1的起始关键帧,点击矩形元素,在其“属性面板”内将其“宽”值设为“1”

2.3-80_.png

图2.3-80

添加一个新页面,点击预览动画效果,发现长条矩形出现横向拉长,即加载的动画效果,动画播放完后自动跳至第2页。

2.3-81_.png

图2.3-81

2.3.8 动画:元件动画

mingyueliu 发表了文章 • 2 个评论 • 1096 次浏览 • 2016-09-21 14:54 • 来自相关话题

想要了解更多Mugeda功能?>>>猛戳我,学习更多教程
 
本节视频教程请点击此处。

 元件动画可以实现复杂的动画效果,每一个元件都是一个独立的完整动画,元件在“舞台”上运动的同时,元件内部的动画也可以同时播放,元件可以重复使用。

如图,点击“素材库”,在“舞台”上添加一个车 查看全部
想要了解更多Mugeda功能?>>>猛戳我,学习更多教程
 
本节视频教程请点击此处。

 元件动画可以实现复杂的动画效果,每一个元件都是一个独立的完整动画,元件在“舞台”上运动的同时,元件内部的动画也可以同时播放,元件可以重复使用。

如图,点击“素材库”,在“舞台”上添加一个车轮的图片素材

2.3-48_.png

图2.3-48

选中车轮素材,右键→“转换为元件”,即将车轮元素属性转换为元件

2.3-49_.png

图2.3-49

双击“舞台”上的车轮,进入元件编辑页面

2.3-50_.png

图2.3-50

在时间轴50帧位置右键→“插入帧”

2.3-51_.png

图2.3-51

在任意有帧的位置右键→“插入关键帧动画”

2.3-52_.png

图2.3-52

点击选中最后有帧位置(此处为第50帧),在“属性面板”下调整元件属性“Z轴旋转角度”为“360”度

2.3-53_.png

图2.3-53

点击“播放”可观察车轮出现自转一周的动画效果

2.3-54_.png

图2.3-54

点击“舞台”回到“舞台”编辑页面

2.3-55_.png

图2.3-55

点击“预览”发现元件动画可重复不断地播放

2.3-56_.png

图2.3-56

元件也可重复使用。例如在“元件面板”下找到车轮元件,鼠标可将其选中并拖拉至“舞台”

2.3-57_.png

图2.3-57
2.3-58_.png

图2.3-58

元件可配合舞台操作进行复杂的动画设置。如下图,在“素材库”中添加进一个汽车图片素材至“舞台”,选中汽车图片,右键→“排列”→“移至底层”

2.3-59_.png

图2.3-59

调整“舞台”上原本的两个车轮元件位置、大小,使其对齐覆盖汽车图片上的两个车轮

2.3-60_.png

图2.3-60

点击“预览”,出现汽车轮胎转动的动画效果

2.3-61_.png

图2.3-61

在“舞台”的40帧位置,右键→“插入帧”

2.3-62_.png

图2.3-62

在有帧的位置右键→“插入关键帧动画”

2.3-63_.png

图2.3-63

选中关键帧动画的起始帧(此处为第1帧),将汽车移至屏幕左侧。

2.3-64_.png

图2.3-64

选中关键帧动画的最后帧(此处为第40帧),将汽车移至屏幕右侧。

2.3-65_.png

图2.3-65

点击“预览”,观察汽车从屏幕左侧开至右侧的动画效果

2.3-66_.png

图2.3-66
 

2.3.7 动画:预置动画

mingyueliu 发表了文章 • 0 个评论 • 712 次浏览 • 2016-09-21 14:45 • 来自相关话题

想要了解更多Mugeda功能?>>>猛戳我,学习更多教程
 
本节视频教程请点击此处。

 预置动画可实现一秒钟制作动画,分为进入动画、强调动画以及退出动画。

1.    添加进入动画

如下图,给文字素材添加进入动画。点击文字素材右边的“添加预置动画”按钮





图2.3 查看全部
想要了解更多Mugeda功能?>>>猛戳我,学习更多教程
 
本节视频教程请点击此处。

 预置动画可实现一秒钟制作动画,分为进入动画、强调动画以及退出动画。

1.    添加进入动画

如下图,给文字素材添加进入动画。点击文字素材右边的“添加预置动画”按钮

2.3-43_.png

图2.3-43

在弹出的对话框内选择进入动画效果为“弹入”,同理将其他两个文字素材添加“弹入”的进入动画效果。可点击预览效果

2.3-44_.png

图2.3-44

2.    强调动画

点击“强调动画”文字素材右边的“添加预置动画”按钮,

2.3-45_.png

图2.3-45

在弹出的对话框中选择强调动画效果为“晃动”,可点击预览效果。

2.3-46_.png

图2.3-46

3.    退出动画

同理点击“退出动画”文字素材右边的“添加预置动画”按钮,在弹出的对话框中选择推出动画效果为“蹦出”,可点击预览效果。

2.3-47_.png

图2.3-47

2.3.6 动画:变形动画

mingyueliu 发表了文章 • 0 个评论 • 720 次浏览 • 2016-09-21 14:41 • 来自相关话题

想要了解更多Mugeda功能?>>>猛戳我,学习更多教程
 
本节视频教程请点击此处。

 曲线变形动画可以实现一个形状变成另一个形状的动画效果。

如下图,选中新图层0的第1帧,鼠标点击“矩形”工具在“舞台”上绘制一个矩形。





图2.3-35

在时间轴20帧的位置,右 查看全部
想要了解更多Mugeda功能?>>>猛戳我,学习更多教程
 
本节视频教程请点击此处。

 曲线变形动画可以实现一个形状变成另一个形状的动画效果。

如下图,选中新图层0的第1帧,鼠标点击“矩形”工具在“舞台”上绘制一个矩形。

2.3-35_.png

图2.3-35

在时间轴20帧的位置,右键→“插入帧”

2.3-36_.png

图2.3-36

在时间轴有帧的位置,右键→“插入曲线变形动画”

2.3-37_.png

图2.3-37

选中最后一帧,鼠标点击“节点”工具

2.3-38_.png

图2.3-38

改变矩形形状为三角形

2.3-39_.png

图2.3-39

点击“播放”,观察矩形变成三角形的动画效果

2.3-40_.png

图2.3-40

同理,点击选中时间轴上的最后一帧,在“属性面板”下改变物体填充色为红色,点击“播放”观察动画效果,发现矩形变成三角形的同时,物体颜色也逐渐由紫色变成红色。

2.3-41_.png

图2.3-41
2.3-42_.png

图2.3-42
 

2.3.5 动画:进度动画

mingyueliu 发表了文章 • 4 个评论 • 921 次浏览 • 2016-09-21 14:38 • 来自相关话题

想要了解更多Mugeda功能?>>>猛戳我,学习更多教程
 
本节视频教程请点击此处。

 进度动画可实现绘制线条过程的效果和文字的打字机效果。

1.    制作图像进度动画

如下图,在图层0的第1帧位置,鼠标点击“圆角矩形”工具在“舞台”上绘制出一个圆角矩形。





查看全部
想要了解更多Mugeda功能?>>>猛戳我,学习更多教程
 
本节视频教程请点击此处。

 进度动画可实现绘制线条过程的效果和文字的打字机效果。

1.    制作图像进度动画

如下图,在图层0的第1帧位置,鼠标点击“圆角矩形”工具在“舞台”上绘制出一个圆角矩形。

2.3-25_.png

图2.3-25

在其“属性面板”下改变该矩形的填充色为“无色”、线条色为“黑色”

2.3-26_.png

图2.3-26

继续绘制出一个圆角矩形和一个圆形,形成手机外框样式。

2.3-27_.png

图2.3-27

在时间轴30帧位置右键→“插入帧”

2.3-28_.png

图2.3-28

在以插入帧的任意位置右键→“插入进度动画”,时间轴变成紫色

2.3-29_.png

图2.3-29

点击“预览”,发现此时动画变成逐渐绘制的效果。

2.3-30_.png

图2.3-30

2.    制作文字进度动画

如图,点击新建一个图层,点击“文字”工具,在“舞台”上创建一个文本框

2.3-31_.png

图2.3-31

点击编辑文字内容

2.3-32_.png

图2.3-32

在新建图层1上的有帧位置,右键→“插入进度动画”

2.3-33_.png

图2.3-33

点击“预览”,观察字体逐字出来的动画效果

2.3-34_.png

图2.3-34
 

2.3.4 动画:路径动画

mingyueliu 发表了文章 • 0 个评论 • 842 次浏览 • 2016-09-21 14:33 • 来自相关话题

想要了解更多Mugeda功能?>>>猛戳我,学习更多教程
 路径动画即物体沿着指定路径线运动的动画。

本节视频教程请点击此处。

在时间轴上右键→“插入帧”,右键→“插入关键帧动画”





图2.3-17

鼠标选中最后一个关键帧位置,将“舞台”上的火箭移至“舞台”上方,制 查看全部
想要了解更多Mugeda功能?>>>猛戳我,学习更多教程
 路径动画即物体沿着指定路径线运动的动画。

本节视频教程请点击此处。

在时间轴上右键→“插入帧”,右键→“插入关键帧动画”

2.3-17_.png

图2.3-17

鼠标选中最后一个关键帧位置,将“舞台”上的火箭移至“舞台”上方,制作出一个关键帧动画效果。

2.3-18_.png

图2.3-18

鼠标选中时间轴上任意绿色部分,右键→“切换路径显示”

2.3-19_.png

图2.3-19

即在“舞台”上显示出一条灰色的路径线

2.3-20_.png

图2.3-20

继续点击时间轴任意绿色部分,右键→“自定义路径”,发现路径变成紫色。

2.3-21_.png

图2.3-21

点击选择“节点”工具

2.3-22_.png

图2.3-22

通过节点控制杆调节动画运动路径

2.3-23_.png

图2.3-23

点击“播放”,发现火箭即沿着设定的运动路径运动。

2.3-24_.png

图2.3-24

2.3.3关键帧动画

mingyueliu 发表了文章 • 3 个评论 • 797 次浏览 • 2016-09-21 14:28 • 来自相关话题

关键帧动画是通过设定动画的起始和结束两个关键帧,然后通过软件自动生成动画过程的动画形式。
 
本节视频教程请点击此处。

选中图层0的第1个关键帧位置,点击“素材库”按钮添加一个图片素材至舞台,即将该图片素材添加进第1个关键帧位置。





图2.3-10

点击选中第30帧位置,右键→“插入帧 查看全部
关键帧动画是通过设定动画的起始和结束两个关键帧,然后通过软件自动生成动画过程的动画形式。
 
本节视频教程请点击此处。

选中图层0的第1个关键帧位置,点击“素材库”按钮添加一个图片素材至舞台,即将该图片素材添加进第1个关键帧位置。

2.3-10_.png

图2.3-10

点击选中第30帧位置,右键→“插入帧”

2.3-11_.png

图2.3-11

在已插入帧的位置右键→“插入关键帧动画”

2.3-12_.png

图2.3-12

鼠标点击选中结束帧(此处为第30帧)位置,将“舞台”上的物体移动至“舞台”上方

2.3-13_.png

图2.3-13

点击“播放”按钮,发现一个火箭向上移动的动画效果做出来了。

2.3-14_.png


图2.3-14

任何元素属性的变化过程都可通过关键帧动画实现。例如下图,鼠标点击选中结束帧(此处为第30帧)位置,在“属性面板”下改变此时物体的属性:设置透明度为0,改变物体大小与旋转角度。

2.3-15_.png


图2.3-15

可点击“播放”观察动画效果

2.3-16_.png


图2.3-16

简历小品一则~欢迎指点

1773391 发表了文章 • 2 个评论 • 205 次浏览 • 2016-09-21 14:23 • 来自相关话题

http://9bdee5fd.u.h5mc.com/cam ... .html

2.3.2 动画:选择工具

回复

mingyueliu 发起了问题 • 2 人关注 • 0 个回复 • 827 次浏览 • 2016-09-21 14:21 • 来自相关话题

2.3.1 动画:时间轴以及图层

mingyueliu 发表了文章 • 0 个评论 • 737 次浏览 • 2016-09-21 14:15 • 来自相关话题

想要了解更多Mugeda功能?>>>猛戳我,学习更多教程
 
本节视频教程请点击此处。

 时间轴是制作动画的关键功能,时间轴把图层和图像帧按时间进行组合、播放来形成动画。
在时间轴上,我们可以以拖拉的方式进行预览动画效果。





图2.3-1

也可点击“播放”按钮进行预览 查看全部
想要了解更多Mugeda功能?>>>猛戳我,学习更多教程
 
本节视频教程请点击此处。

 时间轴是制作动画的关键功能,时间轴把图层和图像帧按时间进行组合、播放来形成动画。
在时间轴上,我们可以以拖拉的方式进行预览动画效果。

2.3-1_.png

图2.3-1

也可点击“播放”按钮进行预览

2.3-2_.png

图2.3-2

循环播放:点击“动画”→“循环”,即在预览时动画效果会循环播放,再次点击“动画”→“循环”,即将循环播放功能取消。

2.3-3_.png

图2.3-3

锁定与打开图层:点击最上方“锁定图层”按钮,即可将所有图层锁定,点击每个图层右边的“锁定图层”,即可锁定该图层,该图层在锁定状态下不可被编辑操作。再次点击可打开图层。

2.3-4_.png

图2.3-4
2.3.2 动画:选择工具
2.3.3关键帧动画
2.3.4 动画:路径动画
2.3.5 动画:进度动画
2.3.6 动画:变形动画
2.3.7 动画:预置动画
2.3.8 动画:元件动画
2.3.9 动画:分页/加载页
2.3.10 动画:遮罩
2.3.11 动画:动画运动

2.2.10 素材与媒体:建组 、裁剪组

mingyueliu 发表了文章 • 1 个评论 • 840 次浏览 • 2016-09-20 17:43 • 来自相关话题

想要了解更多Mugeda功能?>>>猛戳我,学习更多教程
 
本节视频教程请点击此处。

 1.建组

如下图,在“舞台”上添加两张图片素材,将其首尾相接排放。





图2.2-101

全选两张图片,鼠标右键→“组”→“组合”





图2.2-102

即可在“属性面 查看全部
想要了解更多Mugeda功能?>>>猛戳我,学习更多教程
 
本节视频教程请点击此处。

 1.建组

如下图,在“舞台”上添加两张图片素材,将其首尾相接排放。

2.2-101_.png

图2.2-101

全选两张图片,鼠标右键→“组”→“组合”

2.2-102_.png

图2.2-102

即可在“属性面板”下观察到该元素已成“组”,可在“属性面板”下改变“组”的属性,例如改变“拖动/旋转”为“垂直拖动”

2.2-103_.png

图2.2-103

点击“预览”,发现可用鼠标在预览界面垂直拖动该图片组合

2.2-104_.png

图2.2-104

2.组类型用法

将“移动/旋转”重设为“不允许”,“组类型”为“裁剪内容”,“允许滚动”设为“垂直滚动”

2.2-105_.png

图2.2-105

选择“变形”工具将“组”大小调整为小于“舞台”

2.2-106_.png

图2.2-106

点击“预览”,发现图片组合在裁剪的范围内可上下垂直移动。

2.2-107_.png

图2.2-107

2.2.9 素材与媒体:可视化图表

mingyueliu 发表了文章 • 2 个评论 • 735 次浏览 • 2016-09-20 17:36 • 来自相关话题

想要了解更多Mugeda功能?>>>猛戳我,学习更多教程
 
本节视频教程请点击此处。

 1.添加曲线图表

点击“曲线图标”工具,在“舞台”上拖拉绘制一个曲线图表。





图2.2-89

鼠标选中“选择”工具,点击“舞台”上的曲线图表,可在“属性面板”内调节属性


查看全部
想要了解更多Mugeda功能?>>>猛戳我,学习更多教程
 
本节视频教程请点击此处。

 1.添加曲线图表

点击“曲线图标”工具,在“舞台”上拖拉绘制一个曲线图表。

2.2-89_.png

图2.2-89

鼠标选中“选择”工具,点击“舞台”上的曲线图表,可在“属性面板”内调节属性

2.2-90_.png

图2.2-90

例如,添加背景图片,改变“图片位置”为“上”,“图片尺寸”为“等比例覆盖”等。

2.2-91_.png

图2.2-91

改变曲线数据:可复制“曲线数据”框内内容,粘贴进记事本,再改变数据。

2.2-92_.png

图2.2-92

添加其他描述,例如标题、X轴Y轴说明等。

2.2-93_.png

图2.2-93

点击“预览”查看效果。如下图,可根据鼠标移动位置出现相应数据,点击“切换/图表数据”可切换数据形式。

2.2-94_.png

图2.2-94
2.2-95_.png

图2.2-95

还可继续在“属性面板”内选择设置“图表类型”以及其他的一些属性。

2.2-96_.png

图2.2-96

2.    通过行为指令设置曲线图表

如图,添加“修改图表数据”文字元素与曲线图表,将曲线图表命名为“图标1”

2.2-97_.png

图2.2-97

点击“修改图表数据”元素的“添加/编辑行为”按钮,在“编辑行为”对话框中选择“属性控制”→“修改图表数据”,点击“编辑”按钮进入“参数”对话框

2.2-98_.png

图2.2-98

在“参数”对话框内选择“目标元素”为“图标1”,粘贴修改后的图表数据,点击“确认”,点击“预览”

2.2-99_.png

图2.2-99
2.2-100_.png

图2.2-100

2.2.8 素材与媒体:云字体

mingyueliu 发表了文章 • 0 个评论 • 713 次浏览 • 2016-09-20 17:28 • 来自相关话题

想要了解更多Mugeda功能?>>>猛戳我,学习更多教程
 
本节视频教程请点击此处。

 如下图,选择“文字”工具在“舞台”上添加一个文字框,输入内容为“云字体”





图2.2-83

选中文字元素,在“属性面板”下找到“字体”选项,在字体下拉菜单内选择“上传云字体”

查看全部
想要了解更多Mugeda功能?>>>猛戳我,学习更多教程
 
本节视频教程请点击此处。

 如下图,选择“文字”工具在“舞台”上添加一个文字框,输入内容为“云字体”

2.2-83_.png

图2.2-83

选中文字元素,在“属性面板”下找到“字体”选项,在字体下拉菜单内选择“上传云字体”

2.2-84_.png

图2.2-84

在“上传云字体”对话框内点击“选择文件”,选择需上传的字体。

2.2-85_.png

图2.2-85
2.2-86_.png

图2.2-86

点击“预览”→“添加到元件库”,即添加云字体

2.2-87_.png

图2.2-87
2.2-88_.png

图2.2-88

2.2.7 素材与媒体:绘制素材

mingyueliu 发表了文章 • 2 个评论 • 616 次浏览 • 2016-09-20 16:52 • 来自相关话题

想要了解更多Mugeda功能?>>>猛戳我,学习更多教程
 
本节视频教程请点击此处。

 1.    绘制图形

如图,点击“绘制”工具栏内的各个工具,可在“舞台”上绘制各种图形。





图2.2-75

可在“属性面板”下调节各个图形的填充色、线条色以及线条粗度等


查看全部
想要了解更多Mugeda功能?>>>猛戳我,学习更多教程
 
本节视频教程请点击此处。

 1.    绘制图形

如图,点击“绘制”工具栏内的各个工具,可在“舞台”上绘制各种图形。

2.2-75_.png

图2.2-75

可在“属性面板”下调节各个图形的填充色、线条色以及线条粗度等

2.2-76_.png

图2.2-76

“节点”工具:如图,鼠标选择“节点”工具,选择“舞台”上矩形右上角的节点,右键→“节点”→“删除选中节点”,删除右上角节点,使矩形变成一个三角形。

2.2-77_.png

图2.2-77
2.2-78_.png

图2.2-78

如图,也可选中多边形中一个节点,将其进行拖动,形成五角星形。

2.2-79_.png

图2.2-79

裁切图形:如图,同时选中两个物体

2.2-80_.png

图2.2-80

在“选择”工具下,右键→“合并”→“用上层物体裁剪” 

2.2-81_.png

图2.2-81

即将圆形裁剪成如下图形

2.2-82_.png

图2.2-82

2.2.6 素材与媒体:声音

mingyueliu 发表了文章 • 1 个评论 • 1743 次浏览 • 2016-09-20 16:43 • 来自相关话题

想要了解更多Mugeda功能?>>>猛戳我,学习更多教程
 
本节视频教程请点击此处。

 1. 上传声音

由于多数设备支持mp3,因此在Mugeda内编辑的音频格式建议为mp3。

在“媒体”工具栏内选择“声音”按钮,在弹出的“导入声音”对话框中点击“选择文件”,选择所要上传的 查看全部
想要了解更多Mugeda功能?>>>猛戳我,学习更多教程
 
本节视频教程请点击此处。

 1. 上传声音

由于多数设备支持mp3,因此在Mugeda内编辑的音频格式建议为mp3。

在“媒体”工具栏内选择“声音”按钮,在弹出的“导入声音”对话框中点击“选择文件”,选择所要上传的音频文件。

2.2-53_.png

图2.2-53
2.2-54_.png

图2.2-54

点击“上传”→“添加”,将音频添加至“舞台”

2.2-55_.png

图2.2-55

选择“舞台”上的音频,在“属性面板”中设置音频属性,例如:宽高、透明度、旋转度、声音图标、静音图标、是否自动播放、是否循环播放等。

2.2-56_.png

图2.2-56

2.    声音的控制

删除物体:如图,选择“舞台”上的声音元件,右键→“删除物体”,删除“舞台”上的声音元素

2.2-57_.png

图2.2-57

设置编辑行为:点击“矩形”按钮,在“舞台”之外绘制一个矩形元素,点击矩形右边的“添加/编辑行为”按钮

2.2-58_.png

图2.2-58

在“编辑行为”对话框中选择“媒体播放控制”→“播放声音”,触发条件为“出现”,点击“编辑”按钮进入“参数”对话框

2.2-59_.png

图2.2-59

在“参数”对话框中,选择“声音元件”为“声音1”,自动播放为“是”,点击“确认”,可点击“预览”查看效果

2.2-60_.png

图2.2-60

如下图,在新页面中添加图片、“播放”“暂停”“停止所有声音”等文字元素。点击“声音”按钮添加一个新音频。

2.2-61_.png

图2.2-61

将其透明度设置为“0”,使音频元素隐藏于“舞台”

2.2-62_.png

图2.2-62

命名该音频元素为“声音”

2.2-63_.png

图2.2-63

通过行为指令控制、播放、停止所有声音:选中“播放”元素,点击其“添加/编辑行为”按钮,在“编辑行为”对话框内选择“媒体播放控制”→“控制声音”,点击“编辑”按钮进入“参数”对话框

2.2-64_.png

图2.2-64

在“参数”对话框中选择“音频名称”为“声音”、“控制方式”为“播放”,点击“确认”

2.2-65_.png

图2.2-65

同理设置“暂停”编辑行为:选中“暂停”元素,点击其“添加/编辑行为”按钮,在“编辑行为”对话框内选择“媒体播放控制”→“控制声音”,点击“编辑”按钮进入“参数”对话框

2.2-66_.png

图2.2-66

在“参数”对话框中选择“音频名称”为“声音”、“控制方式”为“暂停”,点击“确认”

2.2-67_.png

图2.2-67

设置“停止所有声音”编辑行为:上传、添加一个新音频至“舞台”,将其命名为“声音2”

2.2-68_.png

图2.2-68

将其“声音2”音频元素透明度设为“0”

2.2-69_.png

图2.2-69

选中“停止所有声音”元素,点击其“添加/编辑行为”按钮,在“编辑行为”对话框内选择“媒体播放控制”→“停止所有声音”

2.2-70_.png

图2.2-70

设置“声音2”为“自动播放”,点击“预览”观察效果

2.2-71_.png

图2.2-71
2.2-72_.png

图2.2-72

3.    设置背景音乐

如图,在“元件面板”内可找到之前上传的三个音频文件

2.2-73_.png

图2.2-73

鼠标点击“舞台”空白处,在“舞台”的“属性面板”内找到“背景音乐”设置框,选择所需背景音乐文件。点击“预览”查看效果。

2.2-74_.png

图2.2-74