首页
我的博客
写文章
登录
注册
网站导航
互站首页
源码集市
服务市场
域名交易
网站交易
任务大厅
商家专区
互站社区
Axure8设计—动态仪表盘
原创
纤纤露
2023-02-26 17:03:23
评论(0)
阅读(234)
本次分享的的案例是Axure8制作的动态仪表盘,根据设置的数值,仪表盘指针旋转到相应的值位置 ![](https://img.huzhan.com/blog/20230226/20231677401825384.png) 预览及下载地址:[https://2qiuwg.axshare.com](https://2qiuwg.axshare.com "https://2qiuwg.axshare.com") 一、制作原型 1、首先创建空白页面,在工作区域拖入一个矩形元件,并将其形状修改为扇形的样子,这里在属性中找到形状设置即可,如下图所示 ![](https://img.huzhan.com/blog/20230226/20231677401892943.jpg) 设置其大小设置为312312,颜色为:#9F7344,如下图所示 ![](https://img.huzhan.com/blog/20230226/20231677401917844.png) 2.在工作区域拖入第二个矩形元件,并将其形状修改为扇形的样子,这里在属性中找到形状设置即可,其大小设置312312,颜色为:#FBBB0C;如下图所示 ![](https://img.huzhan.com/blog/20230226/20231677401941176.png) 3.在工作区域拖入第三个矩形元件,并将其形状修改为扇形的样子,这里在属性中找到形状设置即可,其大小设置312*312,颜色为:#9CA837;如下图所示。 ![](https://img.huzhan.com/blog/20230226/20231677401964835.jpg) 4.为仪表盘设置数据刻度,如图 ![](https://img.huzhan.com/blog/20230226/20231677401987305.png) 5.接下来制作指针,在工作区域拖入第四个矩形元件,并将其形状修改为三角形的样子,设置大小为:6156;拖入第五个矩形并将其形状修改为椭圆形的样子,设置大小为1616,设置颜色为#FF4848,并把组合在一起命名为“指针”,如下图所示 ![](https://img.huzhan.com/blog/20230226/20231677401825384.png) 6.仪表盘区域拖入两个动态面板,命名为“1”和“2”,设置两个状态,两个动态面板设置为隐藏状态,其作用是控制指针的动态,拖入一个文本框命名为“3”,其初始值为0,用来显示仪表盘刻度,如下图所示 ![](https://img.huzhan.com/blog/20230226/20231677402046217.jpg) 原型元件制作完毕,接下来对元件进行交互设置 二、交互设置 1.动态面板“1”设置 选择动态面板“1”,对其”状态改变时“进行交互设置: 判断文本框“3”的值,其值可以为任意值,根据需要进行设置,例如:如果值设置为小于75,其指针指向75后停止,在这设置为小于100,设置文本框“3”的值为[[LVAR1+1]],否则停止循环,并对其”载入时"事件进行设置,如下图所示 ![](https://img.huzhan.com/blog/20230226/20231677402075810.png) 2.动态面板“2”设置 选择动态面板“2”,对其”状态改变时“进行交互设置: 判断文本框“3”的值,其值如果大于0则设置文本框“3”的值为:[[LVAR1-1]],否则停止循环,如下图所示 ![](https://img.huzhan.com/blog/20230226/20231677402105885.png) ![](https://img.huzhan.com/blog/20230226/20231677402135368.png) 3.文本框“3”设置 选择文本框“3”,对其”文本改变时“进行交互设置: ![](https://img.huzhan.com/blog/20230226/20231677402178303.png)
关注下面的标签,发现更多相似文章
本文TAG标签:
分享
QQ分享
微博分享
微信扫一扫
收藏
axure8.0教程动态仪表盘
上一篇:医疗陪诊系统源码开发,可以为用户带来多种便利医疗陪诊系统源码开发,可以为用户带来多种便利
下一篇:开发直播商城系统源码依旧热度不减,浅谈未来的直播带货医疗陪诊系统源码开发,可以为用户带来多种便利
您好,
请先
登录
!请文明评论,不得违反国家法律法规!
已有
0
条评论
纤纤露
关注
TA的店铺
21
文章
7853
人气
0
评论
0
粉丝
专注Axure设计的产品经理
Ta的最新文章
Axure案例分享—进度条(附下载地址)
Axure教程—滚动加载(中继器 )
Axure教程—表格(中继器)
Axure教程—菜单(中继器)
Axure教程—堆积面积图
标签大全
axure8.0教程动态面板多级联动
(2)
axure8.0教程
(2)
axure中继器axure教程axure
(1)
axure8.0教程动态面板
(1)
axure8.0教程动态面板axure中
(1)
axure8.0教程动态面板多级联动下拉
(1)
axure
(1)
axure8.0教程中继器动态柱状图
(1)
axure8.0教程动态面板图片交互效果
(1)
axure8.0教程动态面板多级联动 中
(1)
axure8.0教程axure中继器
(1)
axure8.0教程axure菜单axu
(1)
axure8.0教程滑块步进器
(1)
axure8.0教程动态仪表盘
(1)
axure教程 axure直方图
(1)
axure教程axure动态面板图片效果
(1)
axure8.0教程 axure单色面积
(1)
axure教程axure堆积面积图axu
(1)
axure axure中继器axure教
(1)
阅读目录
已有 0 条评论