果冻效果

简介:

果冻效果

 

说明

参考源码 https://github.com/Resory/RYCuteView

 

效果

 

源码

https://github.com/YouXianMing/Animations



//
//  SpringEffectController.m
//  Animations
//
//  Created by YouXianMing on 16/1/17.
//  Copyright © 2016年 YouXianMing. All rights reserved.
//

#import "SpringEffectController.h"
#import "WxHxD.h"
#import "UIView+SetRect.h"

@interface SpringEffectController (){
    
    CGPoint  _centerPoint;
}

@property (nonatomic, strong) UIView         *pointView;
@property (nonatomic, strong) CAShapeLayer   *shapeLayer;
@property (nonatomic, strong) CADisplayLink  *displayLink;

@end

@implementation SpringEffectController

- (void)setup {
    
    [super setup];
    
    _centerPoint = self.contentView.center;
    
    self.shapeLayer           = [CAShapeLayer layer];
    self.shapeLayer.frame     = self.contentView.bounds;
    self.shapeLayer.fillColor = [UIColor redColor].CGColor;
    self.shapeLayer.path      = [self calculatePathWithPoint:CGPointMake(Width / 2.f, Height / 2.f)].CGPath;
    [self.contentView.layer addSublayer:self.shapeLayer];
    
    self.pointView                   = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 4, 4)];
    self.pointView.center            = self.contentView.center;
    [self.contentView addSubview:self.pointView];
    
    self.displayLink = [CADisplayLink displayLinkWithTarget:self selector:@selector(displayLinkEvent)];
    [self.displayLink addToRunLoop:[NSRunLoop currentRunLoop] forMode:NSDefaultRunLoopMode];
    
    UIPanGestureRecognizer *panGesture = [[UIPanGestureRecognizer alloc] initWithTarget:self action:@selector(panGestureEvent:)];
    [self.contentView addGestureRecognizer:panGesture];
    
}

- (UIBezierPath *)calculatePathWithPoint:(CGPoint)point {
    
    UIBezierPath *path = [UIBezierPath bezierPath];
    
    [path moveToPoint:CGPointMake(0, Height / 2.f)];
    [path addLineToPoint:CGPointMake(0, Height)];
    [path addLineToPoint:CGPointMake(Width, Height)];
    [path addLineToPoint:CGPointMake(Width, Height / 2.f)];
    [path addQuadCurveToPoint:CGPointMake(0, Height / 2.f)
                 controlPoint:point];
    
    return path;
}

- (void)panGestureEvent:(UIPanGestureRecognizer *)panGesture {
    
    CGPoint point          = [panGesture locationInView:panGesture.view];
    CGPoint calculatePoint = CGPointMake((point.x + _centerPoint.x) / 2.f, (point.y + _centerPoint.y) / 2.f);
    
    if (panGesture.state == UIGestureRecognizerStateChanged) {
        
        self.shapeLayer.path  = [self calculatePathWithPoint:calculatePoint].CGPath;
        self.pointView.center = calculatePoint;
        
    } else if (panGesture.state == UIGestureRecognizerStateCancelled ||
               panGesture.state == UIGestureRecognizerStateEnded ||
               panGesture.state == UIGestureRecognizerStateFailed) {
                
        [UIView animateWithDuration:1.0 delay:0.0 usingSpringWithDamping:0.25f initialSpringVelocity:0
                            options:UIViewAnimationOptionCurveEaseInOut
                         animations:^{
                             
                             self.pointView.center = self.contentView.center;
                             
                         } completion:nil];
    }
}

- (void)displayLinkEvent {
    
    CALayer *layer       = self.pointView.layer.presentationLayer;
    self.shapeLayer.path = [self calculatePathWithPoint:layer.position].CGPath;
}

@end


目录
相关文章
|
6月前
|
C++
浪漫七夕流星雨
关于如何使用C++和EasyX图形库创建一个带有流星雨和背景音乐的浪漫七夕表白程序的教程。
160 0
|
前端开发 JavaScript
七夕表白,不给女朋友来场炫酷的烟花?
七夕表白,不给女朋友来场炫酷的烟花?
134 0
|
存储 人工智能 弹性计算
600天,我们在沙漠筑“城堡”
600天,我们在沙漠筑“城堡”
158 0
7-1 射击游戏
7-1 射击游戏
129 0
|
小程序 开发工具
樱花飘落模拟器-情人节祝你表白成功
看着樱花缓缓的飘落,然后不觉间竟下起了绵绵的细雨。因为今天我所在的城市正下着小雨,所以就在这个小应用中增加了阵阵的细雨功能。 下面我们就学习一下如何实现一个这样温暖的小程序。 首先准备一下素材。一个粉色的背景,两个樱花花瓣,一个模拟雨滴的长方形,以及两句要显示的话。
166 0
|
小程序
樱花飘落模拟器-请你看樱花静静的飘落
今天是一个美好的日子,所以小蚂蚁决定教大家用微信小游戏制作工具做一个温暖而美好的“樱花飘落模拟器”小程序,然后把它送给所爱的人。 先看一下最终的效果图。
157 0
Egret学习笔记 (Egret打飞机-8.敌机和主角飞机发射子弹)
Egret学习笔记 (Egret打飞机-8.敌机和主角飞机发射子弹)
100 0
|
容器
Egret学习笔记 (Egret打飞机-6.实现敌机飞起来)
Egret学习笔记 (Egret打飞机-6.实现敌机飞起来)
132 0
|
前端开发 JavaScript
夏天到了,用CSS写一个小风扇清凉一夏吧
夏天到了,用CSS写一个小风扇清凉一夏吧
夏天到了,用CSS写一个小风扇清凉一夏吧
两种过年烟花,你喜欢哪一种(HTML+CSS+JS)
两种过年烟花,你喜欢哪一种(HTML+CSS+JS)
130 0
两种过年烟花,你喜欢哪一种(HTML+CSS+JS)