【iOS】星星评分控件HGDQStars

项目中需要使用星星评分，一种模式是只显示分数，一种是还可以用户评分。在空闲之余就把原来的控件加了一些自己的改造。弄出来了现在的这星星评分控件。

首先看看控件的使用：

////  ViewController.m//  HGDQStars////  Created by zhuming on 16/2/22.//  Copyright © 2016年 zhuming. All rights reserved.//#import "ViewController.h"#import "HGDQStars.h"@interface ViewController ()<StarRatingViewDelegate>@end@implementation ViewController- (void)viewDidLoad {    [super viewDidLoad];            HGDQStars *view = [[HGDQStars alloc] initWithFrame:CGRectMake(100, 100, 100, 20) currentScore:3 delegate:self];    [self.view addSubview:view];        // Do any additional setup after loading the view, typically from a nib.}- (void)starRatingView:(HGDQStars *)view score:(CGFloat)score{    NSLog(@"score = %f",score);}- (void)didReceiveMemoryWarning {    [super didReceiveMemoryWarning];    // Dispose of any resources that can be recreated.}@end

使用比之前的简单了一点。

效果图

控件的实现原理：

1.准备，灰色和红色的两种切图

2.制作一个底部的灰色全五星的视图和一个红色红色五星的视图。

/** *  生成基本控件 * *  @param imageName 图片名 * *  @return 控件 */- (HGDQStars *)initStarViewWithImageName:(NSString *)imageName{    CGRect frame = self.bounds;    HGDQStars *view = [[HGDQStars alloc] init];    view.frame = frame;    view.clipsToBounds = YES;    for (int i = 0; i < self.maxScore; i ++)    {        UIImageView *imageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:imageName]];        imageView.frame = CGRectMake(i * frame.size.width / self.maxScore, 0, frame.size.width / self.maxScore, frame.size.height);        [view addSubview:imageView];    }    return view;}

把着两个基本视图都加在在HGDQStara上。

3.改变分数的实现

改变分时实际上是改变上面红色星星的frame的宽度

/** *  改变分数 * *  @param point 分数 */- (void)changeStarForegroundViewWithPoint:(CGPoint)point{    if (point.x < 0)    {        point.x = 0;    }    else if (point.x > self.frame.size.width)    {        point.x = self.frame.size.width;    }        NSString * str = [NSString stringWithFormat:@"%0.2f",point.x / self.frame.size.width];    float score = [str floatValue];    point.x = score * self.frame.size.width;    self.fullStarsView.frame = CGRectMake(0, 0, point.x, self.frame.size.height);        if(self.delegate && [self.delegate respondsToSelector:@selector(starRatingView: score:)])    {        [self.delegate starRatingView:self score:score];    }}

4.怎么设置初始分数呢？

也就是实现score的setter方法

/** *  setter方法 * *  @param score score description */-(void) setScore:(CGFloat) score{    float width = score/self.maxScore;        self.fullStarsView.frame = CGRectMake(0, 0, self.frame.size.width * width, self.frame.size.height);}

在这里面也是个改变红色星星的frame的宽度值。

5.怎么实现滑动改变分数呢？

重写一下这个方法，

<span style="font-size:14px;">- (void)touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event</span>

在这个方法里面实现改变分值的动作

/** *  触摸事件 * *  @param touches touches description *  @param event   event description */- (void)touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event{    self.fullStarsView.hidden = NO;        if (self.enable) {        UITouch *touch = [touches anyObject];        CGPoint point = [touch locationInView:self];        CGRect rect = CGRectMake(0, 0, self.frame.size.width, self.frame.size.height);        if(CGRectContainsPoint(rect,point))        {            [self changeStarForegroundViewWithPoint:point];        }    }}

6.增加一个分数改变时的代理

- (void)starRatingView:(HGDQStars *)view score:(CGFloat)score

在公司不能上传文件，这里，贴上空间的全部代码，以后在弄到我的github上面去。

HGDQStars.m

////  HGDQStars.m//  HGDQStars////  Created by zhuming on 16/2/22.//  Copyright © 2016年 zhuming. All rights reserved.//#import "HGDQStars.h"@interface HGDQStars ()/** *  高亮星星 */@property (nonatomic,strong)UIView *fullStarsView;/** *  灰色星星 */@property (nonatomic,strong)UIView *emptyStarsView;/** *  星星控件的满分值 */@property (nonatomic,assign)CGFloat maxScore;/** *  是否可以滑动评分  YES:可以  NO:不可以 */@property (nonatomic, assign) BOOL enable;/** *  设置分值 */@property (nonatomic,assign)CGFloat score;@end@implementation HGDQStars/** *  重写父类的init方法 * *  @param frame                  星星控件的frame *  @param currentScore           当前的分值 *  @param starRatingViewDelegate 代理 * *  @return 星星控件 */- (instancetype)initWithFrame:(CGRect)frame currentScore:(CGFloat)currentScore delegate:(id)starRatingViewDelegate{    self = [super initWithFrame:frame];    if (self) {        [self initView];        self.score = currentScore; // 星星控件的当前分值        if (starRatingViewDelegate) { // 是否关联带来            self.delegate = starRatingViewDelegate;            self.enable = YES; // 是否允许滑动        }    }    return self;}/** *  初始化视图 */- (void)initView{    self.maxScore = 5;    self.fullStarsView = [self initStarViewWithImageName:@"icon_fullstar"];    self.emptyStarsView = [self initStarViewWithImageName:@"icon_emptystar"];        [self addSubview:self.emptyStarsView];    [self addSubview:self.fullStarsView];}/** *  生成基本控件 * *  @param imageName 图片名 * *  @return 控件 */- (HGDQStars *)initStarViewWithImageName:(NSString *)imageName{    CGRect frame = self.bounds;    HGDQStars *view = [[HGDQStars alloc] init];    view.frame = frame;    view.clipsToBounds = YES;    for (int i = 0; i < self.maxScore; i ++)    {        UIImageView *imageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:imageName]];        imageView.frame = CGRectMake(i * frame.size.width / self.maxScore, 0, frame.size.width / self.maxScore, frame.size.height);        [view addSubview:imageView];    }    return view;}/** *  触摸事件 * *  @param touches touches description *  @param event   event description */- (void)touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event{    self.fullStarsView.hidden = NO;        if (self.enable) {        UITouch *touch = [touches anyObject];        CGPoint point = [touch locationInView:self];        CGRect rect = CGRectMake(0, 0, self.frame.size.width, self.frame.size.height);        if(CGRectContainsPoint(rect,point))        {            [self changeStarForegroundViewWithPoint:point];        }    }}/** *  改变分数 * *  @param point 分数 */- (void)changeStarForegroundViewWithPoint:(CGPoint)point{    if (point.x < 0)    {        point.x = 0;    }    else if (point.x > self.frame.size.width)    {        point.x = self.frame.size.width;    }        NSString * str = [NSString stringWithFormat:@"%0.2f",point.x / self.frame.size.width];    float score = [str floatValue];    point.x = score * self.frame.size.width;    self.fullStarsView.frame = CGRectMake(0, 0, point.x, self.frame.size.height);        if(self.delegate && [self.delegate respondsToSelector:@selector(starRatingView: score:)])    {        [self.delegate starRatingView:self score:score];    }}/** *  setter方法 * *  @param score score description */-(void) setScore:(CGFloat) score{    float width = score/self.maxScore;        self.fullStarsView.frame = CGRectMake(0, 0, self.frame.size.width * width, self.frame.size.height);}/*// Only override drawRect: if you perform custom drawing.// An empty implementation adversely affects performance during animation.- (void)drawRect:(CGRect)rect {    // Drawing code}*/@end

HGDQStars.h

////  HGDQStars.h//  HGDQStars////  Created by zhuming on 16/2/22.//  Copyright © 2016年 zhuming. All rights reserved.//#import <UIKit/UIKit.h>@class HGDQStars;@protocol StarRatingViewDelegate <NSObject>@optional/** *  代理方法 * *  @param view  星星视图 *  @param score 当前分值 */-(void)starRatingView:(HGDQStars *)view score:(CGFloat)score;@end@interface HGDQStars : UIView/** *  重写父类的init方法 * *  @param frame                  星星控件的frame *  @param currentScore           当前的分值 *  @param starRatingViewDelegate 代理 * *  @return 星星控件 */- (instancetype)initWithFrame:(CGRect)frame currentScore:(CGFloat)currentScore delegate:(id)starRatingViewDelegate;@property (nonatomic, weak) id <StarRatingViewDelegate> delegate;@end