美文网首页ios 知识点
IOS仿微博发送弹出动画的实现

IOS仿微博发送弹出动画的实现

作者: GoGooGooo | 来源:发表于2016-01-06 16:25 被阅读1853次

    首先推荐一个非常好的微信公众号,每天都有技术分享,很不错。微信号:iOSDevTip

    实现这一动画的技术要点:

    1.背景毛玻璃效果 2.弹出动画 3.用户交互

    1.背景毛玻璃效果

    微博的背景动画有一个透明渐变过程,在渐变停止后是一个毛玻璃的效果。

    首先截图把弹出视图前的页面作为背景,将返回的image作出毛玻璃的效果可以使用苹果自带的毛玻璃效果。

     + (UIImage*)imageWithView:(UIView*)view{
        UIGraphicsBeginImageContextWithOptions(CGSizeMake(view.frame.size.width, view.frame.size.height),NO, [[UIScreenmainScreen]scale]);
    
        [view.layerrenderInContext:UIGraphicsGetCurrentContext()];
    
        UIImage* image =UIGraphicsGetImageFromCurrentImageContext();
        UIColor*tintColor = [UIColorcolorWithWhite:0.95alpha:0.78];
    
        //添加毛玻璃效果
        image = [image py_applyBlurWithRadius:15tintColor:tintColorsaturationDeltaFactor:1maskImage:nil];
    
        //这句话必须要加,不加程序会不断开启上下文并且不会释放
        UIGraphicsEndImageContext();
        return image;
    }
    

    毛玻璃的代码我就不粘出来了,网上可以搜的到。

    2.弹出动画

    弹出动画,按钮图片的弹出原理其实就是弹簧运动(阻尼),具体实现方法是使用苹果自带的spring方法

    [self.contentArray enumerateObjectsUsingBlock:^(idobj,NSUInteger idx,BOOL*stop) {
    
        UIButton* btn = obj;
    
        CGFloatx = btn.frame.origin.x;
        CGFloaty = btn.frame.origin.y;
        CGFloatwidth = btn.frame.size.width;
        CGFloatheight = btn.frame.size.height;
    
        btn.frame=CGRectMake(x, [UIScreen mainScreen].bounds.size.height+ y -self.frame.origin.y, width, height);
        btn.alpha=0.0;
    
        dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(idx *0.03*NSEC_PER_SEC)),dispatch_get_main_queue(), ^{
            [UIView animateWithDuration:0.35 delay:0 usingSpringWithDamping: :25 options:UIViewAnimationOptionCurveEaseInanimations:^{
                btn.alpha=1;
                btn.frame=CGRectMake(x, y, width, height);
            }completion:^(BOOL finished) {
    
            }];
        });
    }];
    
    • 点击加号旋转代码
    [UIView animateWithDuration:0.25animations:^{
        btn.transform=CGAffineTransformMakeRotation(M_PI_4);
    }];
    
    • 点击按钮缩放代码
    [UIView animateWithDuration:0.25animations:^{
        btn.transform=CGAffineTransformMakeScale(1.7,1.7);
    }];
    

    3.用户交互

    就是点击按钮触发相应的事件,通知,block,代理均可以实现。
    demo地址 https://github.com/bb-coder/BHBPopView

    相关文章

      网友评论

      • 8aa2e08487c6:很不错,摘取了一部分到工程里,正好用到,就是我的需求的动画不一样,谢谢啦
      • 空转风:self.frame是啥?
      • 042a0e1be73f:Demo效果不错,就是很多代码看不懂啊!动画前加dispatch_after延迟是什么意思?

      本文标题:IOS仿微博发送弹出动画的实现

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