Axure函数应用:用全局变量制作跳转带上手机号

0 2021-09-13 14:47 内容校对:海绵宝宝手里的锅铲
收藏(0) 共有 66 人学习了本教程

《Axure函数应用:用全局变量制作跳转带上手机号》是一篇关于Axure的学习教程,通过简单几步就能实现教程中的效果图效果,当然只学习这一点,并不能完全掌握Axure技巧;你可以通过此加强操作实例,交互设计,输入框等多维度案例或实操来进行更多的学习;此教程是由Neo在2021-09-13发布的,目前为止更获得了 0 个赞;如果你觉得这个能帮助到你,能提升你Axure技巧;请给他一个赞吧。

为什么要使用全局变量?主要是起信息传递作用,或者标志作用,可以在多个页面间传递信息,或者作为特殊场景的判断依据。

01 业务场景

用户在app登录页面输入手机号后,平台发现用户未注册,引导注册时,不需要用户再次输入手机号,在账号框内直接带入刚才输入的手机号,可引导用户快速注册,减少用户考虑的时间,自然可以减少流失。

先来看看整体效果:

Axure函数应用:用全局变量制作跳转带上手机号

具体步骤为:

  • 用户输入手机号,点击【登录】按钮;
  • 系统检测到用户未注册,提示“用户不存在,点击去注册”,用户点击【去注册】按钮,跳转注册页;
  • 注册页的手机号输入框内,带入用户在登录界面输入的手机号。

02 分解页面

1. 验证码登录页组成

  • 手机号输入框(文本框)
  • 验证码输入框(文本框)
  • 获取验证码按钮(矩形)
  • 登录按钮(矩形)

Axure函数应用:用全局变量制作跳转带上手机号

2. 跳转对话框组成

  • “去注册”按钮(矩形)
  • “暂不注册”按钮(矩形)

Axure函数应用:用全局变量制作跳转带上手机号

3. 注册页组成

  • 手机号输入框(文本框)
  • 密码输入框(文本框)
  • 验证码输入框(文本框)
  • 获取验证码按钮(矩形)
  • 登录按钮(矩形)

03 实践步骤

做到带手机号效果的思路是:

  1. 在登录页输入手机号,在跳转“去注册”时将输入的值保存在全局变量中;
  2. 跳转注册页时,将保存在全局变量中的值写入手机号输入框中。

没错!所以重点在一个全局变量、一个按钮和两个手机号输入框(文本框)。

1. 给两个输入框命名,方便查找

此步可以根据个人需要选择,建议操作,可以提高效率

登录页的手机号文本框叫做“手机号输入框”,

Axure函数应用:用全局变量制作跳转带上手机号

注册页叫做“手机号”,方便区分。

Axure函数应用:用全局变量制作跳转带上手机号

2. 添加全局变量,取登录页手机号

(1)添加全局变量,命名为“telVar”

点击“去注册”按钮->给“鼠标单击时”添加用例->选择【全局变量】-【设置全局变量】-【添加全局变量】,如图:

Axure函数应用:用全局变量制作跳转带上手机号

点击【添加全局变量】,新增一个全局变量,命名为“telVar”(取名随意,记住就行),如图:

Axure函数应用:用全局变量制作跳转带上手机号

(2)设置点击“去注册”按钮时,将登录页手机号文本内容赋予“telVar”

点击“去注册”按钮的用例编辑框->选择【全局变量】-【设置全局变量】->勾选“telVar”,在“设置全局变量值为”选择“元件文字”和“手机号输入框”,表示选取“手机号输入框”的内容文字。

Axure函数应用:用全局变量制作跳转带上手机号

3. 在用户选择“去注册”时,跳转注册页

这个步骤就不累述了,关键要注意,一定要先给变量赋值,再打开窗口,否则变量赋值会失效!

Axure函数应用:用全局变量制作跳转带上手机号

4. 设置注册页初始化时,将手机号写入输入框

点击注册页->编辑“页面载入时”用例->选择【设置文本】->勾选“手机号(文本框)”,如图

Axure函数应用:用全局变量制作跳转带上手机号

在“设置文本为”选择“值”,变量内容点击【fx】按钮,选择【插入变量或函数】,选择全局变量“telVar”,关闭变量选择框,如图

Axure函数应用:用全局变量制作跳转带上手机号

设置之后的效果如下图,熟悉以后,也可以直接在变量框中输入“[[telVar]]”,表示取变量telVar

Axure函数应用:用全局变量制作跳转带上手机号

设置完毕!保存!预览看效果!

Axure函数应用:用全局变量制作跳转带上手机号

当然也可以选择在输入手机号时就保存在变量里,但考虑到有其他场景跳转注册页,避免带入多余的值,还是放在确定要带手机号的场景下赋值。

以上就是Axure函数应用:用全局变量制作跳转带上手机号的全部内容介绍了,关于更多Axure教程信息,欢迎关注北极熊素材库,给你带来最丰富的素材图片和最有用的教程,更多最新资讯。

0

赠人玫瑰,手有余香

本内容由Neo原创发布,小编仅对内容版式进行调整,如有侵犯你的权利,请联系我们。

如果你觉得好,你可以将本课程转发给你的朋友!

参与评论
验证码

输入的验证码不正确

0/10000

评论区

暂无评论

Neo
Neo

擅长平面、广告、UI、插画、视觉设计、美工,图形特效表现等领域

共发布了233个文章 共获得16个赞

最新发布的教程

查看更多此作者的教程
用户给我们的评价
北极熊素材库累计为超过1000+家中小企业提供服务
欢迎来到北极熊素材库

使用微信扫码登录

使用账号密码登录

请输入用户名,6-15个字符

请输入密码,最少6-15个字符

立即注册 | 找回密码

登录失败

注册及代表同意 网站协议
扫码登录及代表同意 网站协议

请输入用户名,6-15个字符

请输入绑定的邮箱

验证码

输入的验证码不正确

登录失败

提示信息

内置密码的链接已通过Emall 发送到你的邮箱中,请在三天内修复密码。

3秒后,将关闭此窗口 立即关闭

请输入用户名,6-15个字符

请输入密码,最少6-15个字符

二次密码不一致

请输入正确的邮箱

验证码

输入的验证码不正确

注册失败

您还不是我们的VIP会员

成为我的的VIP会员
即可享受6大特权并免费高速下载数以万计的设计素材,助力您的工作和学习

立即升级VIP会员