iOS 2D绘图详解（Quartz 2D）之阴影和渐变(Shadow,Gradient)

原创Blog，转载请注明出处
http://blog.youkuaiyun.com/hello_hwc?viewmode=list
我的stackoverflow

前四篇基础博客路径

• iOS 2D绘图详解（Quartz 2D）之概述
• iOS 2D绘图详解（Quartz 2D）之路径(点,直线,虚线,曲线,圆弧,椭圆,矩形)
• iOS 2D绘图详解（Quartz 2D）之路径(stroke,fill,clip,subpath,blend)
• iOS 2D绘图详解（Quartz 2D）之Transform(CTM,Translate,Rotate,Scale)

---

前言：这个系列写道这里已经是第五篇了，本文会介绍下阴影和渐变的基础知识，以及一些基本的Demo Code展示，应该还会有两篇，介绍下Bitmap绘制以及Pattern等知识。

---

Shadow

shadow（阴影）的目的是为了使UI更具有立体感，如图

shadow主要有三个影响因素

• x off-set 决定阴影沿着x的偏移量
• y off-set 决定阴影沿着y的偏移量
• blur value 决定了阴影的边缘区域是不是模糊的

其中不同的blur效果如图

注意

Shadow也是绘制状态相关的，意味着如果仅仅要绘制一个subpath的shadow，要注意save和restore状态。

相关函数

CGContextSetShadow
CGContextSetShadowWithColor//位移区别是设置了阴影颜色

参数

• context 绘制画板
• offset 阴影偏移量，参考context的坐标系
• blur 非负数，决定阴影的模糊程度
  示例代码

- (void)drawRect:(CGRect)rect {
    CGContextRef context = UIGraphicsGetCurrentContext();
    CGContextAddArc(context,40, 40, 20, 0,M_2_PI,0);
    CGContextSetLineCap(context, kCGLineCapRound);
    CGContextSetLineWidth(context,3.0);
    CGContextSetShadow(context,CGSizeMake(4.0, 4.0),1.0);
    CGContextStrokePath(context);
}
-(instancetype)initWithFrame:(CGRect)frame{
    if(self = [super initWithFrame:frame]){
        self.opaque = NO;
        self.layer.borderColor = [UIColor lightGrayColor].CGColor;
        self.layer.borderWidth =  1.0;
    }
    return self;
}

效果
<