找回密码
 立即注册

QQ登录

只需一步,快速开始

118

主题

120

帖子

538

积分

管理员

Rank: 9Rank: 9Rank: 9

积分
538

人人秀在线H5场景制作平台入门操作之【图片组件】

[复制链接]
关于动画

预览与播放时发现动画顺序与设置不同,建议手机端预览为准,pc端有时更新稍后
①“添加”添加动画,播放键预览动画效果(建议手机端预览为准)
②动画类型:默认选择【渐入】动画,用户可根据需求选择包括无动画在内的各种动画效果。
③时间:表示动画出现的持续时间;默认为1秒,用户可根据需求设置成任意数值;
④延迟:表示延迟动画出现的时间;默认延迟0.3秒,用户可根据需求设置成任意数值;
(注意动画时间与延迟时间的设置,动画2时间应在动画1播放时间+延迟时间总和之后播放更为流畅)
⑤动画播放次数:表示动画播放的次数;默认0,用户可根据需求设置成任意数值;-1位循环播放

常见动画案例教程(事件、物体移动、物体聚合等):http://bbs.rrxiu.net/forum.php?mod=viewthread&tid=1026&page=1&extra=#pid1941



人人秀导航栏点击图片按钮,弹出图片组件功能。图片组件可增加、删除、修改、设置展示中的图片等功能。
  
图片设置教程截图.png

点击页面顶部导航栏图片按钮,弹出上传图片页面框。

图片添加教程截图.png


图库类型 :
①【我的图库】是用户自己上传的图片,点击如图上传图标即可上传,支持批量上传,单次最大上传数量为20。建议上传图片大小越小越好,保证100kb以下可以有效提高H5展示流畅度。

②【图片库】是人人秀官方为用户提供的素材库,会定期更新。


选择图片后当前编辑页面即显示出图片编辑组件,点击图片编辑组件,右侧出现图片组件编辑界面
图片编辑可裁剪图片、图片大小、移动图片位置。
图片大小调整:点击图片 →图片周围会出现圆点→拖动圆点可以对图片的大小进行修改
移动图片:左键选中图片→拖动图片→松开左键完成拖动。


分为五大部分
1、图片:
①更换图片:点击弹出上传图片页面框,可重新选择图片。

②裁剪:对图片进行裁剪,并可设置图片宽度与高度,旋转,图片缩放比例,自定义图片尺寸。


2、相框:

图片相框添加设置截图.png

点击相框,可直接给图片加相框。也可根据标签为关键字进行搜索,选择添加不同的相框。

3、序列帧:
序列帧.png



序列帧——动画: 这里的动画是指用多张静态图片组合实现动图效果和CSS雪碧图效果,分为两种图片类型:图片列表和css雪碧图。

图片列表方式:点击添加图片,批量添加静态图片,如图所示,多张图片组合,设置动画播放方式之后能够实现GIF动图效果。

点击下图GIF播放



css雪碧图方式:
雪碧图效果是通过将一整张图片等分成若干尺寸相同的部分,依次播放实现动画效果,如下图,添加一整张图,设置成等分八张图片播放,而且雪碧图内的图片排列必须为一行切周围没有间隔值,设置动画播放后效果如下





动画效果的播放方式设置有
触发方式:出现(进入页面自动播放)、点击(点击播放)、事件(配合时间功能使用)和摇一摇。
播放延迟:设置播放动画的开始时间,如设置1秒,即进入页面后一秒开始播放动画。
播放速度:每张图片播放时长
循环播放:勾选即可循环播放图片动画效果,循环延迟即设定图片动画循环的播放时间。

2、右侧编辑界面样式分为四项:

样式图片截图.png

①【样式】主要包括以下功能:背景颜色的选择、图片透明度的选择,图片圆角,文本框边距

阴影图片截图.png

②【阴影调整】主要包括以下功能:对边框大小、模糊度、颜色和阴影的调整。

图片位置设置截图.png

③【位置】主要包括以下功能:对宽度、高度、对齐方式等进行设置,也可点击原始大小恢复图片原比例。




3、链接
图片的链接包含四种方式
图片链接设置截图.png
①点击图片导向外链:在“网站地址”里输入网址即可。
②点击图片进入指定作品页面:只需在“页面”下拉菜单里选择第几页即可。

同时人人秀拥有独有的事件功能选项。(动图演示,点击下图观看演示)
事件.gif

④启动分享页功能:勾选即可启动尾页的分享页功能。
设置点击音效:对图片进行点击时的音效设置。
设置图片点击样式:对点击图片时出现的样式进行设置。

4、动画
动画效果设置主要包括:触发方式设置、动画类型设置、动画方向、动画时间设置、动画重播、循环设置。
其中动画的触发方式有进入页面、事件和摇一摇,动画类型的种类也有很多种,随着人人秀的升级,还将有更多的动画类型增加;不同的动画方向选择也不一样,用户可以自由选择。
动画时间设置包括:对选定动画的动画时间(播放时间)、延迟时间和动画次数、动画循环延迟的设置。
图片动画设置截图.png
动画编辑器详解:
①+号添加动画,播放键预览动画效果
②动画类型:默认选择【渐入】动画,用户可根据需求选择包括无动画在内的各种动画效果。
③时间:表示动画出现的持续时间;默认为1秒,用户可根据需求设置成任意数值
④延迟:表示延迟动画出现的时间;默认延迟0.3秒,用户可根据需求设置成任意数值;
⑤动画播放次数:表示动画播放的次数;默认0,用户可根据需求设置成任意数值;-1位循环播放
⑥循环延迟:循环延迟时间设置



使用道具 举报 回复
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则