document.write('
')

Betway必威中文官网

Axure高保真教程:画图标记原型

Betway必威中文官网发布于 2022-09-14 11:57

Betway必威中文官网编辑导语:在很多软件中,我们都能看到画图标记功能。例如在阅读时,标注出重点内容;截图时,圈出需要他人注意的地方。但Axure在演示时,并没有相关功能。因此,作者分享了Axure高保真教程,总结如何制作画图标记原型,一起来看看吧。

画图标记在很多软件中是一个常用的功能,例如阅读时标记出好词好句;看地图时标记出具体位置;玩找不同的游戏时标记出不同的地方……

Betway必威中文官网由于Axure在演示时并没有相关的标记功能,所以本期教程已找不同的游戏为案例,主要介绍如果制作动态的标记元件,方便我们日后的使用。

一、制作完成后应具备以下效果在规定区域内可以通过鼠标拖动的方式画圆画的圆形跟随鼠标拖动改变大小,形状可以是正圆或者椭圆可以画多个的圆形

Betway必威中文官网原型地址:http://noq0h4.axshare.com/#g=1

二、制作材料及交互1. 背景图片

Betway必威中文官网需要被标记的图片,如果需要被标记的是文章或者地图,也可以用他们代替,原理都是一样,只是做背景使用。

2. 圆形图案

填充颜色选择透明,边框颜色为红色,案例中是圆形图案,如果你们需要用矩形或者下划线,也可以用对应形状代替。

3. 文本标签

Betway必威中文官网新建两个文本标签,其中一个命名为x值,另外一个命名为y值,默认文本0,这两个文本用于后续计算逻辑,所以可以隐藏起来。

4. 动态面板

Betway必威中文官网动态面板的大小和背景图片一致,移动至和背景图片相同的位置。或者说动态面板的所在的地方,就是能实现动态交互的地方。

Betway必威中文官网我们将圆形以及xy值的文本放在动态面板内。

交互处理:

在动态面板鼠标按下时:

设置圆形的尺寸为长1宽1(这里是将圆的大小设置为最小),锚点在左上角设置文本x值为:Cursor.x-this.x;(Cursor.x是鼠标所在坐标的x值,this.x是动态面板所在坐标的x值,因为圆形在动态面板里面,所以需要减去动态面板的x值,才能求出圆形出现的x坐标值)设置文本y值为:Cursor.y-this.y;(Cursor.y是鼠标所在坐标的y值,this.y是动态面板所在坐标的x值,同样是因为圆形在动态面板里面,所以需要减去动态面板的y值,才能求出圆形出现的y坐标值)移动圆形到达的x:文本x的值(上面计算的x值),y:文本y的值(上面计算的y值)显示圆形

鼠标拖动时:

设置圆形尺寸:长=TotalDragX,宽=TotalDragY。TotalDragX和Y代表的是鼠标拖动的x横距离和y纵距离,设置锚点在左上角。这样设置以后圆形就可以跟随鼠标拖动变化大小。

拖动结束时:

设置圆形尺寸:长=TotalDragX,宽=TotalDragY。这里和上面设置尺寸的逻辑一致设置当前元件至于底层(将该动态面板至于底层)设置图片至于底层

Betway必威中文官网这里解释一下,为什么要将当前的动态面板和图片都置于底层,因为如果需要标记多个位置的话,我们首先需要复制上述写好交互的动态面板,需要标记几个就复制几个,当第一个画完后,会挡住下面的元件。

Betway必威中文官网因此需要将他置底,置底后又被图片挡住了,看不到已标记的内容,所以还需要将图片置底,这样就可以实现标记多个的交互了。

Betway必威中文官网以上就是高保真画图标记原型的制作方法了,感兴趣的同学们可以动手试试,谢谢您的阅读。

Betway必威中文官网本文来自网络或网友投稿,如有侵犯您的权益,请发邮件至:aisoutu@outlook.com 我们将第一时间删除。

相关素材

  • 逛完这座批发市场,我立刻卸载了淘宝
  • 互联网下半场的两个“CDP”
  • “重生”的陌陌,囿于社交变现怪圈
  • 主播的自白:我不是网红,只是24小时轮班的「流水线工人」
  • 阿里腾讯生态互通的B面是「1+1<1」
  • “陶白白”抖音爆火,但情感赛道不止星座一个机会
  • 生鲜B2B模式迷局:“有菜”都关停了,美菜却还要学它?
  • 互联网平台进军新消费食品领域,这会是一门好生意吗?
  • 我是你的“朋友”,你是我的“金库”
  • 长文 | 我对内容型产品的一些思考
  • 阿里腾讯纷纷入局,NFT究竟有何魔力
  • 从会员购的众筹业务,深剖B站电商的另一个切面
  • 外卖行业新时代:抖音“心动”外卖,美团社交“未艾”
  • 又一款变脸应用持续霸榜了,而且在国外被Tik Tok封禁
  • 品牌是怎样一步步掉入流量陷阱的
  • 中美欧个人信息保护法比较
  • 从“土味梗”到“油腻梗”,它们为何一次次成为流量制造机?
  • 你可以拒绝算法了
  • “双减”风暴下 谁在趁乱收割儿童市场?
  • 居民垃圾分类习惯展望碳中和市场的未来产品发展
  • 谈谈迭代的那些套路
  • 抖音、快手们的自营电商劫
  • 在线K歌:起于K歌,长于社交
  • 只因为这两个新功能,微信新版本值得我“吹爆”
  • 30天,一个近万亿市场轰然倒塌
  • 互联网巨头攻不进社区
  • 还讲消费主义?现在年轻人都拼怎么更抠门
  • 数字科技的“弯路”
  • 短视频出海,风云再起
  • 反垄断阴影下的互联网及未来
  • 失去“增长第一要义”之后,互联网的方向在哪?
  • 电商变成了他们曾经讨厌的样子
  • betway必威登录官网 必威体育app官方版下载 betway必威注册网址 金沙彩票app官方下载 必威体育betway登录手机 365bet体育注册 必威体育苹果app下载 365betapp苹果版下载 必威体育官网下载 必威体育betway登录手机