iOS 开发技巧 - 显示评价星级

也是最近项目中要用到这个功能，就是要显示对应商品的评价星级，类似于淘宝评价星星。 我是把这个功能封装成了一个类，也方便以后其他工程可以随手拿来用。

** 1.建一个继承自UIView的类，我这里叫做YKStarView **

Snip20160514_1.png

** 2.YKStarView.h头文件内容 **

//
//  YKStarView.h
//  test
//
//  Created by 张张张小烦 on 16/5/14.
//  Copyright © 2016年 YK. All rights reserved.
//

#import 

@interface YKStarView : UIView

@property (nonatomic, assign) NSInteger maxStar;        // 最大值
@property (nonatomic, assign) NSInteger showStar;       // 显示值
@property (nonatomic, strong) UIColor *emptyColor;      // 空颜色
@property (nonatomic, strong) UIColor *fullColor;       // 满颜色


@end

** 3.在YKStarView.m 文件实现方法 **

//
//  YKStarView.m
//  test
//
//  Created by 张张张小烦 on 16/5/14.
//  Copyright © 2016年 YK. All rights reserved.
//

#import "YKStarView.h"


#define YKStarFont [UIFont systemFontOfSize:14]  // 星星size宏定义


@implementation YKStarView

- (id)initWithFrame:(CGRect)frame
{
    self = [super initWithFrame:frame];
    if (self)
    {
        self.backgroundColor = [UIColor clearColor];

        //未点亮时的颜色是 灰色的
        self.emptyColor = [UIColor grayColor];
        
        //点亮时的颜色是 亮黄色的
        self.fullColor = [UIColor orangeColor];
  
        //默认的长度设置为100
        self.maxStar = 100;
    }
    
    return self;
}

** 4.重写drawRect方法 **

- (void)drawRect:(CGRect)rect
{
    CGContextRef context = UIGraphicsGetCurrentContext();
    
    NSString* stars = @"★★★★★";

    rect = self.bounds;
    CGSize starSize = [stars sizeWithFont:YKStarFont];
    rect.size=starSize;
    [_emptyColor set];
    [stars drawInRect:rect withFont:YKStarFont];

    CGRect clip = rect;
    clip.size.width = clip.size.width * _showStar / _maxStar;
    CGContextClipToRect(context,clip);
    [_fullColor set];
    [stars drawInRect:rect withFont:YKStarFont];

}

** 5. 就是使用了，在相应位置导入头文件 #import "YKStarView.h" **

//
//  ViewController.m
//  test
//
//  Created by 张张张小烦 on 16/5/12.
//  Copyright © 2016年 YK. All rights reserved.
//

#import "ViewController.h"
#import "YKStarView.h"

@interface ViewController ()

@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    self.view.backgroundColor = [UIColor whiteColor];
    
    //评论是2.5分的
    YKStarView *svOne = [[YKStarView alloc]initWithFrame:CGRectMake(90, 90 + 40, 200, 40)];
    [self.view addSubview:svOne];
    svOne.showStar = 2.5 * 20;
    
    //评论是4.0分的
    YKStarView *svTwo = [[YKStarView alloc]initWithFrame:CGRectMake(90, 90 + 40 + 40, 200, 40)];
    [self.view addSubview:svTwo];
    svTwo.showStar = 4.0 * 20;
    
    //评论是5.0分的
    YKStarView *svThree = [[YKStarView alloc]initWithFrame:CGRectMake(90, 90 + 40 + 40 + 40, 200, 40)];
    [self.view addSubview:svThree];
    svThree.showStar = 5.0 * 20;
}

运行效果如下：

Snip20160514_3.png

又是一个简单的小技巧，当然，里面还有很多不完善，比如星星的样式，也可以使用图片，网上也有一些可以根据用户点击行为来设定星星个数的，也可以搜索学习下。