如何使用Axure:[7]制作弹出窗口Modal

作者:小橘猫 | 创建时间: 2023-05-15
当我们制作网站模型时,很容易就会遇到弹出窗口,一般情况下,在前端框架中,这种效果叫Modal。...
如何使用Axure:[7]制作弹出窗口Modal

准备

打开Axure,创建一个新的RP文件

拖入一个矩形,用于触发Modal弹出

拖入一个矩形,并转换为动态面板,并命名为ModalPane

进入ModalPane的状态state1中,设置已经存在的矩形的边框为「无边框」,设置其背景色为灰色,透明度为30%

添加一个矩形,作为弹出Modal,将其转换为动态面板

进入到Modal的状态编辑界面,并绘制Modal的内容

添加事件

在Modal动态面板中,为关闭按钮添加关闭事件

设置ModalPane的可见属性为隐藏

为「触发」按钮添加显示ModalPane的事件

完成

按F5进行预览

点击展开全文

更多推荐