Axure教程:使用动态面板实现收藏、已收藏

0 2021-08-26 14:15 内容校对:海绵宝宝手里的锅铲
收藏(0) 共有 102 人学习了本教程

《Axure教程:使用动态面板实现收藏、已收藏》是一篇关于Axure的学习教程,通过简单几步就能实现教程中的效果图效果,当然只学习这一点,并不能完全掌握Axure技巧;你可以通过此加强操作实例,交互产品,页面等多维度案例或实操来进行更多的学习;此教程是由福到家在2021-08-26发布的,目前为止更获得了 0 个赞;如果你觉得这个能帮助到你,能提升你Axure技巧;请给他一个赞吧。

Axure如何用动态面板实现收藏、已收藏?一起来看一看吧:

原型效果

收藏->

Axure教程:使用动态面板实现收藏、已收藏

已收藏->

Axure教程:使用动态面板实现收藏、已收藏

预览原型地址:https://hi9c4s.axshare.com

所需元件

一个矩形转换为动态面板并命名为“是否收藏”;

两个面板并分别命名为“收藏”、“已收藏”;

两个面板下放相同大小的矩形分别命名为“收藏”、“已收藏”;

一个空心的五角星Icon;

一个实心的五角星Icon。

Axure教程:使用动态面板实现收藏、已收藏

操作步骤

(1)画布拉入一个合适大小的矩形,并转换为动态面板

Axure教程:使用动态面板实现收藏、已收藏

(2)动态面板增加一个状态,并命好名

Axure教程:使用动态面板实现收藏、已收藏

(3)在“收藏”面板下的矩形内填入文字“收藏”,并将空心五角星Icon放到合适的位置

Axure教程:使用动态面板实现收藏、已收藏

(4)在“已收藏”面板下的矩形内填入文字“已收藏”,并将实心五角星Icon放到对应的位置

Axure教程:使用动态面板实现收藏、已收藏

(5)设置动态面板的交互——鼠标单击时

Axure教程:使用动态面板实现收藏、已收藏

(6)完成,按F5预览原型看看

小记

1.这里可能会有人发现我的元件列表里并没有“空心”五角星Icon以及“实心”五角星Icon,这是因为我用FontAwesome字体代替了它们,至于FontAwesome字体究竟是什么,刚入门Axure的小白可以去网上搜索一下。它的部分作用是能大大的节省文件所占内存大小以及加快原型预览加载速度。我这个原型案例较小可能看不出效果,但是等制作一个大型的原型时,那效果将非常地显著。

Axure教程:使用动态面板实现收藏、已收藏

2.这个原型案例操作非常地简单,主要是学会去使用动态面板;触发面板的交互以及在设计时各个元件的对应摆放。

以上就是Axure教程:使用动态面板实现收藏、已收藏的全部内容介绍了,关于更多Axure教程信息,欢迎关注北极熊素材库,给你带来最丰富的素材图片和最有用的教程,更多最新资讯。

0

赠人玫瑰,手有余香

本内容由福到家原创发布,小编仅对内容版式进行调整,如有侵犯你的权利,请联系我们。

如果你觉得好,你可以将本课程转发给你的朋友!

参与评论
验证码

输入的验证码不正确

0/10000

评论区

暂无评论

用户给我们的评价
北极熊素材库累计为超过1000+家中小企业提供服务
欢迎来到北极熊素材库

使用微信扫码登录

使用账号密码登录

请输入用户名,6-15个字符

请输入密码,最少6-15个字符

立即注册 | 找回密码

登录失败

注册及代表同意 网站协议
扫码登录及代表同意 网站协议

请输入用户名,6-15个字符

请输入绑定的邮箱

验证码

输入的验证码不正确

登录失败

提示信息

内置密码的链接已通过Emall 发送到你的邮箱中,请在三天内修复密码。

3秒后,将关闭此窗口 立即关闭

请输入用户名,6-15个字符

请输入密码,最少6-15个字符

二次密码不一致

请输入正确的邮箱

验证码

输入的验证码不正确

注册失败

您还不是我们的VIP会员

成为我的的VIP会员
即可享受6大特权并免费高速下载数以万计的设计素材,助力您的工作和学习

立即升级VIP会员