本文是实现动态文字在一个区域中滚动的效果,大概实现过程如下:

先准备一个区域,然后让文字在该区域内水平移动,本文是实现了从右到左的轮询的效果,其他雷同。

在Axure中,这种移动的过程需要动态移动,利用动态面板的状态切换来改变文本标签的值,从而实现了定时的功能

最后需要再页面加载的时候动态的触发动态面板的状态切换以及触发状态改变事件。貌似也可以不要触发状态改变事件。

具体流程如下:

1、打开Axure RP8软件后,系统自动创建了index页面,如图一所示:

图一 index页面

2、在内容区域内拖入一个矩形3,在拖入一个文本标签(将名称设置为:滚动文字),如图二所示:

图二 设置区域及文字信息

3、将文本标签转换为动态面板,操作为:选择“文本标签”,然后鼠标右键,选择“转换为动态面板”,然后将动态面板命名为“滚动文字动态面板”,如图三所示:

图三 转换动态面板

4、向“滚动文字动态面板”动态面板中添加状态,我采用了复制状态按钮实现,选择State1,然后State1中的“复制状态”按钮,如图四所示:

图四 复制状态

5、选择文字标签,然后再属性--交互--“状态改变时”双击,如图五所示:

图五 添加状态事件

6、向文本标签设置动作,在弹出框中添加动作一栏,找到 “移动”后点击,然后在右侧配置动作中选中“滚动文字动态面板(动态面板)”,如图六所示:

图六 添加移动事件

7、配置移动参数,还是在图六所示的图中,找到配置动作下方的移动选项,将移动选中设置为“绝对位置”,然后选中x:文本框后的fx,点击fx设置偏移量,

点击fx后弹出页面,在弹出页面中找到最上面的插入变量和函数并点击,然后选中元件中的x值,最后将This.x后增加“-10”

如图七所示:

图七 设置参数

8、增加全局变量my_move_x,将变量值设置为500(因为矩形3的宽度决定),如图八所示:

图八 添加自定义全局变量

9、添加判断条件,如图九所示:

图九 添加判断条件

10、将文本标签移动到右侧初始位置,如图十所示:

图十 移动文本标签

以上为文本标签移动配置,所有的准备好后,还需让让文本标签的“状态改变时”事件触发,下面开始触发“状态改变时”的事件。

11、选中矩形3,然后右侧属性--交互中选中“载入时”,如图十一所示:

图十一 增加触发事件

总结:

动态面板状态改变可当作定时器来使用

附件下载地址:https://files.cnblogs.com/files/-ShiL/%E6%96%87%E5%AD%97%E6%BB%9A%E5%8A%A8%E6%A1%88%E4%BE%8B.rar

在AxureRP8中实现广告文字滚动效果的更多相关文章

  1. Flash 开发环境搭建和文字滚动效果实例

    Flash 开发环境搭建和文字滚动效果实例 一.Flash 开发环境搭建 Flash发布的时候可以将资源(即将库中的元件)集成到swf运行文件中.Flash没有代码自动输入补全功能,因此需要一个英文一 ...

  2. android采用SurfaceView实现文字滚动效果

    前言 为了实现文字的滚动效果,之前也重写了TextView效果都不太好,后来对SurfaceView进行完善. 声明     欢迎转载,但请保留文章原始出处:)  小崔博客:http://blog.c ...

  3. 如何在HTML中实现图片的滚动效果

    <MARQUEE onmouseover=stop() onmouseout=start() scrollAmount=3 loop=infinite deplay="0"& ...

  4. JS平滑无缝滚动实现———实现首页广告自动滚动效果(附实例)

    本文我们实现纯JS方式的滚动广告效果. 先show一下成品: 首先是网页样式: 1. #demo { 2. background: #FFF; 3. overflow:hidden; 4. borde ...

  5. js文字滚动效果实现

    纯js实现,完整代码如下: <!doctype html> <html lang="en"> <head> <meta http-equi ...

  6. html笔记——网页中视频播放,文字滚动

    转载地址:http://blog.chinaunix.net/uid-191945-id-2792153.html <代码1无限次播放> <EMBED src="地址&qu ...

  7. TextView文字滚动效果

    ScrollText.xml <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android&quo ...

  8. 文字滚动效果,jquery和marquee标签

    链接:https://pan.baidu.com/s/1pMwHYH1 密码:r9ys marquee标签是微软创建的,后来大部分浏览器都适用后,微软在IE8把这个标签去掉了.为符合W3C规范,还是使 ...

  9. js文字滚动效果

    function (global) { var logo = document.getElementById('logo'); var text = document.createTextNode(' ...

随机推荐

  1. 如何解决U盘装系统后磁盘总容量变小?

    我在用Win32_Disk_Imager工具制作U盘系统盘之后,发现U盘大小变为2M,另外的大小没有被分配,解决办法如下. 打开:http://jingyan.baidu.com/article/59 ...

  2. Unity基础-脚本的加载与编译顺序

    脚本的加载与编译顺序 C#是以Assembly(汇编集)为一个基本单元组织代码的,dll就是一个assembly,dll之间有加载以来顺序 Assets/*.dll Stamdard Assets/* ...

  3. paper:synthesizable finit state machine design techniques using the new systemverilog 3.0 enhancements之output encoded style with registered outputs(Good style)

    把输出跟状态编码结合起来,即使可以省面积又是寄存器输出.但是没有讲解如何实现这种高效的编码.

  4. python可视化动态图表: 关于pyecharts的sankey桑基图绘制

    最近因工作原因,需要处理一些数据,顺便学习一下动态图表的绘制.本质是使具有源头的流动信息能够准确找到其上下级关系和流向. 数据来源是csv文件 导入成为dataframe之后,列为其车辆的各部件供应商 ...

  5. RMQ原理及实现

    RMQ(Range Minimum/Maximum Query),区间最值查询问题,是指:对于长度为n的数列A,回答若干次询问RMQ(i,j),返回数列A中下标在区间[i,j]中的最小/大值. 这里介 ...

  6. poj 3614 奶牛美容问题 优先队列

    题意:每头奶牛需要涂抹防晒霜,其中有效的范围 min~max ,现在有L种防晒霜,每种防晒霜的指数为 f 瓶数为 l,问多少只奶牛可以涂上合适的防晒霜?思路: 优先队列+贪心 当奶牛的 min< ...

  7. 像玩魔兽一样编程——谈VS2010键盘流

    早年在学校里的时候,经常玩War3,那时候很痴迷,也经常看sky.moon的一些第一视角,有的时候也会模仿模仿...好吧,往事不堪回首,现在工作了,谈一谈.Net程序猿使用VS的键盘流,如果你不知道s ...

  8. IDEA字体颜色快速导入辅助工具设置

     原创链接:https://www.cnblogs.com/ka-bu-qi-nuo/p/9181954.html 程序员开发大多数都是使用IDE进行代码开发的,这样能快速的开发出需要的项目.之前一直 ...

  9. Android之高效率截图

    本文来自网易云社区 作者:孙圣翔 在一张Android手机上截图有好多办法,为了能够高效率的截图,我几乎把所有的方法都尝试了一般.走了好多路,也遇到了好多的问题. 只是想记录下这其中的不容易. 下面所 ...

  10. javascript 获取键盘上的按键代码KeyCode

    Enter键的keyCode为13 Alt + Enter 的keyCode为10 $(document).on( 'keypress', function ( e ) { console.log( ...