快捷搜索:

您的位置:金莎娱乐 > 关于金莎 > 那么些人追的干货

那么些人追的干货

发布时间:2019-10-05 07:35编辑:关于金莎浏览(170)

    Photoshop给荒野中自拍的唯美意境女子写真图片调出冷调秋景象,素材图片为夏天图片,转金秋色的时候把绿地部分的颜料转为较暗的中性珊瑚黄绿;最终大家再给天空部分加一点淡莲灰,让总体效果变得进一步梦幻,喜欢的朋友们好好学习一下吧!

    前言

    本次小说,陈诉的是Layer的叁特性质contentsRect,利用它可以决定图层内容的体现,然后还会有使用渐变层(CAGradientLayer)做阴影效果。

    一旦喜欢小编的小说,能够关心作者,随着连绵不断学习斯威夫特中,时有时无还应该有革新ing....

    原图

    0.怎么是折叠成效?

    就是让一张图纸的某一局地,沿着X轴大概Y轴旋转,不可能拿着整张图片旋转,整张图片会联手旋转,就不会有折叠功用了。可是有个疑问,怎么样让一整张图形的某个旋转。

    图片 1折叠.gif

    图片 2

    1.哪些制作图纸折叠作用?

    把一张图片分成两部分显示,上面一部分,下面一部分,折叠上面部分的内容。

    末尾效果

    2.如何把一张图纸分成两片段显得。

    搞三个控件,三个来得上半局部,一个人作品展现下半局地,须要用到Layer的三个属性contentsRect,那特性子是足以调整图片展现的尺码,可以让图片只显示上一些依旧下一些,注意:取值范围是0~1.

    CGRectMake(0, 0, 1, 0.5) : 表示显示上半部分

    CGRectMake(0, 0.5, 1, 0.5) : 表示显示下半部分

    图片 3Snip20150715_1.png

    图片 4

    3.怎么着飞速的把两有的拼接成一张完整的图纸。

    3.1 首先通晓折叠,折叠其实就是旋转,既然供给旋转就必要确定锚点,因为暗中同意都是绕着锚点旋转的。

    3.2 上一些剧情绕着尾部大旨旋转,所以设置上部分的锚点为

    3.3 锚点设置好了,就足以规定地点了,这里须要精通其实View的中心点就是layer的position,锚点是决定layer上的哪个点显示在position上

    3.4 能够把前后部分重合在协同,然后分别设置内外有的的锚点,如图黄绿部分就是position点,上一些图层上的哪个点必要出示到这些职位,由锚点决定,上部分的锚点为,下部分的锚点为,就可以便捷重叠了。

    图片 5Snip20150619_2.png

    4.怎么折叠上有的内容。

    因为整个图片都急需拖动,由此能够创立三个晶莹剔透的view放在下面,给他提供拖动手势,那样就招致整个图片都能拖动的假象。

    在拖动视图的时候,旋转上部分控件。修改transform属性。

    • 能够在上有的和下局地尾部增加一个拖动控件(拖动控件尺寸就是完整的图片尺寸),给那些控件增添三个pan手势,就能够营造贰个假象,拖动控件的时候,折叠图片。
    • 测算Y轴每偏移一点,必要旋转多少角度,假使完整图片尺寸中度为200,当y

      200时,上有的图片应该刚好旋转180°,由此angle = offsetY * M_PI / 200;
    • 上有个别剧情应当是绕着X轴旋转,逆时针旋转,因而角度要求为负数。
     // 获取手指偏移量 CGPoint transP = [sender translationInView:_containV];// 初始化形变 CATransform3D transform3D = CATransform3DIdentity;// 设置立体效果 transform3D.m34 = -1 / 1000.0;// 计算折叠角度,因为需要逆时针旋转,所以取反 CGFloat angle = -transP.y / 200.0 * M_PI; _topView.layer.transform = CATransform3DRotate(transform3D, angle, 1, 0, 0);
    
    • 为了让折叠功效尤其有功力,越发富有立体感,能够给形变设置m34性质,就能够增多立体感。
    // 设置M34就有立体感。 -1 / z ,z表示观察者在z轴上的值,z越小,看起来离我们越近,东西越大。transform3D.m34 = -1 / 1000.0;
    

    反弹效果

    当手指抬起的时候,应该把折叠图片还原,其实便是把形变清空。

     if (sender.state == UIGestureRecognizerStateEnded) { // 手指抬起 // 还原 [UIView animateWithDuration:0.5 delay:0 usingSpringWithDamping:0.1 initialSpringVelocity:3 options:UIViewAnimationOptionCurveEaseInOut animations:^{ _topView.layer.transform = CATransform3DIdentity; } completion:nil]; }
    

    阴影效果

    当折叠图片的时候,尾部应该有个黑影渐变经过。

    • 利用CAGradientLayer创建阴影效果,增多到底层视图上,並且一开端需求掩盖,在拖动的时候渐渐显示出来。
    • 颜色应是由透明到黑色潜濡默化,表示阴影从无到有。
    // 创建渐变图层CAGradientLayer *shadomLayer = [CAGradientLayer layer];// 设置渐变颜色 shadomLayer.colors = @[[UIColor clearColor],[[UIColor blackColor] CGColor]]; shadomLayer.frame = _bottomView.bounds; _shadomLayer = shadomLayer;// 设置不透明度 0 shadomLayer.opacity = 0; [_bottomView.layer addSublayer:shadomLayer];
    
    • 在拖动的时候计算不光滑度值,假使拖动200,阴影完全展现,不反射率应为1,由此opacity = y轴偏移量 * 1 / 200.0;
    // 设置阴影不透明度 _shadomLayer.opacity = transP.y * 1 / 200.0;
    
    • 在手指抬起的时候,供给把影子设置隐蔽,不发光度为0;
     if (sender.state == UIGestureRecognizerStateEnded) { // 手指抬起 // 还原 [UIView animateWithDuration:0.5 delay:0 usingSpringWithDamping:0.1 initialSpringVelocity:3 options:UIViewAnimationOptionCurveEaseInOut animations:^{ _topView.layer.transform = CATransform3DIdentity; // 还原阴影 _shadomLayer.opacity = 0; } completion:nil]; }
    

    联系情势

    即便您爱怜那篇作品,能够连续关切自己,腾讯网:吖了个峥,迎接沟通。

    本文由金莎娱乐发布于关于金莎,转载请注明出处:那么些人追的干货

    关键词:

上一篇:没有了

下一篇:没有了