Axure RP9 制作环形进度条

拖入一个矩形到画布,调整尺寸为260x260,选择形状


2416132-a116ac5b4e98d6e3.png
屏幕快照 2019-06-04 15.35.56.png

选择缺口圆


2416132-e6aa089a87c02e60.png
屏幕快照 2019-06-04 15.37.00.png

缺口调整为1/4
2416132-a79eb245510aafe5.png
屏幕快照 2019-06-04 15.38.14.png

拖入一个椭圆到画布


2416132-697938a5f9618795.png
屏幕快照 2019-06-04 15.41.28.png

尺寸设置为230x230
2416132-08eba469ad5f9864.png
屏幕快照 2019-06-04 15.42.22.png

先单击选中带缺口的圆形,在单击选中内部圆形。
2416132-1f8451e402a7cdf6.png
屏幕快照 2019-06-04 15.46.14.png

然后在样式中选择去除
2416132-a5077138f1502b1c.png
屏幕快照 2019-06-04 15.46.52.png

将两个形状改变成一个新的环形。设置背景色
2416132-51ac9a843f804cf9.png
屏幕快照 2019-06-04 15.48.07.png

在拖入两个矩形,转换成半圆形


2416132-cff578b160d28e8b.png
屏幕快照 2019-06-05 16.39.32.png

尺寸15x10,然后旋转为合适的角度
2416132-c4d207dea6f36f0a.png
屏幕快照 2019-06-05 16.41.08.png

分别现在两个半圆。合并
2416132-660d3fd981b92638.png
屏幕快照 2019-06-05 16.47.49.png

选中原件,旋转237度
2416132-317d2603afc2334a.png
屏幕快照 2019-06-05 16.51.40.png

重复上面的步骤拖入两个矩形
2416132-77d4c97f6483c705.png
屏幕快照 2019-06-05 16.59.26.png

选中两个矩形,去除
2416132-444c936973d4fd17.png
屏幕快照 2019-06-05 17.01.09.png

在拖两个矩形,选则半圆。旋转合适的角度合并
2416132-435a3ae62fd7be04.png
屏幕快照 2019-06-05 17.11.42.png

在拖入一个圆,然后把所有组件的线段宽度设置为0,
2416132-b3054af0a5bfa8ba.png
屏幕快照 2019-06-05 17.15.07.png

猜你喜欢

转载自blog.csdn.net/weixin_34092370/article/details/90966071
今日推荐