font awesome里面的图标怎么添加进axure8.0的元素库里

font awesome里面的图标怎么添加进axure8.0的元素库里,第1张

点击创建元件库,把图标放到.rplib的文件中,然后再载入这个元件库文件即可;

这个元件库建议放在你经常保存的位置,不悉野要随便删除了,以后贺陆携禅伏要更新这个元件库就在元件库下拉框中选择这个元件库,刷新元件库即可

1.准备工作

打开Axure7.0(纯属废话,大家这么聪明都知道的~嘻嘻~)

左侧工具栏,拖拉出矩形框2个

一个矩形框设置成200*200大小,一个设置成400*400

两张图片,一张缩略图(命名小图),一张放大图(命名大图),两张图片最好是等比的,看着效果更佳

将错略图放到200*200的矩形框内

准备工作暂时告一段落。

看看放大图片必要的元素还缺少些什么?嗯,就是放大镜!Of course,也有很牛掰的不用放大镜,鼠标放到缩略图上就放大图片,原理都是相同的啦,我这里放个放大镜,方便看效果~~~~~~

2.添加放大镜

左侧工具栏,拖拉出矩形框一个

将矩形框设置成40*40大小

边框设置成绿色(颜色随你喜欢),填充设置成透明(这个必须,不然就看不到后面图片了哦)

将放大镜矩形框移动到缩略图片上

Yeah,放蠢渣大镜制作完成,来看下预览效果。咦?放大镜不能带宏悄移动,What’s wrong??????Calm down,还没有给放大镜添加动态效果。

放大镜动画效果:鼠标移入图片显示放大镜;鼠标移出隐藏放大镜;放大镜跟随鼠标移动;

点击选中缩略图

右侧交互区添加交互事件,选择“鼠标移入时绝或”,显示“放大镜”

再添加交互事件,选择“鼠标移出时”,隐藏“放大镜”

在页面交互区添加页面交互事件,选择“页面鼠标移动时”,移动“放大镜”,设置x和y距离,一定要选择“绝对距离”(不这么做的你看看是什么效果,认真脸),添加函数即点击fx打开变量面饭,插入函数Cursor.x和Cursor.y(为了使鼠标显示在放大镜中间样子更好看,设了Cursor.x-20和Cursor.y-20,猜猜为什么是-20而不是-10或-60?就是这么调皮,啦啦啦~)

来来来预览一下。嗯,移动可以了,但是一开始放大镜就显示出来了,这你逗人玩吗?NoNoNo,忘记一步。

右键放大镜,选择隐藏

目前比较好的解决办法是:

下载Axure

2.如果是给itouch或者iPhone用的,比较好办,直接用320×480的分辨率画好辅助线,然后画原型

3.按F5生成原型的时候,在“Mobile/Device”选项中可以设置适配移动设备的特殊原型

4.设置说明见下图:桐山(页面大小显示我的这个设置是按320×480的大小,默认不缩放)

5.用你的移动设备访问你生成的原型链接(如本地服务器兆轮亮,或族宽Dropbox托管)6.把该页面创建一个桌面快捷方式7.完成(有icon,有闪屏)另:想做鼠标动作或者复杂的页面交互比较麻烦,不推荐,尽量简洁。


欢迎分享,转载请注明来源:内存溢出

原文地址:https://www.54852.com/bake/11994027.html

(0)
打赏 微信扫一扫微信扫一扫 支付宝扫一扫支付宝扫一扫
上一篇 2023-05-20
下一篇2023-05-20

发表评论

登录后才能评论

评论列表(0条)

    保存