文档章节

iOS核心动画笔记3-视觉效果

hell03W
 hell03W
发布于 2016/08/01 15:12
字数 1088
阅读 15
收藏 0
点赞 0
评论 0

视觉效果

1. 圆角

CALayer conrnerRadius属性控制图层角度的曲率. 浮点数, 默认是0, 这个曲率值只能影响背景颜色而不影响背景图片或是子图层.CALayer还有个maskToBounds属性,设置为YES时候,图层里面所有东西都会被截取.

2. 图层边框

CALayer另外两个非常有用的属性就是borderWidth,borderColor,这两个属性定义了图层边的绘制样式,这条线沿着图层的bounds绘制,同事也包含图层的角.

边框是绘制在图层边界里面的,而且在所有子内容之前,也在子图层之前.

3. 阴影

阴影相关的属性:

shadowRadius; //阴影虚化半径
shadowColor; //阴影颜色, 默认是黑色
shadowOffset; //阴影偏移
shadowOpacity; //阴影的不透明度
shadowPath; //阴影路径,CGPath类型
  • shadowOpacity: 表示不透明度,1:完全不透明; 0, 完全透明.
  • shadowOffset: 控制阴影的方向和距离,是一个CGSiz的值,宽度控制横向偏移,高度控制纵向偏移,默认值是{0, -3}, 相对y向上偏移3个点. 原因是shadow最初是在mac OS上面世的, 而Mac OS上,y轴方向和iOS上y轴方向是颠倒的, 在Mac上shadowOffset默认值是向下偏移的,所以造成iOS上默认值向上偏移.
  • shadowRadius: 通常, 越是需要让视图或者控件非常醒目独立于背景之外, 就应该给shadowRadius设置一个稍大的值, 阴影月模糊, 图层的深度看上去就会越明显.

4. 阴影裁剪

图层的边框继承自本图层的边框和cornerRadius,但是图层的阴影继承自内容的外形(包括子图层), 而不是根据边界和角半径来确定. 为了计算出阴影的形状,CoreAnimation会将寄宿图(包括子视图)考虑在内,然后通过这些来完美搭配图层形状从而创建一个阴影.

当阴影和裁剪扯上关系, 就会出现很麻烦的限制, 要裁剪的话, 在图层边框之外所有绘制都会被裁减掉, 包括阴影, 但是又需要阴影, 怎么办呢? 解决就是, 阴影图层作为容器图层, 裁剪图层作为子图层, 这样可以完美解决.

5. shadowPath属性

从上上一节已经了解到, 阴影并不总是方的, 而是根据图层以及子图层的内容计算出来的. 但是有时候计算阴影也是给长消耗资源的, 尤其是图层中有很多子图层时候.

如果我们事先知道阴影形状是什么样子的, 那么可以通过制定shadowPath来提高性能. 值是一个CGPathRef类型的. CGPath是 Core Graphics 对象, 可以制定任意的矢量图形. 我们可以通过这个属性独立于图层之外制定阴影的外形.

复杂的形状, 我们可以通过UIBezierPath来绘制.

6. 图层蒙版

CALayer有个mask属性, 这个属性本身是一个CALayer类型, 有和其它图层一样的绘制和布局属性. 它类似于一个子图层, mask图层中被绘制或者有内容的区域是透明的, 可以看到父图层上的内容, 就像是ps上的蒙版效果. mask图层定义了父图层的可见部分.

mask图层的color属性是不关紧要的, 重要的图层的轮廓, mask图层实心的部分就是父图层会被保留下来的部分.

示例代码:

    //测试mask属性
    CALayer *bgLayer = [CALayer layer];
    bgLayer.backgroundColor = [UIColor redColor].CGColor;
    bgLayer.frame = CGRectMake(0, 0, 100, 50);
    [self.maskView.layer addSublayer:bgLayer];
    
    self.maskView.backgroundColor = [UIColor blueColor];
    CALayer *maskLayer = [CALayer layer];
    maskLayer.contentsGravity = kCAGravityCenter;
    maskLayer.contents = (__bridge id)image.CGImage;
    maskLayer.frame = self.layerView.bounds;
    self.maskView.layer.mask = maskLayer;
    /*
     看到这个属性, 猜测这个属性可以实现的功能:
        1. 文本, 一个文字, 一半一个颜色.
        2. maskView上放个shapeLayer, 有背景色, mask是一个被填充满的layer, 可以通过控制shapeLayer来控制被填充的程度, 这个可以实现很多功能, 比如 进度条, 比如按住开始录音那个动画效果, 等等等等.
     */

效果:

7. 拉伸过滤

这个还没看懂....

8. 组透明

这个文章最后一小节:

http://wiki.jikexueyuan.com/project/ios-core-animation/visual-effect.html

© 著作权归作者所有

共有 人打赏支持
hell03W
粉丝 9
博文 138
码字总数 108663
作品 0
朝阳
程序员
如何判断你是合格的高级iOS开发工程师?

前言 随着移动互联网的高速发展泄洪而来,有意学习移动开发的人越来越多了,竞争也是越来越大,需要学习的东西很多。如何才能在激烈的移动开发者竞争中一枝独秀,成为一名真正合格的高级iOS...

_小迷糊 ⋅ 05/26 ⋅ 0

全屏手势返回插件 - BBGestureBack

BBGestureBack Full screen return gesture(全屏手势返回 滑动返回 pop 动画效果) iOS 侧滑返回 BBGestureBack iOS 全屏手势返回 滑动返回 pop 动画效果 现在市场上的主流app都有用到各种侧...

Bonway ⋅ 05/30 ⋅ 0

iOS高仿QQ侧滑控件、下载框架、动画效果、扫一扫、颜色变化、K线图等源码

iOS精选源码 仿京东"加入购物车"转场动画(http://www.code4app.com/thread-28162-1-1.html) ColorTool(颜色转换)(http://www.code4app.com/thread-29256-1-1.html) Swift 专业版K线(http://w......

sunnyaigd ⋅ 04/17 ⋅ 0

iOS新特性框架、仿微信图片浏览、视频监控、爱心动画、文字适配等源码

iOS精选源码 iOS一个看电影、电视剧集合 HDCinema(http://www.code4app.com/thread-29425-1-1.html) 一个非常简易的新特性集成框架NewFeatures(http://www.code4app.com/thread-29433-1-1.ht......

sunnyaigd ⋅ 05/02 ⋅ 0

iOS一些代码的取巧写法总结(一)

一、 字典(NSDictionary)和JSON字符串(NSString)之间互转 二、打开摄像机作为背景 三、打开背光灯 四、状态栏和导航栏一些设置 五、切回app时、会有闪现、闪现一次主屏幕的现象 六、[UIAppl...

朝雨晚风 ⋅ 2016/12/05 ⋅ 0

iOS Animation创建及使用

iOS 实现的基本动画 头尾式动画 2.block动画的方法 iOS显示关键帧动画 关键帧动画 动画的创建和使用 第一种:UIView 代码块调用 第二种:UIView [begin commit]模式 第三种:使用Core Animat...

奋拓达 ⋅ 05/23 ⋅ 0

zymedia的在使用中碰到的问题

记笔记,免忘记!最近用到了视频插件zyMedia。这个插件的简介地址:https://github.com/ireaderlab/zyMedia 问题一: 首先视频的上方显示的标题,实例是这样写的data-config='{"mediaTitle":...

zilvzsy ⋅ 05/12 ⋅ 0

常见的移动端H5页面开发遇到的坑和解决办法

手机共通问题 问题一:用同等比例的图片在PC机上很清楚,但是手机上很模糊,原因是什么呢? 经研究发现是devicePixelRatio作怪,因为手机分辨率太小,如果按照分辨率来显示网页字会非常小,所以苹果...

webmirror ⋅ 05/02 ⋅ 0

iOS三维菜单、调试工具、封装通讯录、网络框架、多种控件和动画等源码

iOS精选源码 一个调用系统通讯录和获取通讯录所有联系人的封装(http://www.code4app.com/thread-29726-1-1.html) ios scrollview嵌套tableview同向滑动(初级、进阶), 支持OC / Swift(http...

sunnyaigd ⋅ 05/15 ⋅ 0

苹果WWDC2018开发者大会总结,不错过任何一个重点,最后发布的新品你一定意想不到

前言: 北京时间2018年6月5日1点,苹果在美国圣何塞举行苹果全球开发者大会(WWDC)。在此次开发者大会中,推出全新iOS 12全新系统版本,以及全新watchOS 5,tvOS和macOS Mojave。 iOS 12:增...

马蹄上的茉莉清香i ⋅ 06/06 ⋅ 0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

Spring发展历程总结

转自与 https://www.cnblogs.com/RunForLove/p/4641672.html 目前很多公司的架构,从Struts2迁移到了SpringMVC。你有想过为什么不使用Servlet+JSP来构建Java web项目,而是采用SpringMVC呢?...

onedotdot ⋅ 43分钟前 ⋅ 0

Python模块/包/库安装(6种方法)

Python模块/包/库安装(6种方法) 冰颖机器人 2016-11-29 21:33:26 一、方法1: 单文件模块 直接把文件拷贝到 $python_dir/Lib 二、方法2: 多文件模块,带setup.py 下载模块包(压缩文件zip...

cswangyx ⋅ 今天 ⋅ 0

零基础学习大数据人工智能,学习路线篇!系统规划大数据之路?

大数据处理技术怎么学习呢?首先我们要学习Python语言和Linux操作系统,这两个是学习大数据的基础,学习的顺序不分前后。 Python:Python 的排名从去年开始就借助人工智能持续上升,现在它已经...

董黎明 ⋅ 今天 ⋅ 0

openJdk和sun jdk的区别

使用过LINUX的人都应该知道,在大多数LINUX发行版本里,内置或者通过软件源安装JDK的话,都是安装的OpenJDK, 那么到底什么是OpenJDK,它与SUN JDK有什么关系和区别呢? 历史上的原因是,Ope...

jason_kiss ⋅ 今天 ⋅ 0

梳理

Redux 是 JavaScript 状态容器,提供可预测化的状态管理。 它是JS的状态容器,是一种解决问题的方式,所以即可以用于 react 也可以用于 vue。 需要理解其思想及实现方式。 应用中所有的 stat...

分秒 ⋅ 今天 ⋅ 0

Java 后台判断是否为ajax请求

/** * 是否是Ajax请求 * @param request * @return */public static boolean isAjax(ServletRequest request){return "XMLHttpRequest".equalsIgnoreCase(((HttpServletReques......

JavaSon712 ⋅ 今天 ⋅ 0

Redis 单线程 为何却需要事务处理并发问题

Redis是单线程处理,也就是命令会顺序执行。那么为什么会存在并发问题呢? 个人理解是,虽然redis是单线程,但是可以同时有多个客户端访问,每个客户端会有 一个线程。客户端访问之间存在竞争...

码代码的小司机 ⋅ 今天 ⋅ 0

到底会改名吗?微软GVFS 改名之争

微软去年透露了 Git Virtual File System(GVFS)项目,GVFS 是 Git 版本控制系统的一个开源插件,允许 Git 处理 TB 规模的代码库,比如 270 GB 的 Windows 代码库。该项目公布之初就引发了争...

linux-tao ⋅ 今天 ⋅ 0

笔试题之Java基础部分【简】【二】

1.静态变量和实例变量的区别 在语法定义上的区别:静态变量前要加static关键字,而实例变量前则不加。在程序运行时的区别:实例变量属于某个对象的属性,必须创建了实例对象,其中的实例变...

anlve ⋅ 今天 ⋅ 0

Lombok简单介绍及使用

官网 通过简单注解来精简代码达到消除冗长代码的目的 优点 提高编程效率 使代码更简洁 消除冗长代码 避免修改字段名字时忘记修改方法名 4.idea中安装lombnok pom.xml引入 <dependency> <grou...

to_ln ⋅ 今天 ⋅ 0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

返回顶部
顶部