H5制作软件 Hype 4 如何编辑元素

本章节将深入探讨在Hype 4H5制作软件中如何对元素进行编辑。要注意的是,小编这里讲解的编辑不是调整元素的属性。

从前面四个章节的内容小伙伴可以看到,小编把元素分为四类:

  1. 1、形状:包括了矩形、多边形、矢量形状和铅笔。

  2. 2、组件:包括了文本和按钮。

  3. 3、特殊类元素:包括了Sprite表元素和HTML小组件。

  4. 4、多媒体:包括了图片、视频和音频。

小伙伴要注意的是,在四类元素中,有些编辑可以在全部元素中使用,但有些只能在部分元素中使用。

  1. 一、使用快捷键调整元素的大小

这个编辑对全部元素都适用。每个元素边上都有8个空心点,可以通过拖拽这8个空心点改变元素外观形状的边长或者大小。

  1. 按着SHIFT键拖动空心点,元素会以拖动点相对应另一边的空心点为原点,通过改变元素的宽高,增大或者缩小元素。在“度量”面板中,可以看到元素的宽高值发生了变化。

图1:SHIFT快捷键作用
  1. 按着Option键拖动空心点,元素会以元素中心点为原点,通过改变元素的宽高,增大或者缩小元素。在“度量”面板中,可以看到元素的宽高值发生了变化。

图2:Option快捷键作用
  1. 同时按住SHIFT + Option键拖动空心点,元素会以元素中心点为原点,限制宽高,等比例改变元素的宽高值,增大或缩小元素。在“度量”面板中,可以看到元素的宽高值发生了变化。

图3:SHIFT + Option快捷键作用
  1. 按Command键,在4个边角的外边,会有4个转动符号,鼠标移动到这些符号上,可以转动形状。如果拖动空心点,则以元素中心点为原点,等比例限制宽高,缩放元素高度和宽度的百分比,增大或缩小元素。缩放并没有真正改变元素的宽高值。

图4:Command快捷键作用
  1. 二、给元素添加文字

视频和Sprite表元素是无法添加文字的,HTML小组件添加的是HTML代码,不算传统意义的文字,剩下的其他元素都可以添加文字。

在元素上双击鼠标左键,元素出现蓝色的边框,并且在形状的正下方有一个“铅笔”形状的符号,点击该符号,会弹出一个空白的文字框,在文字框上添加的文字就会在元素上显示。

添加的文字可以是一个、一行或者一个段落,对文字的排版编辑使用“排印”面板,在该面板可以设置字体、大小、颜色、对齐、文本间距等等属性。

图5:给形状添加文字
  1. 三、把元素转换成矢量形状

能转换成矢量形状的元素针对的是“形状”一类的元素,其他类别的元素是不能转换成矢量形状的。

转换成矢量形状的方法:鼠标右键点击要转换的元素,在右键菜单选择“转换成矢量形状”即可。

  1. 在“形状”类元素中,矢量形状、多边形和钢笔元素本身就是矢量图形,无需转换;转换的元素主要就是矩形、圆角矩形和椭圆形。

图6:把形状元素转换成矢量形状
  1. 图片添加可以看作是矩形等形状添加图像背景,因此图片元素也可以转换成矢量形状。

图7:把图片元素转换成矢量形状
  1. 元素转换为矢量形状后,可以把外观改变成各种形状,如果给元素添加边框属性,那么就会绕着形状添加边。

但是,无论元素变成什么形状,元素的8个空心点围绕的是一个矩形,如果给元素添加阴影,给8个空心点的矩形添加阴影,而非元素实际形状添加阴影。

图8:给矢量形状添加边框和阴影
  1. 四、总结

前面的四个章节添加元素和本章节编辑元素共五个章节把有关元素的基础知识基本讲完了。

元素是Hype 4交互动效制作的基石,在Hype 4中新增了矢量形状、铅笔、Sprite表元素等元素。矢量形状和铅笔提升了Hype绘图的功能;Sprite表元素可以将手绘图片制作成基于Web的动画。这些新增的功能和作用,更加体现了Hype作为HTML5创作工具的强大。

(0)

相关推荐

  • Win10 使用技巧集锦 - 自带的截图功能

    有经验的电脑玩家会说,直接使用键盘上的按键: PrtScn(或者 PrintScreen):全屏截屏 Alt + PrtScn:当前活动窗口截屏 这确实是原生的截屏方式,只不过使用这种方式截屏的图像, ...

  • AI如何将矢量图形转换为参考线?

    参考线是可以自定义形状的,不过前提是将矢量图形转换为参考线,下面来看看如 何操作吧! 1.首先使用形状工具绘制出一个矩形来. 2.然后将形状填充一个颜色显得更加的明显. 3.然后选中图形,点击参考线选 ...

  • 2020春节特辑—停课不停教—推荐一款压箱底的录屏软件ScreenFlash,可编辑还有多种导出格式,微课制作更出彩!

    万一您身边的朋友用得着呢? 免费咨询热线:如果您有工作中的困惑要和小菜分享或探讨,欢迎您发送邮件至3482197@QQ.COM,咱们一起研究提高. 郑重声明:本文仅为传递更多信息,小菜没有从所介绍的软 ...

  • EOP简谱制作软件|EOP简谱大师 V1.6.11.28 官方免费版 下载

    EOP简谱大师是一款可以帮助用户制作钢琴简谱的电脑软件,该软件操作简单,熟悉10分钟即可自行制作双手简谱文件,制作出来的EOPN文件可以加载到EOP其他软件中实现跟弹学习,也可以上传到人人钢琴网上分享 ...

  • 可以赚钱的特效制作软件,你确定不了解一下吗?

    作为一个曾经忙成狗的设计工作者,在经历了深思熟虑之后,我最终还是因为身体无法承受这样高强度的工作而转行做了别的职业.但是,最初选择设计就是因为对这个职业的热爱,所以现在,我还是会在工作之余做一些自己想 ...

  • 免费的相册视频制作软件哪个好

    免费的相册视频制作软件哪个好 笨小孩 1W次浏览 2019.11.12 免费的相册软件哪个好?小陌我作为一名视频制作爱好者,用过很多的相册视频制作软件,下面给大家盘点几个比较好用的,我从手机端和电脑端 ...

  • 相册视频制作软件哪个好

    操作方法 01 登录拍大师之后会进入软件的欢迎界面,我们选择图片创作,进入图片创作界面.进入图片创作界面软件就会有一个新手引导,我们跟着新手引导一起来了解各个功能.在没有图片素材的情况下要先用[拍摄专 ...

  • 免费的视频制作软件哪个好

    免费的视频制作软件哪个好 肖肖 3692次浏览 2019.03.19 视频制作主要是视频录制,编辑,发布. Camtasia Studio是电脑屏幕录制编辑发布一体的软件.fraps专业游戏录制.Ae ...

  • 小视频制作软件哪个好

    操作方法 01 小影,这是一个比较专业的小视频制作软件,而且软件内还有许多的好莱坞级特效,内容十分丰富. 02 爱剪辑,这也是一个不错的软件,爱剪辑可以让我们随意的剪辑视频,而且清晰度也是比较高的. ...

  • 卡通头像制作软件叫什么

    "找呀找呀找头像,找到一个好头像" "你一看,我一望,好多人都在使用" 现在这个社会,建个微信号-请设置头像,创个QQ号-请设置头像.头像即代表脸面,好不容易找 ...

  • 分享mikumikudance是一款非常经典的三维舞蹈动画视频制作软件

    今天我们来分享什么呢? GIF动态软件工具 mikumikudance是一款非常经典的三维舞蹈动画视频制作软件,很多使用过这个软件的玩家都说好,如果你有这方面的需要,那么就来rz520下载mikumi ...