工作需要,最近在進(jìn)行iOS方面的圖表工作。找了很多第三方庫都無法實現(xiàn)效果,所以決定自己寫一個控件。
希望可以寫一個通用的圖表控件(僅針對此項目),雖然開發(fā)難度增大,但是可以學(xué)習(xí)到很多知識。并且控件使用簡單,可以自適應(yīng)大小,支持屏幕旋轉(zhuǎn)。
創(chuàng)建自定義控件,繼承自UIView。
//// LGChartView.h//// Created by Luna Gao on 15/10/29.// Copyright © 2015年 All rights reserved.//#import <UIKit/UIKit.h>@interface LGChartView : UIView - (instancetype)initWithParentView:(UIView*) view;@end
//// LGChartView.m//// Created by Luna Gao on 15/10/29.// Copyright © 2015年 All rights reserved.//#import "LGChartView.h"@implementation LGChartViewUIView *parentView;- (instancetype)initWithParentView:(UIView*) view { parentView = view; return [self init];}- (instancetype)init{ return [self initWithFrame: CGRectZero];}- (instancetype)initWithFrame:(CGRect)frame{ frame = CGRectMake(0, 0, parentView.frame.size.width, parentView.frame.size.height); self = [super initWithFrame:frame]; if (self) { self.backgroundColor = [UIColor clearColor]; self.autoresizesSubviews = YES; self.autoresizingMask = UIViewAutoresizingFlexibleHeight | UIViewAutoresizingFlexibleWidth; } return self;}-(void)layoutSubviews { [self setNeedsDisplay];}- (void)drawRect:(CGRect)rect { CGContextRef context = UIGraphicsGetCurrentContext(); CGContextSetRGBStrokeColor(context, 0.0f, 0.0f, 0.0f, 1);//線條顏色 CGContextMoveToPoint(context, CGRectGetMinX(self.frame), CGRectGetMaxY(self.frame) - 16); CGContextAddLineToPoint(context, CGRectGetMaxX(self.frame), CGRectGetMaxY(self.frame) - 16); CGContextStrokePath(context); CGContextSetLineWidth(context, 1.0);}@end
其中initWithParentView方法將父View傳入進(jìn)來,通過父View的大小來確定我們自定義控件的大小。我對于此處感覺有點怪怪的,雖然是我想到的解決方案···
其中
self.autoresizesSubviews = YES;self.autoresizingMask = UIViewAutoresizingFlexibleHeight | UIViewAutoresizingFlexibleWidth;
這兩句尤為重要,這兩句代碼保證了在頁面橫屏豎屏切換時,控件會隨著屏幕中父View的大小改變而我們的自定義控件跟著改變。
下面這個方法
-(void)layoutSubviews { [self setNeedsDisplay];}
保證了在頁面橫屏豎屏切換時,自定義控件可以跟隨刷新。
最后的drawRect方法,我將所有的繪制圖形的功能全部交給了它。
這一步已經(jīng)非常的簡單了。
在storyboard創(chuàng)建一個ViewController,在其中放入一個UIView,這個UIView決定了自定義控件在界面中的顯示位置和大小,并在其相關(guān)聯(lián)的ChartViewController中獲取。至此,storyboard的工作完成。
//// ChartViewController.h//// Created by Luna Gao on 15/10/29.// Copyright © 2015年 All rights reserved.//#import <UIKit/UIKit.h>#import "LGChartView.h"@interface ChartViewController : UIViewController@PRoperty (weak, nonatomic) IBOutlet UIView *chartView;@end
下一步,在此controller中引用我們寫的自定義控件,并且將自定義控件的父類交給剛剛引用的UIView中。
- (void)viewDidLoad { [super viewDidLoad]; LGChartView *chartControl = [[LGChartView alloc] initWithParentView:self.chartView]; [self.chartView addSubview:chartControl];}
剩下的,就什么都不用搞了···
直接跑項目看效果即可。至此,自定義控件的demo就完成了,剩下的工作就是逐步完善自定義控件,在其中加入委托等等等等。
1. 自定義控件出現(xiàn)所繪制內(nèi)容被拉伸,模糊等情況,請檢查是否在drawRect此方法中修改了自定義控件的frame.size的大小,當(dāng)然,也有可能是由于下面一條引起的。
2. 不要在自定義控件中的drawRect中調(diào)用[self setNeedsDisplay]方法,之前出現(xiàn)了眾多奇奇葩葩的報錯和問題,就是因為調(diào)用了這玩意···重要的事情說3便
3. 不要在自定義控件中的drawRect中調(diào)用[self setNeedsDisplay]方法,之前出現(xiàn)了眾多奇奇葩葩的報錯和問題,就是因為調(diào)用了這玩意···重要的事情說3便
4. 不要在自定義控件中的drawRect中調(diào)用[self setNeedsDisplay]方法,之前出現(xiàn)了眾多奇奇葩葩的報錯和問題,就是因為調(diào)用了這玩意···重要的事情說3便
如有問題,或不正確的地方,或有更好的實現(xiàn)方法,請不要吝嗇,在下面留言吧···么么噠···
新聞熱點
疑難解答