首页 > 其他分享 >Axure交互效果2

Axure交互效果2

时间:2024-12-09 23:32:39浏览次数:3  
标签:效果 母版 键盘 输入框 Axure 全局变量 交互 页面

--本篇导航--

  • APP刷新提示推拉效果

  • 呼出登录键盘

  • 母版元件实现导航栏跳转

  • 全局变量


交互2

APP刷新提示推拉效果

刷新提示的弹窗的状态为显示、等待、隐藏,文字或图标显示出刷新中、刷新完成。同一元件有2种状态,可以使用动态面板实现。

呼出登录键盘

登录时有手机号和密码输入框,点击手机号输入框时自动弹出数字键盘,点击密码输入框时自动弹出字母键盘。

键盘的整个状态有:数字键盘、字母键盘、空白状态。

输入框有未输入状态(未获取焦点),获取焦点状态,输入状态(显示清除按钮)。

1、页面载入时,可以让第一行的手机号输入框自动获取焦点,弹出数字键盘。

2、设置手机号输入框和密码输入框的类型,让输入内容更准确设定为数字和密码类型,还可以设置数字的长度11位。

3、设置手机号输入框的交互:(密码输入框同理)

1)获取焦点时,弹出数字键盘的动态面板

2)输入内容后,出现清除×按钮

3)点击清除×按钮,清空输入内容

4)失去焦点时,隐藏清除×按钮

4、数字键盘和密码键盘的切换:在切换时,是先收起前一键盘,再弹出后一键盘。

母版元件实现导航栏跳转

给母版添加引用事件,给母版的各元件添加[引发事件]交互,之后将母版添加到其他页面中,给实例页面添加交互事来触发[引发事件],点击对应实例页面会刷新页面。

给母版内的元件与引发事件做绑定,即添加交互触发引发事件。

给每一个应用母版的实例页面中的母版部分,添加交互触发引用事件。

全局变量

Axure中变量有局部变量和全局变量。

局部变量的名字不能是中文。    
全局变量需要先创建,可以作用于整个文档,在任意页面调用或使用(跨页面,可以做提交表单)。

创建好全局变量后,将其与对应的元件进行绑定[设置变量值]。

将全局变量传递给另一个页面。

 

标签:效果,母版,键盘,输入框,Axure,全局变量,交互,页面
From: https://www.cnblogs.com/11sgXL/p/18571186

相关文章

  • 【大数据平台】公安网大数据平台交互N网一生态介绍方案
    在多网构建子平台与公安网大数据平台交互成七网一生态。”在新一代公安网数据域、互联网、政务网、感知网、J专网、W专网、ZB专网等构建子平台,和公安网的大数据平台进行交互,打造N网一生态。子平台作为双向数据通道和双向信令通道的同时,在公安大数据平台构建和展示全局数据资源......
  • TikTok广告攻略:六大秘诀助力效果倍增!
    TikTok作为全球增长最快的社交媒体平台之一,为品牌提供了巨大的市场潜力。然而,要在TikTok上取得成功,需要掌握一些关键的广告优化技巧。以下是六个核心策略及注意事项,帮助您最大程度上提升TikTok广告效果~一、如何提升Tiktok广告效果?1.探索TikTok创意中心:探索TikTok创意中心,......
  • JQuery与iframe交互
    1.父页面调用子页面元素$("#iframe的ID").contents().find("#iframe子页面的id").click();2.父页面调用子页面方法$("#iframe的ID").[0].contentWindow.子页面中的方法();3.子页面获取父页面元素$("#父页面元素ID",parent.document);4.子页面操作父页面方法window.......
  • TikTok广告攻略:六大秘诀助力效果倍增!
    TikTok作为全球增长最快的社交媒体平台之一,为品牌提供了巨大的市场潜力。然而,要在TikTok上取得成功,需要掌握一些关键的广告优化技巧。以下是六个核心策略及注意事项,帮助您最大程度上提升TikTok广告效果~一、如何提升Tiktok广告效果?1.探索TikTok创意中心:探索TikTok创意中心,......
  • LVGL中的7种动画效果
    此篇文章在2022年3月2日被记录LVGL给我们提供了其中动画效果,分别是:lv_anim_path_linear线性动画lv_anim_path_step最后一步改变lv_anim_path_ease_in开始时很慢lv_anim_path_ease_out最后慢lv_anim_path_ease_in_out开始和结束都很慢lv_anim_path_overshoot超过结......
  • Android水波纹效果
    Android水波纹效果需要到水波纹效果的场景还蛮少的。万一刚好你需要呢一、思路:自定义组件SpreadView二、效果图:看视频更直观点:Android轮子分享-水波纹效果三、关键代码:publicclassSpreadViewextendsView{privatePaintcenterPaint;//中心圆paint......
  • 使用canvas画一个小球自由落体的效果
    <!DOCTYPEhtml><html><head><title>自由落体</title><style>body{margin:0;}canvas{display:block;}</style></head><body><canvasid="myCanvas"></canvas><script&g......
  • 如何在PbootCMS中优化图片上传和显示效果?
    在PbootCMS中优化图片上传和显示效果对于提升网站的用户体验和SEO效果至关重要。以下是一些具体的优化方法,帮助你更好地管理图片上传和显示:压缩和优化图片:在上传图片之前,使用专业的图片压缩工具(如TinyPNG、ImageOptim等)对图片进行压缩,减少文件大小。压缩后的图片可以更快地......
  • JSON 全面解析:从基础到实战,带你玩转前端数据交互
    文章目录前言一、什么是JSON?二、JSON的基本语法三、JSON与JavaScript的互操作四、JSON实战案例案例2:JSON字符串转换为对象案例3:数组与JSON的互操作总结前言在现代Web开发中,JSON(JavaScriptObjectNotation)已成为最流行的数据交换格式之一。......
  • Node.js REPL(交互式解释器)
    Node.js提供了一个内置的REPL(Read-Eval-PrintLoop),这是一个交互式编程环境,可以在终端中运行JavaScript代码。REPL的名称来源于它的主要操作:读取(Read)、执行(Eval)、打印(Print)和循环(Loop)。Node自带了交互式解释器,可以执行以下任务:读取(Read) -读取用户输入,解析输入的Ja......