zoukankan      html  css  js  c++  java
  • Axure遮罩 or 灯箱

    在做原型设计的时候,常常需要设计弹窗(比如confirm、alert或者弹出面板),加一个全屏的遮罩可以突出要展示的内容,效果会更好一些,类似下面这种效果:

    目前有2种方法:原始手动和axure自带效果(灯箱)

    1:手动

    需要创建2个动态面板,1个是遮罩面板,一个是弹框面板。动态面板这里就不介绍了,不会的朋友可以自行百度。在弹框面板下,正常设计需要的弹框,如上方的登录弹框,遮罩面板的宽高设置大一些,然后2个面板都设置固定在浏览器居中(水平、垂直),如下:

    注意层级关系,弹框的层级要比遮罩高一些。

    到这里基本就完成了,设置2个面板初始隐藏,页面增加一个元件,点击之后展示这2个动态面板就ok了。效果如下:

    2:自带灯箱效果:

    在Axure6.5(百度的)以后,增加的这个功能,与手动创建相比少了一个遮罩的面板,其实就是将手动创建的遮罩进行了封装。

    在点击弹出弹窗面板的元件的时候,设置展现弹窗面板,下面有个选项是选择效果,这里选择灯箱即可,还可以编辑遮罩的颜色和透明度等,如下图:

    设置完之后预览效果大致如下:

    ps:发现自带的灯箱效果,点击遮罩也会关闭弹窗,这里需要注意一下。

    转载于:https://my.oschina.net/u/1417838/blog/3034534

  • 相关阅读:
    Linux 简介
    5设计模式之桥接模式(结构模式)
    2设计模式之简单工厂模式(构造模式)
    3异步和多线程
    1设计模式之单例模式
    性能测试知多少---吞吐量
    NumberFormat DecimalFormat
    Java 005 枚举
    log4j
    Java Basic
  • 原文地址:https://www.cnblogs.com/twodog/p/12134932.html
Copyright © 2011-2022 走看看