Dessiner un cercle, remplir différentes parties de couleur différente
je suis un programmeur novice ios.Dans un de mes projets j'ai besoin de dessiner un cercle dans lequel la partie différente du cercle serait remplie avec des couleurs différentes.Je peux dessiner le cercle.Mais je ne suis pas en mesure de déterminer la partie différente du cercle et de les remplir avec une couleur différente.Voici une capture d'écran pour clarifier ce que je veux dessiner.
Une aide serait appréciée.
3 réponses
vous pouvez utiliser UIBezierPath
qui a une méthode addArcWithCenter:radius:startAngle:endAngle:clockwise:
où vous pouvez spécifier le rayon, le centre et les angles. Le code pourrait ressembler à ceci qui dessine un quart de cercle en vert:
CGPoint center = CGPointMake(CGRectGetWidth(self.bounds) / 2.f, CGRectGetHeight(self.bounds) / 2.f);
CGFloat radius = center.x - 10.f;
UIBezierPath *portionPath = [UIBezierPath bezierPath];
[portionPath moveToPoint:center];
[portionPath addArcWithCenter:center radius:radius startAngle:0.f endAngle:M_PI_2 clockwise:YES];
[portionPath closePath];
[[UIColor greenColor] setFill];
[portionPath fill];
UIBezierPath *portionPath1 = [UIBezierPath bezierPath];
[portionPath1 moveToPoint:center];
[portionPath1 addArcWithCenter:center radius:radius startAngle:M_PI_2 endAngle:M_PI clockwise:YES];
[portionPath1 closePath];
[[UIColor blueColor] setFill];
[portionPath1 fill];
bien sûr, vous pouvez également envisager d'utiliser une bibliothèque comme CorePlot .
nous avons 6 Classe
CircleViewController.H, CircleViewController.m, GraphView.H, GraphView.H, CirclePart.H, CirclePart.m
CirclePart.h
#import <Foundation/Foundation.h>
#import <UIKit/UIKit.h>
@interface CirclePart : NSObject
@property (nonatomic) CGFloat startDegree;
@property (nonatomic) CGFloat endDegree;
@property (nonatomic) UIColor *partColor;
-(id)initWithStartDegree:(CGFloat)startDegree endDegree:(CGFloat)endDegree partColor:(UIColor*)partColor;
@end
CirclePart.m
#import "CirclePart.h"
@implementation CirclePart
-(id)initWithStartDegree:(CGFloat)startDegree endDegree:(CGFloat)endDegree partColor:(UIColor*)partColor
{
self = [super init];
if (self) {
self.startDegree = startDegree;
self.endDegree = endDegree;
self.partColor = partColor;
}
return self;
}
@end
GraphView.h
#import <UIKit/UIKit.h>
#import "CirclePart.h"
@interface GraphView : UIView
@property (nonatomic) CGPoint centrePoint;
@property (nonatomic) CGFloat radius;
@property (nonatomic) CGFloat lineWidth;
@property (nonatomic, strong) NSArray *circleParts;
-(id)initWithFrame:(CGRect)frame CentrePoint:(CGPoint)centrePoint radius:(CGFloat)radius lineWidth:(CGFloat)lineWidth circleParts:(NSArray*)circleParts;
@end
GraphView.m
#import "GraphView.h"
@implementation GraphView
-(id)initWithFrame:(CGRect)frame CentrePoint:(CGPoint)centrePoint radius:(CGFloat)radius lineWidth:(CGFloat)lineWidth circleParts:(NSArray*)circleParts
{
self = [super initWithFrame:frame];
if (self) {
self.centrePoint = centrePoint;
self.radius = radius;
self.lineWidth = lineWidth;
self.circleParts = circleParts;
}
return self;
}
- (void)drawRect:(CGRect)rect {
[self drawCircle];
}
- (void)drawCircle {
CGContextRef context = UIGraphicsGetCurrentContext();
CGContextSetLineWidth(context, _lineWidth);
for(CirclePart *circlePart in _circleParts)
{
CGContextMoveToPoint(context, _centrePoint.x, _centrePoint.y);
CGContextAddArc(context, _centrePoint.x , _centrePoint.y, _radius, [self radians:circlePart.startDegree], [self radians:circlePart.endDegree], 0);
CGContextSetFillColorWithColor(context, circlePart.partColor.CGColor);
CGContextFillPath(context);
}
}
-(float) radians:(double) degrees {
return degrees * M_PI / 180;
}
@end
CircleViewController.h
#import <UIKit/UIKit.h>
@interface CircleViewController : UIViewController
@end
CircleViewController.m
#import "CircleViewController.h"
#import "GraphView.h"
#import "CirclePart.h"
@interface CircleViewController ()
@end
@implementation CircleViewController
- (void)viewDidLoad {
[super viewDidLoad];
CirclePart *part1 = [[CirclePart alloc] initWithStartDegree:0 endDegree:120 partColor:[UIColor redColor]];
CirclePart *part2 = [[CirclePart alloc] initWithStartDegree:120 endDegree:250 partColor:[UIColor blueColor]];
CirclePart *part3 = [[CirclePart alloc] initWithStartDegree:250 endDegree:360 partColor:[UIColor grayColor]];
NSArray *circleParts = [[NSArray alloc] initWithObjects:part1, part2, part3, nil];
CGRect rect = CGRectMake(100, 100, 200, 200);
CGPoint circleCenter = CGPointMake(rect.size.width / 2, rect.size.height / 2);
GraphView *graphView = [[GraphView alloc] initWithFrame:rect CentrePoint:circleCenter radius:80 lineWidth:2 circleParts:circleParts];
graphView.backgroundColor = [UIColor whiteColor];
graphView.layer.borderColor = [UIColor redColor].CGColor;
graphView.layer.borderWidth = 1.0f;
[self.view addSubview:graphView];
}
- (void)didReceiveMemoryWarning {
[super didReceiveMemoryWarning];
// Dispose of any resources that can be recreated.
}
@end
c'est une simple question de trigonométrie. Déterminez l'angle dont vous avez besoin pour la portion de tarte (pourcentage de temps de tranche de tarte 360 degrés), puis vous vous déplacez au centre. Ligne au bord du cercle à un angle approprié, arc au côté suivant de la tranche de tarte pour l'angle d'arc que vous avez besoin, puis la ligne de retour au centre.
alternativement, vous pouvez utiliser CorePlot pour faire des diagrammes à secteurs pour vous .