DonutView多彩双环进度组件

多彩圆环的内外双环结构,用起来还挺有意思的,适合做点什么进度展示、指标可视化那类场景。它是基于自定义的组件,名字可以叫DonutView,支持颜色和文字都自定义,字体大小也能调,蛮灵活的。画图那块用的是Core Graphics,老熟人了,配合UIBezierPath搞定内外两个弧形,用addArc()这些方法基本就够了。

颜色设置这块也比较顺手,用UIColor搞定,内环、外环、文字都能分开配色,想搞点撞色设计也没问题。字体用UIFont,配上draw(in:withAttributes:),文字位置和样式就能比较自由控制了。如果你后面还能改样式,那直接加几个属性比如ringWidthringColorsfontSize这种会更实用。

代码结构也清爽,draw(_ rect: CGRect)是主战场,只要不写太复杂的逻辑,响应也快,性能没什么压力。你还可以在一个叫DonutDemo的小 demo 里看下实际效果,能看到怎么实例化、怎么加到页面上、怎么配参数,省得你自己摸索。

如果你有自定义 UI 的需求,又刚好需要一个视觉上比较吸睛的组件,那这个DonutView还蛮值得试试的。尤其是数据可视化场景,或者你想在 App 里搞点动态进度的效果,用它比传统的UIProgressView漂亮多了。

哦对了,如果你对自定义视图还有兴趣,可以看看这些相关文章:

zip
DonutDemo.zip 预估大小:57个文件
folder
DonutDemo 文件夹
folder
.git 文件夹
folder
info 文件夹
file
exclude 40B
folder
objects 文件夹
folder
pack 文件夹
folder
69 文件夹
file
05cc67bbf738499f2accb4b56f5f1ddc8ce444 506B
folder
79 文件夹
file
e11c7a5e46dedbfe50f77ecccbecce28dc4c13 135B
folder
info 文件夹
folder
cb 文件夹
file
4282379ead37952cdeda6a81e809a765ba165b 319B
folder
7f 文件夹
file
db7ac5fdee2e8b43c917446ba4857761bf78b4 69B
folder
07 文件夹
file
4b5b4f737fbdc237cfcc1cd06da793c560529d 104B
folder
ef 文件夹
file
be75ba7e0e28b9136b21727c6a80f9f6ba3d08 116B
file
5b122fce8b1c68bc2487c49cdf8bb7ba32ef9b 95B
folder
5d 文件夹
file
dc879a0d16e812f8e6302b3269d052e1eb77a6 285B
folder
ba 文件夹
file
72822e8728ef2951005e49b6c27a2f1da6572d 353B
folder
e4 文件夹
file
ec02d2643a3df100ec920f3ed4bfc5a48400c5 929B
folder
ea 文件夹
file
b616f0e8f4487791d50e620e6df67037c621da 57B
folder
2e 文件夹
file
721e1833f03bb0e1b962a84491d7e43e3fef9c 753B
folder
ce 文件夹
file
8c1f4c9f9adc006505e1d58a5c98537c3db970 290B
folder
4f 文件夹
file
72b2959c271cea3552d037329131a0c55e16fe 131B
folder
8a 文件夹
file
837dac37b69a9c4aec19d9e256ebb067dd2402 140B
folder
83 文件夹
file
9abf237b477bbb4e82708ee5fe085297a41b0a 178B
folder
00 文件夹
file
ed571f85ea3b3e7a71a06d1d849bd061acd1b1 323B
folder
95 文件夹
file
bf7f42b7757b3076a7d2f5afc476488f6613e0 59B
folder
f5 文件夹
file
6d2f3bb56e8474d49393008be744986bd41c3c 719B
folder
e5 文件夹
file
840b2f6b7a5bd17febcd642cf68bff1915ff04 60B
folder
3f 文件夹
file
35d8a76c173ec4fc8b00516d905531adcd0e72 234B
folder
54 文件夹
file
8be297029868413991b7e0290282b3de1fa2dd 95B
folder
35 文件夹
file
f5bdd80fef4cf5c9e5e6ae8f2a9efc801df26b 916B
folder
11 文件夹
file
8c98f7461bf98b2bc7e061150d8021121ad277 161B
folder
80 文件夹
file
1dbe3896eb28e139bc38e94f24e5c64dda8b85 271B
folder
0c 文件夹
file
7aecfa0c820b484e657bf25b06d16efbc93250 182B
folder
73 文件夹
file
ddbc81dc39a90d9eb44ff974c122f4b5d11c81 467B
folder
b5 文件夹
file
0f38c6347064ddc51c0f235af99de93438e3bb 51B
folder
98 文件夹
file
58ce0432f32dee64331f4059b6606c12fd10f6 3KB
file
HEAD 23B
file
description 73B
file
config 144B
file
index 2KB
folder
refs 文件夹
folder
tags 文件夹
folder
heads 文件夹
file
master 41B
file
COMMIT_EDITMSG 15B
folder
hooks 文件夹
file
README.sample 177B
folder
logs 文件夹
file
HEAD 161B
folder
refs 文件夹
folder
heads 文件夹
file
master 161B
folder
DonutDemo 文件夹
file
main.m 336B
file
ViewController.m 789B
file
AppDelegate.h 279B
file
Info.plist 1KB
file
AppDelegate.m 2KB
file
MyProgressView.m 12KB
file
MyProgressView.h 2KB
file
ViewController.h 217B
folder
Base.lproj 文件夹
file
LaunchScreen.storyboard 2KB
file
Main.storyboard 2KB
folder
Assets.xcassets 文件夹
folder
AppIcon.appiconset 文件夹
file
Contents.json 585B
folder
DonutDemo.xcodeproj 文件夹
folder
project.xcworkspace 文件夹
file
contents.xcworkspacedata 154B
folder
xcuserdata 文件夹
folder
zhaowl.xcuserdatad 文件夹
file
UserInterfaceState.xcuserstate 12KB
file
project.pbxproj 16KB
folder
xcuserdata 文件夹
folder
zhaowl.xcuserdatad 文件夹
folder
xcschemes 文件夹
file
DonutDemo.xcscheme 4KB
file
xcschememanagement.plist 571B
folder
DonutDemoTests 文件夹
file
DonutDemoTests.m 907B
file
Info.plist 733B
...
zip 文件大小:58.5KB