zoukankan      html  css  js  c++  java
  • Axure制作iphone手机交互模型—覆盖切换

    覆盖切换常用于需要用户输入内容或者选择操作的情况,具体效果为屏幕下方弹出界面将原有界面覆盖,完成操作后向下收回,显示原有界面。此操作一般表示界面之间没有层级性关联,弹出界面更像是一个临时界面,用完即关闭。

    步骤1:打开Axure软件从部件库中建立一个iphone的外壳模型作为模拟界面。

    2.为了方便区分,在界面加入图片,在屏幕上建立一个按钮“看cindy另一张“。

    3.建立一个动态面板置于图片上方,尺寸为320px*480px,命名为“屏幕”,在动态面板上方点击右键-编辑动态面板-设置为隐藏。

    4.进入动态面板屏幕,再建立一个320px*480px的动态面板,命名为“切换”,位置为(0,480),即位于有效区域的下方,原因为覆盖切换新页面从下侧出现。

    5.进入动态面板“切换”,为便于区分建立一张新图和按钮“点击返回”。

    6.开始给按钮添加交互动作,单击“看cindy另一张”将动态面板切换向上移动0px,即显示第二张,选中“看cindy另一张”按钮,双击单击时用例进入设置用例界面,添加移动动态面板,移动相对位置(0,0),动画效果选择挥动,可根据实际情况选择使用,设置完成后点击确定。如动态面板置于上方无法选择下面的按钮,可右侧的动态面板管理中关闭动态面板的可见性,或使用快捷键ctrl+shift+【隐藏动态面板。

    7.同理对“点击返回”按钮进行设置,选中“点击返回”按钮,将动态面板切换移动会初始位置即相对位置(0.480),等待500秒后隐藏动态“屏幕”。

    单击“点击返回”按钮后,要设置“等待500毫秒”后隐藏动态面板“屏幕”,以便“看cindy另一张”按钮继续起作用。(500毫秒为动态面板“切换”移动时间,实际使用中需要配合动作时间进行相应修改)。

    8.完成全部设置后,生成查看效果。

  • 相关阅读:
    MySql
    Docker
    达观数据
    Python面试题
    用Python构造ARP请求、扫描、欺骗
    git上传简单的命令行分析
    vue2自定义指令的作用
    自定义指令详解 vue
    文档打印 js
    通过Export2Zip实现表格内容下载成为excel文件
  • 原文地址:https://www.cnblogs.com/huanhuan8808/p/3464384.html
Copyright © 2011-2022 走看看