iOS評(píng)分(評(píng)價(jià))星星圖打分功能
下載地址:https://github.com/littleSunZheng/StarGradeView
起因:項(xiàng)目中往往涉及到用戶的評(píng)分反饋,在我的“E中醫(yī)”項(xiàng)目中,涉及到幾處。對(duì)此我參考了美團(tuán)和滴滴的評(píng)分圖。
評(píng)分視圖分為展示和評(píng)分兩種:
(1)多數(shù)情況下“評(píng)分功能”是要簡(jiǎn)介易用的。那種 星星準(zhǔn)確顯示百分比(分?jǐn)?shù))的功能反而不好用,這種多數(shù)用在顯示評(píng)分上,不需要用戶去點(diǎn)擊,因?yàn)橛脩粝朐u(píng)價(jià)“9.8分”,手指頭是不能準(zhǔn)確點(diǎn)擊的。但是顯示的時(shí)候你根據(jù)數(shù)據(jù)可以完美的顯示出來(lái)。實(shí)現(xiàn)原理就是兩圖片,一張是“灰色”星星五顆,一張是“金色”星星五顆。讓imageView的模式設(shè)置好(多余的照片不顯示)。按照比例將 上層 金色星星imageView的長(zhǎng)調(diào)整好,星星比例就自然顯示好了。
(2)用戶操作打分的星星視圖:我這里做的就是打分的。實(shí)現(xiàn)原理很簡(jiǎn)單,當(dāng)你操作其他軟件的功能時(shí)就能結(jié)合想到手勢(shì)。
上源碼:
// // StarGradeView.h // EcmCustomer // // Created by 鄭鵬 on 2016/11/4. // Copyright © 2016年 張進(jìn). All rights reserved. // #import <UIKit/UIKit.h> @protocol StarGradeViewDelegate <NSObject> - (void)didSelectedIndex:(NSString *)index; @end @interface StarGradeView : UIView @property (nonatomic, assign) id <StarGradeViewDelegate> delegate; // 視圖frame 和 想有幾個(gè)星星(取決于設(shè)計(jì) 5個(gè)常用 或者10個(gè) ) - (instancetype)initWithFrame:(CGRect)frame withtNumberOfPart:(NSInteger)num; @end // // StarGradeView.m // EcmCustomer // // Created by 鄭鵬 on 2016/11/4. // Copyright © 2016年 張進(jìn). All rights reserved. // #import "StarGradeView.h" @interface StarGradeView(){ UIView *_btnView;//放星星的背景view UIView *_shouView;//放星星的背景view CGFloat _height;//星星的高 NSInteger _btnNum;//按鈕的數(shù)量 NSInteger _index;//第幾個(gè) } @end @implementation StarGradeView - (instancetype)initWithFrame:(CGRect)frame withtNumberOfPart:(NSInteger)num{ self = [super initWithFrame:frame]; _height = frame.size.height; _btnNum = num; CGFloat selfW = frame.size.width; CGFloat starW = frame.size.height; _btnView = [[UIView alloc] initWithFrame:CGRectMake((selfW - starW*num)/2 , 0, starW*num, starW)]; for (int i = 0; i< num; i++) { UIButton *starBtn = [UIButton buttonWithType:UIButtonTypeCustom]; starBtn.frame = CGRectMake(starW * i, 0, starW, starW); [starBtn setImage:[UIImage imageNamed:@"star_off"] forState:UIControlStateNormal]; [starBtn setImage:[UIImage imageNamed:@"star_on"] forState:UIControlStateSelected]; starBtn.tag = 1991+i; [starBtn setAdjustsImageWhenHighlighted:NO]; [_btnView addSubview:starBtn]; } _shouView = [[UIView alloc] initWithFrame:CGRectMake(0 , 0, starW*num, starW)]; [_btnView addSubview:_shouView]; [self addSubview:_btnView]; return self; } //滑動(dòng)需要的。 - (void)touchesBegan:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event{ CGPoint point = [self getTouchPoint:touches]; int j = (int)(point.x/_height); _index = j; for (NSInteger i = 0; i < _btnNum; i++) { if (i<=j) { UIButton *btn = [_btnView viewWithTag:i+1991]; btn.selected = YES; }else{ UIButton *btn = [_btnView viewWithTag:i+1991]; btn.selected = NO; } } } //滑動(dòng)需要的。 - (void)touchesMoved:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event{ CGPoint point = [self getTouchPoint:touches]; int j = (int)(point.x/_height); _index = j; for (NSInteger i = 0; i < _btnNum; i++) { if (i<=j) { UIButton *btn = [_btnView viewWithTag:i+1991]; btn.selected = YES; }else{ UIButton *btn = [_btnView viewWithTag:i+1991]; btn.selected = NO; } } } //滑動(dòng)需要的。 - (void)touchesEnded:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event{ if ([self.delegate respondsToSelector:@selector(didSelectedIndex:)]) { [self.delegate didSelectedIndex:[NSString stringWithFormat:@"%ld",_index+1]]; } } //取到 手勢(shì) 在屏幕上點(diǎn)的 位置point - (CGPoint)getTouchPoint:(NSSet<UITouch *>*)touches{ UITouch *touch = [touches anyObject]; CGPoint point = [touch locationInView:_shouView]; return point; } //如果點(diǎn)擊的范圍在 按鈕的區(qū)域 - (BOOL)pointInBtn:(UIButton *)btn WithPoint:(CGPoint)point{ if (CGRectContainsPoint(btn.frame, point)) { return YES; }else{ return NO; } return nil; } /* // Only override drawRect: if you perform custom drawing. // An empty implementation adversely affects performance during animation. - (void)drawRect:(CGRect)rect { // Drawing code } */ @end
使用時(shí):
StarGradeView *view = [[StarGradeView alloc] initWithFrame:CGRectMake(0, 100, 375, 40) withtNumberOfPart:5]; view.delegate = self; [self.view addSubview:view]; //并實(shí)現(xiàn)代理方法 - (void)didSelectedIndex:(NSString *)index{ NSLog(@"%@",index); }
注釋:這里切圖時(shí)注意:只要一個(gè)星星,并且要求是 正方形 星星圖片有留白??创a就明白為什么要這么切圖。1是美觀 2是 容易計(jì)算。
以上所述是小編給大家介紹的iOS評(píng)分(評(píng)價(jià))星星圖打分功能,希望對(duì)大家有所幫助,如果大家有任何疑問(wèn)請(qǐng)給我留言,小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持!
相關(guān)文章
IOS中快速集成短信SDK驗(yàn)證開(kāi)發(fā)(SMSSDK),IOS開(kāi)發(fā)中如何設(shè)置手機(jī)短信驗(yàn)證碼
這篇文章主要介紹了IOS中快速集成短信SDK驗(yàn)證開(kāi)發(fā)(SMSSDK),IOS開(kāi)發(fā)中如何設(shè)置手機(jī)短信驗(yàn)證碼 的相關(guān)資料,需要的朋友可以參考下2016-01-01iOS實(shí)現(xiàn)屏幕亮度和閃光燈控制的實(shí)例代碼
本篇文章主要介紹了iOS實(shí)現(xiàn)屏幕亮度和閃光燈控制的實(shí)例代碼,具有一定的參考價(jià)值,有興趣的可以了解一下2017-06-06淺談iphone X的簡(jiǎn)單適配問(wèn)題(推薦)
這篇文章主要介紹了淺談iphone X的簡(jiǎn)單適配(推薦),小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2017-11-11IOS 上架后出現(xiàn)90034代碼錯(cuò)誤問(wèn)題解決
這篇文章主要介紹了IOS 上架后出現(xiàn)90034代碼錯(cuò)誤問(wèn)題解決的相關(guān)資料,需要的朋友可以參考下2016-11-11