一個簡單的遮擋效果

遮擋效果圖:


效果圖一

效果圖二

原理:放兩張視圖,一張視圖控制灰色星星,另一張控制黃色星星。
黃色星星覆蓋灰色星星,再通過值來改變黃色星星的視圖frame的寬度。

代碼:

#import <UIKit/UIKit.h>
@interface starView : UIView {
    
    UIView *_yellowView;
    UIView *_grayView;    
}
@property(nonatomic,assign) float rating;
@end


#import "starView.h"

@implementation starView

//1.創(chuàng)建視圖

- (void)awakeFromNib {
    
    UIImage *yellowImage = [UIImage imageNamed:@"yellow"];
    UIImage *grayImage = [UIImage imageNamed:@"gray"];
    
    _yellowView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, yellowImage.size.width* 5,yellowImage.size.height)];
    _grayView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, grayImage.size.width * 5, grayImage.size.height)];
    
    //通過圖片來創(chuàng)建背景
    _yellowView.backgroundColor = [UIColor colorWithPatternImage:yellowImage];
    _grayView.backgroundColor = [UIColor colorWithPatternImage:grayImage];
    
    [self addSubview:_grayView];
    [self addSubview:_yellowView];
    
    //方法比例
    CGFloat scale = self.frame.size.height / yellowImage.size.height;
    _yellowView.transform = CGAffineTransformMakeScale(scale, scale);
    _grayView.transform = CGAffineTransformMakeScale(scale, scale);
    //坐標歸零
    CGRect frame = self.frame;
    frame.origin = CGPointZero;
    _yellowView.frame = frame;
    _grayView.frame = frame;
    
    
}

//2.修改值
- (void)setRating:(float)rating {
    
    _rating = rating;
    
    float s = rating / 10;
    
    CGRect frame = _yellowView.frame;
    
    frame.size.width = self.frame.size.width * s;
    
    _yellowView.frame =frame;
    
}

@end

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容