小黄人大眼萌

作者: Renjiee | 来源:发表于2017-07-17 12:01 被阅读150次

前面看了卖报的小画家Sure的一篇文章仿新版ofo共享单车小黄人动态效果感觉挺好玩的所以也改写了一个,中途感谢若只如初见_f1af前辈的帮助

先来感受一下👇

小黄人大眼萌.PNG

导入头文件
#import <CoreMotion/CoreMotion.h>


添加小黄人眼珠子

- (void) initEyes{
    //左眼
    EyesImage * leftEye = [[EyesImage alloc] initWithFrame:CGRectMake(CURRENT_SIZE(150), CURRENT_SIZE(300), CURRENT_SIZE(20), CURRENT_SIZE(20))];
    leftEye.image = [UIImage imageNamed:@"minions_eyes"];
    leftEye.layer.masksToBounds = YES;
    leftEye.layer.cornerRadius = 10;
    leftEye.contentMode = UIViewContentModeScaleAspectFit;
    leftEye.collisionBoundsType = UIDynamicItemCollisionBoundsTypeEllipse;
    [self.view addSubview:leftEye];
    self.leftEye = leftEye;
    //右眼
    EyesImage * rightEye = [[EyesImage alloc] initWithFrame:CGRectMake(CURRENT_SIZE(210), CURRENT_SIZE(300), CURRENT_SIZE(20), CURRENT_SIZE(20))];
    rightEye.image = [UIImage imageNamed:@"minions_eyes"];
    rightEye.layer.masksToBounds = YES;
    rightEye.layer.cornerRadius = 10;
    rightEye.contentMode = UIViewContentModeScaleAspectFit;
    rightEye.collisionBoundsType = UIDynamicItemCollisionBoundsTypeEllipse;
    [self.view addSubview:rightEye];
    
    self.rightEye = rightEye;
}

初始化仿真器

- (UIDynamicAnimator *)animator
{
    if (!_animator) {
        // 创建一个物理仿真器
        _animator = [[UIDynamicAnimator alloc] initWithReferenceView:self.view];
    }
    return _animator;
}

设置动画和眼珠子活动范围

- (void)SetCoreMotion{
    //  设置重力并纪录
    UIGravityBehavior *gravity = [[UIGravityBehavior alloc] init];
    gravity.magnitude = 1;
    [gravity addItem:self.leftEye];
    [gravity addItem:self.rightEye];
    [self.animator addBehavior:gravity];
    self.gravity = gravity;
    
    //设置摩擦力
    UICollisionBehavior *collision = [[UICollisionBehavior alloc] init];
    [collision addItem:self.leftEye];
    [collision addItem:self.rightEye];
    UIDynamicItemBehavior *item = [[UIDynamicItemBehavior alloc] initWithItems:@[self.leftEye, self.rightEye]];
    //摩擦力
    item.friction = 100;
    [self.animator addBehavior:item];
    // 3.开始仿真
    [self.animator addBehavior:gravity];
    [self.animator addBehavior:collision];
    
    
    //    画出边界
    UIBezierPath *path = [UIBezierPath bezierPathWithOvalInRect:
                          CGRectMake(CURRENT_SIZE(128),CURRENT_SIZE(280), CURRENT_SIZE(50), CURRENT_SIZE(45))];
    
    [collision addBoundaryWithIdentifier:@"circle" forPath:path];
    UIBezierPath *path2 = [UIBezierPath bezierPathWithOvalInRect:
                           CGRectMake(CURRENT_SIZE(186),CURRENT_SIZE(280), CURRENT_SIZE(50), CURRENT_SIZE(45))];
    
    [collision addBoundaryWithIdentifier:@"circle" forPath:path2];
}

开始动画

- (void)SetAccelerometer{
    CMMotionManager *motionManager = [[CMMotionManager alloc]init];
    motionManager.accelerometerUpdateInterval = 0.01; // 告诉manager,更新频率是100Hz
    [motionManager startAccelerometerUpdatesToQueue:[NSOperationQueue currentQueue] withHandler:^(CMAccelerometerData * _Nullable accelerometerData, NSError * _Nullable error) {
        CMAccelerometerData *newestAccel = motionManager.accelerometerData;
        double accelerationX = newestAccel.acceleration.x;
        double accelerationY = newestAccel.acceleration.y;
        self.gravity.gravityDirection = CGVectorMake(accelerationX, -accelerationY);
    }];
}

完成效果

小黄人大眼萌.gif

代码我已经上传到了GitHub,如果有感兴趣的朋友可以到GitHub中下载--小黄人大眼萌,喜欢的记得给个Stare✨,欢迎大家提出建议,谢谢

我是Renjiee 我要做最骚的程序猿👨‍💻‍

相关文章

  • 小黄人,为啥萌

    小黄人大眼萌上映了,大家都会喜欢里面的小黄人们,会感觉他们萌萌哒。那这是为什么呢? 第一,大大的眼睛。人是喜欢更大...

  • 8月看的6部电影和8本书

    Minions:TheRiseofGruScoreSuite音乐:HeitorPereira-小黄人大眼萌:神偷奶...

  • 小黄人大眼萌

    前面看了卖报的小画家Sure的一篇文章仿新版ofo共享单车小黄人动态效果感觉挺好玩的所以也改写了一个,中途感谢若只...

  • 小黄人大眼萌!

    如果说蓝精灵和七龙珠是是90后的童年那么,小黄人又是00后的梦想,从这句话当中,我体会到了。小黄人在现代人的...

  • 手绘小黄人·第一弹

    爱吃香蕉和冰淇淋的黄色胶囊, 呆蠢,贱萌。 叽叽喳喳,闹哄哄。 小黄人,大眼萌, 欢乐着我们的生活。 一波手绘小黄...

  • 小黄人大眼萌电影

    星期六,我看了一部电影,叫《小黄人大眼萌》,故事人物情节非常有趣。 很久很久以前,在海底的深处,有很多稀...

  • 小黄人大眼睛萌

    今天画个洗澡的小黄人 线稿 先定位画出椭圆形身体 初步线稿,仍需修改 用彩铅勾线 上色完成 脚部没画出立体感,这次...

  • ㄍ小黄人大眼萌》观后感 - 草稿 - 草稿

    今天我和姐姐观看《小黄人大眼萌》这部电影。这部电影,讲述的是小黄人找老大的故事,现在我很喜欢小黄人,再加上小黄人的...

  • ㄍ小黄人大眼萌》观后感 - 草稿

    今天我和姐姐观看《小黄人大眼萌》这部电影。这部电影,讲述的是小黄人找老大的故事,现在我很喜欢小黄人,再加上小黄人的...

  • 感觉自己萌萌哒~

    挂科难,哈哈哈 小黄人大眼萌( •̥́ ˍ •̀ू ) 一起学习一起进步呀~

网友评论

本文标题:小黄人大眼萌

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