当前位置:首页 > 技术知识 > 正文内容

Axure RP设计顶部导航冻结,注册模块互切换,滚动条设计的方法

maynowei10个月前 (08-02)技术知识155

以下介绍几个常用小教程,还是那句话——内容简单,适合菜鸟查阅,老鸟可飘过,顺便帮忙点个赞哈

一.顶部导航冻结,页面下拉可跟随

例如:下拉网页进行浏览,顶部导航悬停,固定在顶部位置

1.按照自己理解,拖动几个元件,把导航和主体页面设计好;

2.导航处,右键设置“转换为动态面板”,并命名top;

3.页面空白处,选择交互方式(窗口滚动时);

4.添加动作移动→选择导航→移动:绝对位置→X坐标为0,Y坐标插入变量或函数(Window.scrollY)

二.注册模块(手机注册、邮箱注册互切换)

1.拖动元件,先布局好手机注册内容表,所需的内容,包括(手机输入框,点击获取验证按钮,2次输入密码框,注册按钮);

2.手机注册内容表,右键设置“转换为动态面板”;

3.手机注册内容表,右键设置“管理面板状态”,动态面板名称设置为“add”,下面的面板状态修改State1的名称为“iphoneadd”,并添加一个状态,命名为“emailadd”;

4.点击“emailadd”,进入动态页,为邮箱注册内容表添加元件,所需的内容(电子邮箱输入框,2次输入密码框,注册按钮,边框)注意:边框需要去除顶部框线;

5.设置手机注册、邮箱注册互切换,对手机注册框,设置鼠标点击交互→添加动作“设置面板状态”→选择状态“iphoneadd”;

6.设置手机注册、邮箱注册互切换,对邮箱注册框,设置鼠标点击交互→添加动作“设置面板状态”→选择状态“emailadd”;

三.简单滚动条设计

1.拖动2个元件,矩形和动态面板,准备一个滚动条素材,我这里用的是蓝色条状素材;

2.设置矩形长为500,宽为20,(这个看自己爱好),把矩形设置为圆角,个人觉得这样好看些;

3.把动态面板也设置为长为500,宽为20,导入条状素材,覆盖到圆角矩形上;

4.设置动态面板交互属性,载入时→添加动作设置尺寸→当前元件→宽1高20;

5.再添加一次设置尺寸动作→当前元件→宽500高20,→动作为线性,时间为5000毫秒(即5秒)

本文由 @jukilee 原创发布于人人都是产品经理。未经许可,禁止转载。

相关文章

B端产品设计之业务设计(b端产品ui设计)

编辑导语:在这篇文章里,作者从解决方案设计、业务流程设计、产品功能设计三个方面,分析了如何进行B端产品的业务设计,感兴趣的小伙伴们一起来看一下吧。前篇文章讲了业务梳理,还没看过的同学可以先看看前篇文章...

高考一词多义考点! 30个高频词汇,完形填空再也不怕啦

1. address·/a'dres/ v.处理(问题)We must address the issue of climate change.·/'aedres/ n.地址Pleas...

一文弄懂 GO 的 互斥锁 Mutex !(互斥锁的使用方法)

在 Go 语言并发编程中,互斥锁(Mutex)是一个非常重要的同步原语。本文将深入介绍 Mutex 的使用方法、实现原理以及最佳实践。1. 什么是 Mutex?Mutex(互斥锁)是一种用于多线程编程...

C++ 原子操作与锁的深度解析:为什么原子操作并非万金油?

大噶好,我是henry,今天来和大家浅浅聊一下为啥C++原子操作并非万能钥匙,原因有三,且听我娓娓道来:一、原子操作的线程安全性C++11 的 std::atomic 确实为单个变量的线程安全操作提供...

go语言并发原语RWMutex实现原理及闭坑指南

1.RWMutex常用方法Lock/UnlockRLock/RUnlockRLocker 为读操作返回一个Locker接 口的对象2. RWMutex使用方法 func main() { var c...

Oracle高级数据库特性揭秘:存储过程、触发器与权限管理

当谈论Oracle高级数据库特性时,存储过程和函数、触发器、权限管理和安全性以及数据库连接和远程访问是关键概念。下面我将为每个主题提供详细的解释,并附上高质量示例。存储过程和函数: 存储过程和函数是预...