美文网首页程序员
仿商城评价星级

仿商城评价星级

作者: 答案在风中飘 | 来源:发表于2018-07-05 15:09 被阅读7次
用户可以用手指划过控件上面的若干图像,以此来对电影、软件等项目做出评分。除了简单的滑动,还添加了动画效果。直接上代码,导入到自己项目里就可以直接用



#import "StarSliderA.h"

#define WIDTH [UIScreen mainScreen].bounds.size.width / 20

@interfaceStarSliderA ()

@property (nonatomic, assign) int value;

@end

.m文件
@implementation StarSliderA

- (instancetype)initWithFrame:(CGRect)aFrame{

self = [superinitWithFrame:aFrame];

if (self) {

float offsetCenter = WIDTH;

for (int i = 1; i <= 10; i++) {

UIImageView *imageView = [[UIImageViewalloc] initWithFrame:CGRectMake(0.0f, 0.0f, WIDTH, WIDTH)];

imageView.image = [UIImageimageNamed:@"OFF_ART"];

imageView.center = CGPointMake(offsetCenter, self.intrinsicContentSize.height / 2.0f);

offsetCenter += WIDTH * 1.5f;

[selfaddSubview:imageView];

}

}

self.backgroundColor = [[UIColorblackColor] colorWithAlphaComponent:0.25f];

returnself;

}

- (CGSize)intrinsicContentSize{

returnCGSizeMake(WIDTH * 8.0f, 34.0f);

}

- (void)updateValueAtPoint : (CGPoint)point{

int newValue = 0;

UIImageView *changedView = nil;

for (UIImageView *eachItem in [selfsubviews]) {

if (point.x < eachItem.frame.origin.x) {

eachItem.image = [UIImageimageNamed:@"OFF_ART"];

}

else{

changedView = eachItem;

eachItem.image = [UIImageimageNamed:@"ON_ART"];

newValue++;

}

}

if (self.value != newValue) {

self.value = newValue;

[selfsendActionsForControlEvents:UIControlEventValueChanged];

[UIViewanimateWithDuration:0.15fanimations:^{

changedView.transform = CGAffineTransformMakeScale(1.5f, 1.5f);

} completion:^(BOOL done) {

[UIViewanimateWithDuration:0.1fanimations:^{

changedView.transform = CGAffineTransformIdentity;

}];

}];

}

}

- (BOOL)beginTrackingWithTouch:(UITouch *)touch withEvent:(UIEvent *)event{

CGPoint touchPoint = [touch locationInView:self];

[selfsendActionsForControlEvents:UIControlEventTouchDown];

[selfupdateValueAtPoint:touchPoint];

returnYES;

}

- (BOOL)continueTrackingWithTouch:(UITouch *)touch withEvent:(UIEvent *)event{

CGPoint touchPoint = [touch locationInView:self];

if (CGRectContainsPoint(self.frame, touchPoint)) {

[selfsendActionsForControlEvents:UIControlEventTouchUpInside];

}

else

[selfsendActionsForControlEvents:UIControlEventTouchUpOutside];

[selfupdateValueAtPoint:[touch locationInView:self]];

returnYES;

}

- (void)endTrackingWithTouch:(UITouch *)touch withEvent:(UIEvent *)event{

CGPoint touchPoint = [touch locationInView:self];

if (CGRectContainsPoint(self.bounds, touchPoint)) {

[selfsendActionsForControlEvents:UIControlEventTouchUpInside];

}

else

[selfsendActionsForControlEvents:UIControlEventTouchUpOutside];

}

- (void)cancelTrackingWithEvent:(UIEvent *)event{

[selfsendActionsForControlEvents:UIControlEventTouchCancel];

}

@end

相关文章

  • 仿商城评价星级

  • 星级评价

    用于星级评价,可以设置高亮和低亮颜色;可以自由选择读写;可以设置整星/半星/按百分比显示;地址:https://g...

  • Android 多商品订单多图评价功能实现(类似淘宝,可自定义可

    公司的商城类项目,需要对一份订单的里面多个商品进行分别评价(图片,文字内容,星级),为了方便使用抽时间实现了这个功...

  • Android 多商品订单评价(类似淘宝)

    前几日一商城类项目,有一需求,需要对一份订单的里面几个商品进行分别评价(图片,文字内容,星级);以前都是对一份订单...

  • 星级评价插件

    星级评价插件 gem 'jquery-raty-rails', github: 'bmc/jquery-raty-...

  • iOS - 评价星级

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

  • react 评价星级

    // 这是父组件 // 先声明个取评价分数的函数 目前只有偶数分(2/4/6/8/10)对应5颗星星 grad...

  • 用户星级评价效果

    今天看到有道题,用户做星级评价,于是就用jQuery写了一个。 代码就这么多

  • 小程序星级评价

    里面图标用了iconfont 这里面我就不写了,自己引用吧,喜欢就留个小星星吧 (▽)

  • vue实现店铺的星级评价

    需求分析#### 1.星级评价在店铺中多次使用,因此作为组件进行编写2.星级评价的标准是该店铺的得分,样式以星星的...

网友评论

    本文标题:仿商城评价星级

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