ios 温度计的实现

效果图：

主要代码：

继承于UIView进行的封装

ThermometerView.h

#import <UIKit/UIKit.h>

@interface ThermometerView : UIView
@property(nonatomic,unsafe_unretained)CGFloat minimumValue;//最小值
@property(nonatomic,unsafe_unretained)CGFloat maximumValue;//最大值
@property(nonatomic,unsafe_unretained)int bigScaleNumber;//大刻度的个数
@property(nonatomic,unsafe_unretained)int smallScaleNumber;//小刻度的个数
@property(nonatomic,unsafe_unretained)int bigScaleLength;//大刻度长度
@property(nonatomic,unsafe_unretained)int smallScaleLength;//小刻度长度
@property(nonatomic,unsafe_unretained)CGFloat defaultDegree;//默认度数
@property(nonatomic,unsafe_unretained)CGFloat waterColumnWidth;//水柱的宽度
@property(nonatomic,unsafe_unretained)CGFloat arcDiameter;//底部圆直径
@property(nonatomic,strong)UIColor *waterColor;//水柱的颜色
@property(nonatomic,strong)UIColor *waterBgColor;//水柱背景的颜色
@property(nonatomic,strong)UIColor *zeroDegreeTextColor;//0度文字颜色
-(void)setDegree:(CGFloat)degree;
@end

ThermometerView.m

#import "ThermometerView.h"

@interface ThermometerView () {
    int _allScaleNumber;//所有刻度的个数
    CGFloat _range;//最大值到最小值的范围
    CGFloat _smallScaleInterval;//小刻度的间隔
    CGFloat _bigScaleInterval;//大刻度的间隔
    CGFloat _chartHeight;//表的高度
    CGFloat _top;//表距离顶部的距离
}

@property (nonatomic, strong) NSMutableArray *Scales;
@property (nonatomic, strong) UIView *waterColumnV;
@property (nonatomic, strong) UIView *waterColumnViewBg;

@end

@implementation ThermometerView
- (void)awakeFromNib {
    [super awakeFromNib];
    [self commonInit];
}

-(instancetype)init {
    if (self = [super init]) {
        [self commonInit];
    }
    return self;
}
- (instancetype)initWithCoder:(NSCoder *)coder
{
    self = [super initWithCoder:coder];
    if (self) {
        [self commonInit];
    }
    return self;
}
-(instancetype)initWithFrame:(CGRect)frame {
    self = [super initWithFrame:frame];
    if (self) {
        [self commonInit];
    }
    return self;
}

-(void)commonInit{
    self.bigScaleNumber = 17;
    self.smallScaleNumber = 5;
    self.bigScaleLength = 20;
    self.smallScaleLength = 10;
    self.defaultDegree = -10.5;
    self.maximumValue = 80;
    self.minimumValue = -80;
    self.waterColumnWidth = 10;
    self.arcDiameter = 40;
    self.waterColor = [UIColor redColor];
    self.waterBgColor = [UIColor whiteColor];
    self.zeroDegreeTextColor = [UIColor redColor];
}


-(void)drawRect:(CGRect)rect {
    for (UIView *view in self.subviews) {
        [view removeFromSuperview];
    }
    [self setMax:self.maximumValue Min:self.minimumValue];
    CGFloat width  = rect.size.width;
    CGFloat height  = rect.size.height;
    CGFloat xLeft = width/2-self.waterColumnWidth/2;
    CGFloat xRight = width/2+self.waterColumnWidth/2;
    _top = 20;
    _chartHeight = height -self.arcDiameter - _top;
    _allScaleNumber = (self.bigScaleNumber - 1)*(self.smallScaleNumber + 1);
    _smallScaleInterval = _chartHeight / _allScaleNumber;
    
    self.waterColumnV = [[UIView alloc]initWithFrame:CGRectMake(xLeft, _top, self.waterColumnWidth, height-self.arcDiameter-_top+self.waterColumnWidth/2)];
    self.waterColumnV.backgroundColor = self.waterColor;
    [self addSubview:self.waterColumnV];
    
    self.waterColumnViewBg = [[UIView alloc]initWithFrame:self.waterColumnV.bounds];
    self.waterColumnViewBg.backgroundColor = self.waterBgColor;
    [self.waterColumnV addSubview:self.waterColumnViewBg];
    
    UIBezierPath * path = [UIBezierPath bezierPath];
    [[UIColor blackColor] set];
    path.lineWidth = 1;
    
    [path moveToPoint:CGPointMake(xLeft, _top)];
    [path addLineToPoint:CGPointMake(xLeft, height-self.arcDiameter)];

    [path moveToPoint:CGPointMake(xRight, _top)];
    [path addLineToPoint:CGPointMake(xRight, height-self.arcDiameter)];

    [self.waterColor set];
    UIBezierPath *arcPath = [UIBezierPath bezierPath];
    [arcPath addArcWithCenter:CGPointMake(width/2, height-self.arcDiameter/2) radius:self.arcDiameter/2 startAngle:0 endAngle:2*M_PI clockwise:YES];
    [arcPath fill];
    [[UIColor blackColor] set];

    for(int i=0;i<=_allScaleNumber;i++){
        CGFloat y = _smallScaleInterval*i+_top;
        if(i%(self.smallScaleNumber+1)==0){
            
            NSString *text = [NSString stringWithFormat:@"%@",self.Scales[i/(self.smallScaleNumber+1)]];
            
            [self drawText:text rect:CGRectMake(0, _smallScaleInterval*i-7+_top, xLeft-self.bigScaleLength, 20) alignment:NSTextAlignmentRight];
            
            [path moveToPoint:CGPointMake(xLeft, y)];
            [path addLineToPoint:CGPointMake(xLeft-self.bigScaleLength, y)];
            
            [self drawText:text rect:CGRectMake(xRight+self.bigScaleLength, _smallScaleInterval*i-7+_top, xLeft-self.bigScaleLength, 20) alignment:NSTextAlignmentLeft];

            [path moveToPoint:CGPointMake(xRight, y)];
            [path addLineToPoint:CGPointMake(xRight+self.bigScaleLength, y)];
            
        }else{
            
            [path moveToPoint:CGPointMake(xLeft, y)];
            [path addLineToPoint:CGPointMake(xLeft-self.smallScaleLength, y)];
            
            [path moveToPoint:CGPointMake(xRight, y)];
            [path addLineToPoint:CGPointMake(xRight+self.smallScaleLength, y)];
        }
    }
    [path stroke];
    
    [self setDegree:self.defaultDegree];
}

-(void)drawText:(NSString *)text rect:(CGRect)rect alignment:(NSTextAlignment)alignment{
    UIColor *color;
    if ([text isEqualToString:@"0"]) {
        color = self.zeroDegreeTextColor;
    }else {
        color = [UIColor blackColor];
    }
    NSMutableParagraphStyle *paragraphStyle = [[NSMutableParagraphStyle defaultParagraphStyle] mutableCopy];
    paragraphStyle.lineBreakMode = NSLineBreakByWordWrapping;
    paragraphStyle.alignment = alignment;
    [text drawInRect:rect withAttributes: @{NSFontAttributeName:[UIFont systemFontOfSize:12],NSParagraphStyleAttributeName:paragraphStyle, NSForegroundColorAttributeName:color}];
    [[UIColor blackColor] set];
}

-(void)setDegree:(CGFloat)degree {
    [UIView animateWithDuration:0.3 animations:^(void){
        CGFloat s = _range-(degree-self.minimumValue);
        CGRect rect = self.waterColumnViewBg.frame;
        rect.size.height = (_chartHeight/_range)*s;
        self.waterColumnViewBg.frame = rect;
    }];
}

-(void)setMax:(int)max Min:(int)min {
    _range = max - min;
   _bigScaleInterval = _range/(self.bigScaleNumber-1);
   self.Scales = [NSMutableArray array];
   for (int i=self.bigScaleNumber-1; i>=0; i--) {
        [self.Scales addObject:@(min+_bigScaleInterval*i)];
    }
}
@end

使用：

我的业余技术微信公众号：YKJGZH，欢迎大家进入