1. 拖拽一个矩形命名为“LED显示屏”,并将矩形转为动态面板。
  2. 在动态面板State1中拖拽一个文本标签并命名为“广告内容”。
    Axure RP(七)案例(文字跑马灯效果)
  3. 拖拽一个动态面板放在一边并命名为“轮询面板”,再新建一个状态,总共两个状态,两个状态都不需要填充内容,作为事件轮询的作用。Axure RP(七)案例(文字跑马灯效果)
    Axure RP(七)案例(文字跑马灯效果)
  4. 页面载入时设置动态面板状态。这里每隔300毫秒空循环一次,两个空状态一直切换下去。Axure RP(七)案例(文字跑马灯效果)
  5. 动态面板状态切换时移动广告内容的横坐标。Axure RP(七)案例(文字跑马灯效果)
  6. 当广告内容第一轮循环结束后还要将广告内容重置到动态面板的最后面,也就是重新设置广告内容的横坐标。这里的临界横坐标是广告内容的宽度。这里的宽度是680。这里还需要增加移动的条件当 -670 <= 内容的横 <= 400 这个范围才让内容移动,如果内容的横坐标为-670时就将横坐标重置为原来的400。Axure RP(七)案例(文字跑马灯效果)
    Axure RP(七)案例(文字跑马灯效果)
  7. 最终效果
    Axure RP(七)案例(文字跑马灯效果)

相关文章:

  • 2022-03-01
  • 2021-06-27
  • 2021-07-14
  • 2022-01-14
  • 2021-07-14
  • 2021-07-20
  • 2021-05-28
猜你喜欢
  • 2022-12-23
  • 2022-12-23
  • 2022-12-23
  • 2021-11-08
  • 2021-07-06
相关资源
相似解决方案