使用Axure制作出一个左侧二级切换效果具体操作流程

2024-10-14 10:38:53阅读量:97 字体:

相信使用Axure的用户还是蛮多的,不过你们晓得Axure如何制作出一个左侧二级切换效果呢?下文就为你们带来了使用Axure制作出一个左侧二级切换效果的具体操作流程。

使用Axure制作出一个左侧二级切换效果具体操作流程

一、基础准备工作

1、首先大家通过Axure的部件--矩形,建立如图所示的图样。(基础的我就不太细说了),底色图:灰色,w350/h500;三个彩色的矩形:w300/h40;分别命名为1,2,3,无色的三个矩形:w300/h100;分别对应彩色的命名11,22,33,调整一个彩色的矩形对应一个白色的矩形,排版如图所示;

2、将11,22,33设置为隐藏状态,设置方法:选择图形,在右侧的“部件属性和样式”,选择hidden(隐藏)。

3、调整位置,选择2和22两个矩形,向上移动,至1的下边缘和2的上边缘对齐。同样移动3和33,与2的最下边缘对齐,如图所示

二、用例的设置方法

1、选择蓝色的矩形(也就是1);在“部件交互和注释”-“鼠标单击时”,右键“新增用例”;弹出用例编辑器

2、在用例编辑器,选择"部件“-切换;在最右侧“第四步 配置动作”,选中"11",可见性选择“切换”,并在”更多选项“中选择”展开部件“;选择“22”,可见性选择“隐藏”,选中“收起部件”,其他默认;

选择“33”,可见性选择“隐藏”,选中“收起部件”,其他默认;点击确认;设置完成后,如图所示

3、选择黄色矩形2,在“部件交互和注释”-“鼠标单击时”,右键“新增用例”;弹出用例编辑器;在用例编辑器,选择"部件“-切换;在最右侧“第四步 配置动作”,选中"22",可见性选择“切换”,并在”更多选项“中选择”展开部件“;选择“11”,可见性选择“隐藏”,选中“收起部件”,其他默认;选择“33”,可见性选择“隐藏”,选中“收起部件”,其他默认;点击确认,设置完成后,如图所示

4、选择红色矩形3,在“部件交互和注释”-“鼠标单击时”,右键“新增用例”;弹出用例编辑器;在用例编辑器,选择"部件“-切换;在最右侧“第四步 配置动作”,选中"33",可见性选择“切换”,并在”更多选项“中选择”展开部件“;选择“11”,可见性选择“隐藏”,选中“收起部件”,其他默认;选择“22”,可见性选择“隐藏”,选中“收起部件”,其他默认;点击确认,设置完成后,如图所示

5、点击F5预览或者生产原型文件。建议用IE查阅。完成后如图,大家点击试试吧。

按照上文为你们分享的使用Axure制作出一个左侧二级切换效果的具体操作流程,你们是不是都学会操作的方法啦!

推荐阅读

  • 新加好友怎么才能分享屏幕

    新加好友怎么才能分享屏幕

    qq聊天中自带有分享屏幕的功能,只要加了好友,直接点击分享屏幕就可以将屏幕分享给对方。具体操作方法如下: 新加好友怎么才能分享屏幕 1.在qq中找到要分享屏幕的好友,点击进入对话界面。 2.点击对话...

    阅读: 658

  • 手机锁屏微信语音视频没有提示声音

    手机锁屏微信语音视频没有提示声音

    手机锁屏微信语音视频没有提示声音可能是关闭了,接收语音和视频通话邀请提醒,如果关闭了就不会有提醒,可以通过设置重新开启这个功能,具体操作步骤如下: 手机锁屏微信语音视频没有提示声音 1、打开微信app...

    阅读: 614

  • 荣耀60声音小怎么办

    荣耀60声音小怎么办

    如果荣耀60手机的声音比较小的话,可以去系统内进行相应的调整,把手机的声音调大,具体的操作步骤如下: 荣耀60声音小怎么办 1、打开手机的设置,点击声音和振动”按钮,进入声音和振动的设置页...

    阅读: 733

  • ipad pro怎么录屏

    ipad pro怎么录屏

    ipad pro设备有录屏的功能,有需要的用户可以去手机的控制中心内打开按键进行录屏,具体的操作步骤如下: ipad pro怎么录屏 1、进入手机的桌面中,从手机屏幕的右上角往下滑,呼出控制中心的界面...

    阅读: 767

  • 苹果平板如何隐藏app软件

    苹果平板如何隐藏app软件

    苹果平板没有隐藏app软件的功能,但是可以把app下载到资源库中,这样就不会显示在平板的桌面上,操作方法如下: 苹果平板如何隐藏app软件 1、打开平板的设置,点击主屏幕”按钮,进入主屏幕...

    阅读: 640

  • 荣耀x30如何升级鸿蒙系统

    荣耀x30如何升级鸿蒙系统

    荣耀x30手机升级鸿蒙系统需要去手机的设置内进行手动点击升级,系统会自动进行检测,具体的操作步骤如下: 荣耀x30如何升级鸿蒙系统 1、打开手机的设置,点击系统和更新”按钮,进入系统设置中...

    阅读: 743