iOS 设计中-- 自定义-- 评星图标的方法

效果图：

 

 

                

 

代码实现如下：

调用部分：

 

MoreViewController.m

#import "MoreViewController.h"
#import "WXRatingView.h"//导入自定义星星类头文件
@interface MoreViewController ()

@end

@implementation MoreViewController

- (void)viewDidLoad {
    [super viewDidLoad];
        //标题
    self.title = @"更多";
        //背景色
    self.view.backgroundColor = [UIColor purpleColor];
           //创建星星的类对象
    WXRatingView *ratingView = [[WXRatingView alloc] initWithFrame:CGRectMake(10, 100, 300, 50)];
          //星星背景色
    ratingView.backgroundColor = [UIColor greenColor];
          //评星分数
    ratingView.scoreNum = 5;
          // 添加到视图
    [self.view addSubview:ratingView];
    // Do any additional setup after loading the view.
}

自定义部分：

 WXRatingView.h

#import <UIKit/UIKit.h>

@interface WXRatingView : UIView
//2中颜色的星星属性（灰色，黄色，）
@property(strong,nonatomic)UIView *grayView;
@property(strong,nonatomic) UIView *yellowView;
//显示评星分数的文本框
@property(strong,nonatomic) UILabel *scoreLabel;

@property (nonatomic ,assign) float scoreNum;//评星分数
@end

WXRatingView.m


#import "WXRatingView.h"

#define star_width 35
#define star_height 34

@implementation WXRatingView

- (instancetype)initWithFrame:(CGRect)frame
{
    self = [super initWithFrame:frame];
    if (self) {
        // 创建子视图
        [self initViews];
    }
    return self;
}

// 创建子视图
- (void)initViews
{
    // 1.创建灰色星星视图
    self.grayView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, star_width * 5, star_height)];
    // 设置背景图片
   self.grayView.backgroundColor = [UIColor colorWithPatternImage:[UIImage imageNamed:@"gray.png"]];
    // 设置星星视图的大小
    float scale = (self.height / 2.0) /star_height;
    self.grayView.transform = CGAffineTransformMakeScale(scale, scale);
    // 设置位置
   self.grayView.left = 0;
   self.grayView.top = self.height * .25;
    
    [self addSubview:self.grayView];
    
    // 2.创建黄色星星视图
    self.yellowView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, star_width * 5, star_height)];
    // 设置背景图片
    self.yellowView.backgroundColor = [UIColor colorWithPatternImage:[UIImage imageNamed:@"yellow.png"]];
    // 设置星星视图的大小
    self.yellowView.transform = CGAffineTransformMakeScale(scale, scale);
    // 设置位置
   self.yellowView.left = 0;
   self.yellowView.top = self.height * .25;
    
    [self addSubview:self.yellowView];
    
    // 3.创建分数文本视图
    self.scoreLabel = [[UILabel alloc] initWithFrame:CGRectMake(_grayView.right + 10, 0, 50, self.height)];
    self.scoreLabel.textColor = [UIColor orangeColor];
    // 设置字体的大小
   self.scoreLabel.font = [UIFont boldSystemFontOfSize:self.height * .5];
    [self addSubview:self.scoreLabel];
}

// 重写分数的set:
- (void)setScoreNum:(float)scoreNum
{
    if (self.scoreNum != scoreNum) {
        _scoreNum = scoreNum;//此处不能用属性 ，因为为set方法
        
        // 改变黄色星星视图的宽度
        self.yellowView.width =  self.grayView.width * _scoreNum * .1;
        // 设置文本
       self.scoreLabel.text = [NSString stringWithFormat:@"%.1f", self.scoreNum];
    }

}