本文以Axure 8为例,给大家演示一下如果做屏幕上下滚动的原型,enjoy~

axure推出axure 9 正式版本 ,支持黑暗模式,完美契合国内晚上加班的产品同学们,哈哈哈!!!

不过目前感觉很多同学都是在用8,所以这次我以8为例,给大家演示一下如果做屏幕上下滚动的原型。其实8和9相差不大,道理是相通的,大家仔细琢磨一下就可以了。

支持web端、APP、小程序设计,很奈斯~

下面进入正题:

(1)例如:首先我们创建一个APP或模板(这里是为了好看哈哈哈),想象一下里面有很多东西,一个界面是看不完的,所以可以加入滚动模式。

(2)我们可以拉一个矩形(随你想拉什么),因为内容会放在这个矩形里面,所以大小设置为和屏幕显示一致(好看);然后可以把设置矩形边框颜色、样式、是否隐藏;完成之后拖入屏幕中央,对齐,右键单击设为动态面板。

(3)双击动态面板,点击状态1(state 1),然后再里面那个框框里填东西,可劲儿填(注意,这里面填入的东西不要超过矩形左右距离,影响美观,往下填就好了,因为这是APP,上下翻动效果最合适,如果是web端,可以左右填),填好之后回到首页。

(4)回来之后会发现我们的设置的东西很长,还超出了,接下来拉动矩形,调整矩形大小,使它和之前设置手机显示屏的一样,单击动态面板,右键-滚动条-自动显示垂直滚动条,完成之后我们的界面滚动就做完了!

(5)打开预览看一下!是不是发现这个滚动条很丑,影响美观! 我们可以把这个滚动条给遮挡起来。

点击动态面板,拉动滚动条一侧,使它和手机模型右侧重叠,放置一个矩形,调整大小,线条,完美遮挡住滚动条

(6)大功告成,完美

作者:妖怪口袋,微信公众号“妖怪口袋”

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

题图来自Unsplash,基于CC0协议

给作者打赏,鼓励TA抓紧创作!赞赏

1人打赏

axure8屏幕滚动_Axure8原型教程:实现滚动效果(小技巧:隐藏滚动条)相关推荐

  1. 手机触屏长按测试软件,长按屏幕有惊喜?学会这9个小技巧,可以触发手机里的隐藏功能...

    原标题:长按屏幕有惊喜?学会这9个小技巧,可以触发手机里的隐藏功能 在手机实体按键设计得越来越少的情况下,很多粉粉可能会感到很困惑,比如怎么才能一键打开某个功能呢?隐藏得很深的功能,又如何能够快速找到 ...

  2. flash动画制作修改教程及超实用的小技巧分享,硕思闪客精灵

    首先小编是一个小白,前几天刚接触这个,大神勿喷. 1.下雨效果 先画2个雨点,分别在起点和末尾改变它的位置,结合重力因素,创建传统补间动画,雨就制作好了,用相同的方法制作那两个圈,改变一下圈圈的大小就 ...

  3. excel表格怎么调整行高和列宽_WPS图文教程:表格使用小技巧

    编按:哈喽,大家好!WPS表格和Office表格这两款软件,对于职场人士来说,可谓是无人不知无人不晓,有人觉得Office更好用,而有人觉得WPS更好用,双方都有强大的粉丝群!往常部落窝总是带给大家关 ...

  4. Axure 点图片外区域即隐藏_长按屏幕有惊喜?学会这9个小技巧,可以触发手机里的隐藏功能...

    在手机实体按键设计得越来越少的情况下,很多粉粉可能会感到很困惑,比如怎么才能一键打开某个功能呢?隐藏得很深的功能,又如何能够快速找到-- 今天花部长就来教教大家,如何通过长按手机屏幕触发9个隐藏功能, ...

  5. 【实用工具箱】将CSDN文章内容转成PDF文件实用教程(程序员小技巧)—— 禅与计算机程序设计艺术

    Step1 : 浏览器打开 Console (F12),把下面的 JS 代码贴进去, Enter 执行,便可看到如下效果: $(function(){/*从被选元素body移除一个类页面样式*/$(& ...

  6. 实用计算机操作方法,电脑操作教程_电脑常用小技巧_电脑操作技巧

    快捷键是很多电脑高手操作电脑最常用到的,通常我们会发现,实际电脑操作中,很多麻烦的电脑操作,完全可以通过简简单单的组合快捷键轻松完成,相比一般操作方面,大大提升了工作效率.下面就让小编带你去看看初学者 ...

  7. 【微课制作软件】Focusky教程 | 制作微课小技巧 – 字幕与录音

    微课区别于传统的一对多的课堂教学, 它主要在于模拟一对一的教学情景, 所以在课件制作中, 你的演示不仅要注重版面布局,你还可以通过添加一些字幕与录音让你的内容设计更具有吸引力与说服力. 在Focusk ...

  8. Scratch教程:暗道效果

    Scratch里面的指令能够大程度实现各种各样的功能目标,除非是它的性能极限,否则code主们还是可以很放心很大胆地去创作的,就光光在"外观指令"上面,就能够通过很简单的灵活运用, ...

  9. axure8屏幕滚动_Axure教程:如何实现移动端屏幕中内容滚动效果

    Axure技巧中,APP端的内容滚动效果是一个很基础的交互.之前也有很多大牛分享过如何操作,今天分享的是更为简单的方法,希望对大家有用. 两种实现方式 实现方式1 要点说明:使用两个动态面板和两个热区 ...

  10. iOS Sprite Kit教程之滚动场景

    iOS Sprite Kit教程之滚动场景 滚动场景 在很多的游戏中,场景都不是静止的,而是滚动的,如在植物大战僵尸的游戏中,它的场景如图2.26所示. 图2.26  植物大战僵尸 在图2.26中,用 ...

最新文章

  1. 如何在Windows 2000的域环境中自动分发软件
  2. jboss4.2.3_JBoss 4.2.x Spring 3 JPA Hibernate教程
  3. PHP中封装mysql数据库链接(简单版)
  4. 个性签名设计软件_佩服!我用Python设计了一个签名软件
  5. 字符串处理 —— 最大最小表示法
  6. 使用java IO来读写文件
  7. java socket小游戏_Java Socket如何实现猜数字小游戏 Java Socket实现猜数字小游戏代码示例...
  8. springboot整合rpc远程调用_SpringBoot—-JsonRpc跨语言远程调用协议 - Java天堂
  9. Quick BI产品核心功能大图(三)电子表格:新手亦可表格自由
  10. 如何优雅地使用 Windows 10 ?
  11. IMD下载软件的使用
  12. vo,po,pojo是什么?
  13. 两台路由器直连服务器需要怎么配置,设置串联两台无线路由器的方法步骤
  14. linux dolphin模拟器,Dolphin for Mac(GameCube模拟器)
  15. OpenPose 运行指令 (Version@1.7)
  16. linux下ms安装教程,MS在linux的安装过程.doc
  17. 易语言 文本_替换_正则
  18. 2022大厂前端面试题手册
  19. 什么是DPTR寄存器
  20. 抖店无货源如何上架商品?抖店上货教程标题

热门文章

  1. 如何使用计算机处理文件夹,电脑打开某些文件夹提示引用了不可用位置怎么解决[多图]...
  2. 保险精算--第13周作业
  3. GPU通用计算与CUDA
  4. 关于Oracle练习
  5. hostapd_cli 使用手册
  6. JS async库:parallel, series, waterfall, whilst用法
  7. 《经济学通识》十一、企业该不该有钱、慈善
  8. 华为社招三面面经分享,现已拿到offer,定级D4对标17级
  9. 外星人笔记本计算机在哪里,笔记本电脑没声音,教您外星人笔记本没声音如何解决...
  10. 典型相关分析及相关知识