非常简单的制作图并使用UIBezierPath
画一条线首先你创建一个UIView的子类
#import <UIKit/UIKit.h>
@interface GraphView : UIView
@property(nonatomic,strong)NSMutableArray *verticalPointsMarray;
@property(nonatomic,strong)NSMutableArray *horizontalPointsMarray;
@property(nonatomic,strong)NSMutableArray *graphValueMArray;
@property(nonatomic,strong)NSMutableArray *graphPointsMArray;
@property(nonatomic,assign)NSInteger numberOfVerticlaLine;
@property(nonatomic,assign)NSInteger numberOfHorizontalLine;
@end
最后画一条线看到这段代码
// GraphView.m
// MapLocation
//
// Created by Md. Khurshid on 22/07/16.
// Copyright © 2016 Md. Khurshid. All rights reserved.
//
#import "GraphView.h"
#define LEFT_POINT @"leftPoint"
#define RIGHT_POINT @"rightPoint"
#define TOP_POINT @"topPoint"
#define BOTTOM_POINT @"bottomPoint"
#define MIN_NUMBER_OF_HORIZONTALLINE 1
#define GRAPHL_INE_COLOR colorWithRed:68/255.0 green:127/255.0 blue:200/255.0 alpha:1.0].CGColor
@implementation GraphView
{
UIBezierPath *_aPath;
}
// Only override drawRect: if you perform custom drawing.
// An empty implementation adversely affects performance during animation.
- (void)drawRect:(CGRect)rect {
self.verticalPointsMarray = [NSMutableArray new];
self.horizontalPointsMarray = [NSMutableArray new];
self.graphValueMArray = [NSMutableArray new];
//Add the graph points array You change The graph point value and graph drawing line change
[_graphValueMArray addObject:@"0"];
[_graphValueMArray addObject:@"1"];
[_graphValueMArray addObject:@"0"];
[_graphValueMArray addObject:@"2"];
[_graphValueMArray addObject:@"0"];
[_graphValueMArray addObject:@"3"];
[_graphValueMArray addObject:@"1"];
//Make a vertical point
float width = (self.frame.size.width-40)/6;
for (NSInteger i=0; i < 7; i++) {
float x_witdh = width * i;
x_witdh = x_witdh +20;
NSMutableDictionary *dictionary = [NSMutableDictionary new];
[dictionary setObject:[NSValue valueWithCGPoint:
CGPointMake(x_witdh, self.frame.size.height)]
forKey:TOP_POINT];
[dictionary setObject:[NSValue valueWithCGPoint:
CGPointMake(x_witdh,0)]
forKey:BOTTOM_POINT];
[self.verticalPointsMarray addObject:dictionary];
}
_numberOfHorizontalLine = [self maxValue:_graphValueMArray];
if (_numberOfHorizontalLine == 0) _numberOfHorizontalLine = MIN_NUMBER_OF_HORIZONTALLINE;
float height = self.frame.size.height /_numberOfHorizontalLine;
//Make a horizontal point
for (NSInteger i=0; i <= _numberOfHorizontalLine; i++) {
float y_height = height * i;
if (i == 0) y_height = y_height + 1;
if (i == _numberOfHorizontalLine && i != 0) y_height = y_height - 1;
NSMutableDictionary *dictionary = [NSMutableDictionary new];
[dictionary setObject:[NSValue valueWithCGPoint:
CGPointMake(self.frame.size.width- 20,y_height)]
forKey:LEFT_POINT];
[dictionary setObject:[NSValue valueWithCGPoint:
CGPointMake(20,y_height)]
forKey:RIGHT_POINT];
[self.horizontalPointsMarray addObject:dictionary];
}
[self drawVerticaLine];
[self drawHorizontalLine];
[self drawGraphLine];
}
- (void)drawVerticaLine {
_aPath = [UIBezierPath bezierPath];
NSInteger dayArrayIndex = _verticalPointsMarray.count;
NSArray *dayArray = [self getShortedDay];
for (NSInteger i=0; i < self.verticalPointsMarray.count ; i++) {
NSDictionary *dictionary = [_verticalPointsMarray objectAtIndex:i];
NSValue *value;
value = [dictionary objectForKey:TOP_POINT];
CGPoint leftPoint = [value CGPointValue];
value = [dictionary objectForKey:BOTTOM_POINT];
CGPoint rightPoint = [value CGPointValue];
[_aPath moveToPoint:leftPoint];
if (!dayArrayIndex) {
[self addTitleLable:CGRectMake(leftPoint.x-10, leftPoint.y, 35,25) withTitle:[NSString stringWithFormat:@"%@",[dayArray objectAtIndex:--dayArrayIndex]]];
} else {
[self addTitleLable:CGRectMake(leftPoint.x-26, leftPoint.y, 50,25) withTitle:[NSString stringWithFormat:@"%@",[dayArray objectAtIndex:--dayArrayIndex]]];
}
[_aPath addLineToPoint:rightPoint];
}
_aPath.lineWidth = 1.0;
[[UIColor groupTableViewBackgroundColor] setStroke];
[_aPath stroke];
}
- (void)drawHorizontalLine {
_aPath = [UIBezierPath bezierPath];
NSInteger title = _numberOfHorizontalLine;
for (NSInteger i=0; i <= _numberOfHorizontalLine; i++) {
NSDictionary *dictionary = [_horizontalPointsMarray objectAtIndex:i];
NSValue *value;
value = [dictionary objectForKey:LEFT_POINT];
CGPoint topPoint = [value CGPointValue];
value = [dictionary objectForKey:RIGHT_POINT];
CGPoint bottomPoint = [value CGPointValue];
[_aPath moveToPoint:topPoint];
[_aPath addLineToPoint:bottomPoint];
[self addTitleLable:CGRectMake(0, bottomPoint.y-15, 20, 30) withTitle:[NSString stringWithFormat:@"%ld",title--]];
}
_aPath.lineWidth = 1.0;
[[UIColor groupTableViewBackgroundColor] setStroke];
[_aPath stroke];
}
- (void)drawGraphLine {
_aPath = [UIBezierPath bezierPath];
NSDictionary *dictionary;
NSValue *value;
NSMutableArray *mArray = [NSMutableArray new];
self.graphPointsMArray = [NSMutableArray new];
NSValue *firstPointValue;
for (NSInteger i = 0; i < _graphValueMArray.count; i++) {
NSInteger hIndex = _numberOfHorizontalLine;
for (NSInteger vIndex = 0; vIndex <= _numberOfHorizontalLine; vIndex++) {
if (vIndex == [[_graphValueMArray objectAtIndex:i]intValue]) {
dictionary = [_verticalPointsMarray objectAtIndex:i];
value = [dictionary objectForKey:BOTTOM_POINT];
CGPoint point = [value CGPointValue];
dictionary = [_horizontalPointsMarray objectAtIndex:hIndex];
value = [dictionary objectForKey:LEFT_POINT];
CGPoint point1 = [value CGPointValue];
[mArray addObject:[NSValue valueWithCGPoint:CGPointMake(point.x,point1.y)]];
if (i== 0) firstPointValue = [NSValue valueWithCGPoint:CGPointMake(point.x,point1.y)];
[_graphPointsMArray addObject:[NSValue valueWithCGPoint:CGPointMake(point.x,point1.y)]];
break;
}
hIndex = hIndex - 1;
}
if (mArray.count == 2) {
value = [mArray objectAtIndex:0];
CGPoint point1 = [value CGPointValue];
value = [mArray objectAtIndex:1];
CGPoint point2 = [value CGPointValue];
[_aPath moveToPoint:point2];
[_aPath addQuadCurveToPoint:point1 controlPoint:point2];
[mArray removeObjectAtIndex:0];
[self addPointViewWithFrame:CGRectMake(point1.x-4, point1.y-3, 8, 8)];
}
}
[_graphPointsMArray addObject:firstPointValue];
value = [mArray objectAtIndex:0];
CGPoint point = [value CGPointValue];
[self addPointViewWithFrame:CGRectMake(point.x-5, point.y-4, 10, 10)];
_aPath.lineWidth = 2.0;
[[UIColor colorWithRed:68.0/255.0 green:127.0/255.0 blue:200.0/255.0 alpha:1.0] setStroke];
[_aPath stroke];
value = [_graphPointsMArray objectAtIndex:0];
point = [value CGPointValue];
[_aPath moveToPoint:point];
for (NSInteger index=0; index < _graphPointsMArray.count; index++) {
if (index == _graphPointsMArray.count-1) {
NSDictionary *dict = [_horizontalPointsMarray lastObject];
value = [dict objectForKey:LEFT_POINT];
point = [value CGPointValue];
} else {
value = [_graphPointsMArray objectAtIndex:index];
point = [value CGPointValue];
}
[_aPath addLineToPoint:point];
}
[_aPath closePath];
CAShapeLayer *line = [CAShapeLayer layer];
line.backgroundColor = [UIColor redColor].CGColor;
line.path = [_aPath CGPath];
line.lineWidth = 0.0;
line.fillColor = [UIColor colorWithRed:68.0/255.0 green:127.0/255.0
blue:200.0/255.0 alpha:0.2].CGColor;
[[self layer] addSublayer:line];
}
- (void)addTitleLable:(CGRect)frame withTitle:(NSString *)title {
UILabel *lable = [[UILabel alloc] initWithFrame:frame];
lable.text = title;
lable.font = [UIFont systemFontOfSize:14];
lable.textAlignment = NSTextAlignmentCenter;
[self addSubview:lable];
}
- (void)addPointViewWithFrame:(CGRect)frame {
UIView *view = [UIView new];
view.frame = frame;
view.layer.masksToBounds = YES;
view.layer.cornerRadius = frame.size.height/2;
view.backgroundColor = [UIColor colorWithRed:68.0/255.0 green:127.0/255.0
blue:200.0/255.0 alpha:1.0];
[self addSubview:view];
}
- (NSArray *)getShortedDay {
NSDateFormatter *dateFormatter =[ [NSDateFormatter alloc] init];
[dateFormatter setDateFormat:@"EEE"];
NSDate *now = [NSDate date];
NSMutableArray *results = [NSMutableArray arrayWithCapacity:8];
for (int i = 0; i < 7; i++)
{
NSDate *date = [NSDate dateWithTimeInterval:-(i * (60 * 60 * 24)) sinceDate:now];
if ([[dateFormatter stringFromDate:now] isEqual:[dateFormatter stringFromDate:date]]) {
[results addObject:@"Today"];
} else {
[results addObject:[dateFormatter stringFromDate:date]];
}
}
return results;
}
// get max value
- (NSInteger )maxValue:(NSArray *)arrValue
{
float maxValue = 0.0;
for (NSInteger index=0 ;index <arrValue.count;index++) {
float compareValue = [[arrValue objectAtIndex:index] floatValue];
if (compareValue > maxValue) {
maxValue = compareValue;
}
}
return maxValue;
}
@end
设置Graph值 并构建和运行项目
self.graphValueMArray = [NSMutableArray new];
[_graphValueMArray addObject:@"0"];
[_graphValueMArray addObject:@"1"];
[_graphValueMArray addObject:@"0"];
[_graphValueMArray addObject:@"2"];
[_graphValueMArray addObject:@"0"];
[_graphValueMArray addObject:@"3"];
[_graphValueMArray addObject:@"1"];
此图表如下所示： -
再次更改值并运行项目
self.graphValueMArray = [NSMutableArray new];
[_graphValueMArray addObject:@"0"];
[_graphValueMArray addObject:@"10"];
[_graphValueMArray addObject:@"5"];
[_graphValueMArray addObject:@"7"];
[_graphValueMArray addObject:@"6"];
[_graphValueMArray addObject:@"9"];
[_graphValueMArray addObject:@"2"];
答案 0 :(得分：0)
嗨Khurshid请按照您的方法进行更正，
<强> GraphView.h
@interface GraphView : UIView
@property(nonatomic,strong)NSMutableArray *verticalPointsMarray;
@property(nonatomic,strong)NSMutableArray *horizontalPointsMarray;
@property(nonatomic,strong)NSMutableArray *graphValueMArray;
@property(nonatomic,strong)NSMutableArray *graphPointsMArray;
@property(nonatomic,assign)NSInteger numberOfVerticlaLine;
@property(nonatomic,assign)NSInteger numberOfHorizontalLine;
- (void)drawRect:(CGRect)rect withPoint:(NSMutableArray *)pointsToDraw ;
<强> GraphView.m
- (void)drawRect:(CGRect)rect withPoint:(NSMutableArray *)pointsToDraw {
self.verticalPointsMarray = [NSMutableArray new];
self.horizontalPointsMarray = [NSMutableArray new];
// self.graphValueMArray = [NSMutableArray new];
self.graphValueMArray = pointsToDraw;
//Add the graph points array You change The graph point value and graph drawing line change
// [_graphValueMArray addObject:@"0"];
// [_graphValueMArray addObject:@"1"];
// [_graphValueMArray addObject:@"0"];
// [_graphValueMArray addObject:@"2"];
// [_graphValueMArray addObject:@"0"];
// [_graphValueMArray addObject:@"3"];
// [_graphValueMArray addObject:@"1"];
方法调用将是，
self.graphView = [[GraphView alloc]initWithFrame:CGRectMake(0, 20, self.view.frame.size.width, self.view.frame.size.height-60) ];
[self.graphView drawRect:self.graphView.frame withPoint:_graphValueMArray];
[self.graphView setBackgroundColor:[UIColor greenColor]] ;
[self.graphView setGraphPointsMArray:self.graphValueMArray];
[self.view addSubview:self.graphView];
任何信息都可以随时联系