ios 扇形 按钮_IOS 开发中画扇形图实例详解
IOS 开发中画扇形图实例详解
昨天在做项目中,遇到一个需要显示扇形图的功能,网上搜了一下,发现code4app里面也没有找到我想要的那种类似的效果,没办法了,只能自己学习一下如何画了。
首先我们需要了解一个uiview的方法
-(void)drawRect:(CGRect)rect
我们知道了这个方法,就可以在自定义UIView的子类的- (void)drawRect:(CGRect)rect里面绘图了,关于drawrect的调用周期,网上也是一找一大堆,等下我会整理一下,转载一篇供你们参考。
废话少说,下面直接开始代码
首先我们自定义一个继承字uiview的子类,我这里就起名字叫pieview了
首先我们试试先画一个圆
#import "pieview.h"
//直径,其实radius是半径的意思吧,哈哈 算了先用着,demo都写好了就不改了,你们知道就行了
#define radius 50
@implementation pieview
-(void)drawRect:(CGRect)rect
{
CGContextRef ctx = UIGraphicsGetCurrentContext();//获取图形上下文
CGPoint cent=CGPointMake((self.frame.size.width/2)-radius/2, (self.frame.size.height/2)-radius/2);//设置图形开始画的坐标原点,根据实际需要设置,我这是随便写的
CGContextAddEllipseInRect(ctx, CGRectMake(cent.x, cent.y, 100, 100));这个是核心函数,在这里设置图形的开始从哪里画,画的宽度和高度是多少。如果宽高不一样 可就是椭圆了啊
[[UIColor greenColor] set];//设置颜色
CGContextFillPath(ctx);//实心的
//CGContextStrokePath(ctx);空心的
}
@end
然后我们创建一个控制器 pieViewController 引用我们的pieview,展示一下效果
#import "pieViewController.h"
//#import "myview.h"
//#import "JYpieview.h"
#import "pieview.h"
@interface pieViewController ()
@end
@implementation pieViewController
- (void)viewDidLoad {
[super viewDidLoad];
pieview *view=[[pieview alloc]init];
view.frame=CGRectMake(4, 150, 150, 300);
[self.view addSubview:view];
}
- (void)didReceiveMemoryWarning {
[super didReceiveMemoryWarning];
// Dispose of any resources that can be recreated.
}
@end
好了看一下效果吧
好了,下面让我们开始扇形图的制作吧
#import "pieview.h"
//直径
#define radius 50
#define PI 3.14159265358979323846
@implementation pieview
//计算度转弧度
static inline float radians(double degrees) {
return degrees * PI / 180;
}
-(void)drawRect:(CGRect)rect
{
CGPoint cent=CGPointMake((self.frame.size.width/2)-radius/2, (self.frame.size.height/2)-radius/2);
CGContextRef ctx = UIGraphicsGetCurrentContext();
CGContextClearRect(ctx, rect);
float angle_start = radians(0.0);
float angle_end = radians(120.0);
CGContextMoveToPoint(ctx, cent.x, cent.y);
CGContextSetFillColor(ctx, CGColorGetComponents( [[UIColor greenColor] CGColor]));
CGContextAddArc(ctx, cent.x, cent.y, radius, angle_start, angle_end, 0);
CGContextFillPath(ctx);
angle_start = angle_end;
angle_end = radians(360.0);
CGContextMoveToPoint(ctx, cent.x, cent.y);
CGContextSetFillColor(ctx, CGColorGetComponents( [[UIColor blueColor] CGColor]));
CGContextAddArc(ctx, cent.x, cent.y, radius, angle_start, angle_end, 0);
CGContextFillPath(ctx);
}
@end
在运行一下,我们看下效果
可使有没有觉得上面的代码很多重复的?对的,我们可以封装一个方法 那么重构后的代码我就一次性的贴上去了
#import "pieview.h"
//直径
#define radius 50
#define PI 3.14159265358979323846
@implementation pieview
//计算度转弧度
static inline float radians(double degrees) {
return degrees * PI / 180;
}
static inline void drawArc(CGContextRef ctx, CGPoint point, float angle_start, float angle_end, UIColor* color) {
CGContextMoveToPoint(ctx, point.x, point.y);
CGContextSetFillColor(ctx, CGColorGetComponents( [color CGColor]));
CGContextAddArc(ctx, point.x, point.y, radius, angle_start, angle_end, 0);
//CGContextClosePath(ctx);
CGContextFillPath(ctx);
}
-(void)drawRect:(CGRect)rect
{
CGPoint cent=CGPointMake((self.frame.size.width/2)-radius/2, (self.frame.size.height/2)-radius/2);
CGContextRef ctx = UIGraphicsGetCurrentContext();
CGContextClearRect(ctx, rect);
float angle_start = radians(0.0);
float angle_end = radians(121.0);
drawArc(ctx, cent, angle_start, angle_end, [UIColor yellowColor]);
angle_start = angle_end;
angle_end = radians(228.0);
drawArc(ctx, cent, angle_start, angle_end, [UIColor greenColor]);
angle_start = angle_end;
angle_end = radians(260);
drawArc(ctx, cent, angle_start, angle_end, [UIColor orangeColor]);
angle_start = angle_end;
angle_end = radians(360);
drawArc(ctx, cent, angle_start, angle_end, [UIColor purpleColor]);
}
@end
看下运行效果图
如果我们中途数据变了 想要改一下图形怎么办呢?
那么我们就需要用到这个
//通知自定义的view重新绘制图形
// [self setNeedsDisplay];
这时候我们就要pieview向外界提供一个接口属性,这是我做的模拟5面之后改变圆形的直径大小
.h文件
#import
@interface pieview : UIView
//直径
@property(nonatomic,assign)float radius;
@end
.m文件
#import "pieview.h"
#define PI 3.14159265358979323846
@implementation pieview
//计算度转弧度
static inline float radians(double degrees) {
return degrees * PI / 180;
}
static inline void drawArc(CGContextRef ctx, CGPoint point, float angle_start, float angle_end, UIColor* color,float radius) {
CGContextMoveToPoint(ctx, point.x, point.y);
CGContextSetFillColor(ctx, CGColorGetComponents( [color CGColor]));
CGContextAddArc(ctx, point.x, point.y, radius, angle_start, angle_end, 0);
//CGContextClosePath(ctx);
CGContextFillPath(ctx);
}
-(void)drawRect:(CGRect)rect
{
CGPoint cent=CGPointMake((self.frame.size.width/2)-self.radius/2, (self.frame.size.height/2)-self.radius/2);
CGContextRef ctx = UIGraphicsGetCurrentContext();
CGContextClearRect(ctx, rect);
float angle_start = radians(0.0);
float angle_end = radians(121.0);
drawArc(ctx, cent, angle_start, angle_end, [UIColor yellowColor],self.radius);
angle_start = angle_end;
angle_end = radians(228.0);
drawArc(ctx, cent, angle_start, angle_end, [UIColor greenColor],self.radius);
angle_start = angle_end;
angle_end = radians(260);
drawArc(ctx, cent, angle_start, angle_end, [UIColor orangeColor],self.radius);
angle_start = angle_end;
angle_end = radians(360);
drawArc(ctx, cent, angle_start, angle_end, [UIColor purpleColor],self.radius);
}
-(void)setRadius:(float)radius
{
_radius=radius;
[self setNeedsDisplay];
}
@end
pieViewController.m文件
@implementation pieViewController
- (void)viewDidLoad {
[super viewDidLoad];
pieview *view=[[pieview alloc]init];
view.radius=50;
view.frame=CGRectMake(4, 150, 150, 300);
[self.view addSubview:view];
//view.backgroundColor=[UIColor clearColor];
//模拟5秒后执行这个段代码
dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(5.0 * NSEC_PER_SEC)), dispatch_get_main_queue(), ^{
view.radius=20;
});
}
- (void)didReceiveMemoryWarning {
[super didReceiveMemoryWarning];
// Dispose of any resources that can be recreated.
}
@end
效果
5秒之后
感谢阅读,希望能帮助到大家,谢谢大家对本站的支持!
ios 扇形 按钮_IOS 开发中画扇形图实例详解相关推荐
- ios 扇形 按钮_iOS开发教程之扇形动画的实现
前言 最近比较闲,正好利用这段时间把现在项目用的东西封装一下,方便以后复用,当然好的东西还是要分享.一起学习,一起进步. 看图片,很显然这是一个扇形图,相信大家对做扇形图得心应手,可能对做扇形动画有一 ...
- 开发中避免延时操作技巧详解
这篇文章主要为大家介绍了开发中避免延时操作技巧详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪 前言 开发中我们或多或少会涉及到一些场景需要使用延时操作,而延时操作其实 ...
- java开发中常用的Git命令详解
java开发中常用的Git命令详解(IDEA内如何操作) 一:写这篇文章的目的是什么? 二:使用场景在哪里? 1:当我们要使用idea去git仓库拉代码时,首先我们的idea得配置git工具 2:项目 ...
- c语言二级指针有什么作用,C语言中二级指针的实例详解
C语言中二级指针的实例详解 C语言中二级指针的实例详解 用图说明 示例代码: #include int main(int argc, const char * argv[]) { // int a = ...
- silverlight mysql_Silverlight中衔接MySQL数据库实例详解
Silverlight中衔接MySQL数据库实例详解 日期:2010年5月25日 作者: 本文将重点讲述Silverlight中衔接MySQL数据库实例,这在RIA开发中比拟根底,但是也是比拟首要的内 ...
- android mvp模式例子_Android中mvp模式使用实例详解
MVP 是从经典的模式MVC演变而来,它们的基本思想有相通的地方:Controller/Presenter负责逻辑的处理,Model提供数据,View负 责显示.作为一种新的模式,MVP与MVC有着一 ...
- java 静态 编译_Java中的动态和静态编译实例详解
Java中的动态和静态编译实例详解 首先,我们来说说动态和静态编译的问题. Q: java和javascript有什么区别? 总结了一下:有以下几点吧: 1.首先从运行环境来说java代码是在JVM上 ...
- python编程字典100例_python中字典(Dictionary)用法实例详解
本文实例讲述了python中字典(Dictionary)用法.分享给大家供大家参考.具体分析如下: 字典(Dictionary)是一种映射结构的数据类型,由无序的"键-值对"组成. ...
- php 递归中的全局变量,PHP中递归的实现实例详解
递归的定义 递归(http:/en.wikipedia.org/wiki/Recursive)是一种函数调用自身(直接或间接)的一种机制,这种强大的思想可以把某些复杂的概念变得极为简单.在计算机科学之 ...
最新文章
- 10个顶级的CSS UI开源框架
- 秘鲁农业功臣-国际农民丰收节贸易会:蔬菜用广州话发音
- php xml表格形式输出,PHP XML如何输出nice格式
- 安装tensorflow出现超时,找不到指定模+python 各个指定版本安装
- Hook 迅游手游加速器
- MarkDown 标题居中
- unity剩余高度自适应实现办法
- Windows 10 D盘操作需要管理员权限
- ANO Tech 匿名四轴 制作分享
- STM32 高级定时器周期、频率、占空比、对外输出电压详解
- r语言list 转换成 vector
- HAUT 1262 魔法宝石 (最短路变形 or 暴力)
- Python3爬取英雄联盟英雄皮肤大图
- 创业故事:记YouTube创始人陈士骏,选择满意工作,让自己人生无悔
- 编译器会为const引用创建临时变量
- python到pandas_Python-Pandas
- python模拟乘客进站流程
- android studio “leaked window“ 错误
- 2022-2028年中国古玩行业市场运营格局及投资前景趋势报告
- MyKtv点歌系统前台主要功能实现,内附数据库脚本,可以直接运行
热门文章
- 计算机组装兴趣小组考核,中职计算机专业课程学生成绩考核之我见
- SRPG游戏开发(五)第三章 绘制地图 - 二 绘制一张简单地图
- windows android双系统,劲爆!Windows与Android双系统成功合体
- 阿里云2023届实习生招聘启动啦,快来加入IoT安全吧
- 机器学习笔记 - JigsawNet论文解读
- 从国外的网站上下载包很慢的解决办法
- java将office文件转化为PDF(含PPT、Excel、word)
- 如何生成github上的动态gif图
- HTML期末学生大作业-在线电影网站html+css+javascript
- Win10打开图片需要使用新应用以打开此ms-paint链接是什么意思?