美文网首页
iOS 星级评论-小星星的画法

iOS 星级评论-小星星的画法

作者: _Waiting_ | 来源:发表于2017-10-20 16:11 被阅读46次
你会画小星星吗?

嘿嘿,最近有个项目用到了星级评论,百度一下,发现有一些文章是直接拿两张图片进行设置的,各有各法。本文是利用CAShapeLayer画出来的,写出来仅供大家参考。

效果图

说一下画图的原理,就是计算出小星星十个点,连线进行填充颜色就行了。废话不多说,直接上代码。

-(void)creatViewWitNumber:(float)number
{
    self.layer.masksToBounds = YES; 
    float R = self.frame.size.width/2;
    float r = R * sinf(M_PI * 18/180.0)/sinf(M_PI * 36/180.0);
    
    //用来画五角星
    
    UIBezierPath *path = [UIBezierPath bezierPath];
    for(int i = 0;i<5;i++ )//
    {
        float x = R * cos(M_PI * 72/180.0 * i - M_PI * 18/180.0) + R;
        float y = R * sin(M_PI * 72/180.0 * i - M_PI * 18/180.0) + R;
        
        float x1 = r * cos(M_PI * 72/180.0 * i + M_PI * 36/180.0 - M_PI * 18/180.0) + R;
        float y1 = r * sin(M_PI * 72/180.0 * i + M_PI * 36/180.0 - M_PI * 18/180.0) + R;
        
        CGPoint point = CGPointMake(x, y);
        CGPoint point1 = CGPointMake(x1, y1);
        if(i == 0)
        {
            [path moveToPoint:point];
            [path addLineToPoint:point1];
        }
        else
        {
            [path addLineToPoint:point];
            [path addLineToPoint:point1];
        }
    }
    
    [path closePath];
    
    //外侧五角星框
    CAShapeLayer *slayer = [CAShapeLayer layer];
    slayer.frame = CGRectMake(0, 0, self.frame.size.width, self.frame.size.width);
    slayer.path = path.CGPath;
    slayer.fillColor = [UIColor clearColor].CGColor;
    slayer.strokeColor = [UIColor orangeColor].CGColor;
    slayer.lineWidth = 1;
    [self.layer addSublayer:slayer];
    
    //内侧五角星
    CAShapeLayer *slayer1 = [CAShapeLayer layer];
    slayer1.frame = CGRectMake(0, 0, self.frame.size.width, self.frame.size.width);
    slayer1.path = path.CGPath;
    
    CALayer *layer1 = [CALayer layer];
    layer1.frame = CGRectMake(0, 0, self.frame.size.width * _starNumber, self.frame.size.width);
    layer1.backgroundColor = [UIColor orangeColor].CGColor;
    layer1.mask = slayer1 ;
    [self.layer addSublayer:layer1];
}

//设置小星星的填充
- (void)setStarNumber:(float)starNumber
{
    _starNumber = starNumber;
    [self creatViewWitNumber:starNumber];
}

写完收工
demo下载地址:
http://download.csdn.net/download/qq_14827361/10032195

相关文章

  • iOS 星级评论-小星星的画法

    你会画小星星吗? 嘿嘿,最近有个项目用到了星级评论,百度一下,发现有一些文章是直接拿两张图片进行设置的,各有各法。...

  • iOS星级评论条

    评论视图下载地址:https://git.oschina.net/qjz.com/StareComment/tre...

  • 关于星级评论

    今天看到一个关于星级评论很厉害的插件 首先我们需要将需要的图片资源导入项目中。可以直接拖入项目中也可放在Asset...

  • 星级评论控件

    .m文件 #import "Start.h" @implementation Start -(void)setPe...

  • 星星评分控件TQStarRatingView揭秘!(一)

    今天为大家带来一个iOS星级评分控件的实现,欢迎拍砖。 在github上搜索iOS星级评分控件,可以看到TQSta...

  • iOS 11以上跳转App评论界面

    iOS 11 以前跳转iOS App评论 iOS 11 以后跳转iOS App评论

  • 什么是早期评论员计划?

    什么是早期评论员计划? 早期评论员计划鼓励已购买产品的客户分享他们对该产品的真实体验,无论是一星级评论还是五星级评...

  • 引导用户添加星级评论

    ///弹出好评 - (void)haoping { // if([SKStoreReviewController...

  • iOS星级评级

    附上效果图 实现的功能:1.可以自定义星星的数量(默认为5颗星)2.可以初始化设置星级(初始化设置星级就不能更改星...

  • iOS - 评价星级

    1.通过xib布局,添加五个按钮,并设置tag值: 2.关联属性,将五个按钮放入同个数组中: 3.按钮添加点击事件:

网友评论

      本文标题:iOS 星级评论-小星星的画法

      本文链接:https://www.haomeiwen.com/subject/plevuxtx.html