• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    公众号

iOS8使用CoreGraphics实现渐变效果-Swift基础教程

原作者: [db:作者] 来自: [db:来源] 收藏 邀请

Core Graphics是一个强大的底层API,在这篇教程中我们主要使用Core Graphics来实现渐变效果,为了简单起见,我们采用线性渐变。线性渐变是从起点到终点颜色进行顺序渐变。教程在iOS8.1及Xcode6.1下编译通过。

打开Xcode,新建项目选择Single View Application,Product Name填写IOS8SwiftGradientsCoreGraphicsTutorial,Organization Name和Organization Identifier自行填写,选择Swift语言与iPhone设备。

项目增加一个新文件iOS->Source->Cocoa Touch Class,创建gradientView类并且继承于UIView

打开Storyboard,选中View然后打开Identity Inspector面板,将Custom Class选择为gradientView

打开gradientView.swift文件,修改drawRect方法如下:

// 1
      var currentContext = UIGraphicsGetCurrentContext()

      // 2
      CGContextSaveGState(currentContext);

      // 3
      var colorSpace = CGColorSpaceCreateDeviceRGB()

      // 4
      var startColor = UIColor.redColor();
      var startColorComponents = CGColorGetComponents(startColor.CGColor)
      var endColor = UIColor.blueColor();
      var endColorComponents = CGColorGetComponents(endColor.CGColor)

      // 5
      var colorComponents
        = [startColorComponents[0], startColorComponents[1], startColorComponents[2], startColorComponents[3], endColorComponents[0], endColorComponents[1], endColorComponents[2], endColorComponents[3]]

      // 6
      var locations:[CGFloat] = [0.0, 1.0]

      // 7
      var gradient = CGGradientCreateWithColorComponents(colorSpace,&colorComponents,&locations,2)

      var startPoint = CGPointMake(0, self.bounds.height)
      var endPoint = CGPointMake(self.bounds.width, self.bounds.height)

      // 8
      CGContextDrawLinearGradient(currentContext,gradient,startPoint,endPoint, 0)

      // 9
      CGContextRestoreGState(currentContext);

1.CGContextRef是图形上下文,可以将其理解为一块画布,我们可以在上面进行绘画操作

2.将graphical context保持,这样稍后可以恢复

3.CGColorSpaceRef这是一个色彩范围的容器,通常我们需要用到RGB色彩空间

4.定义了开始渐变与结束渐变点颜色,CGColor是一个低级别的Color Components,调用CGColorGetcomponents可以从CGColor结构体中获取Color Components

5.创建颜色分量数组(数组包含CGFloat类型的红、绿、蓝和alpha值)

6.设置渐变位置

7.使用CGGradientCreateWithColorComponents创建包含渐变的CGGradientRef对象

8.调用CGContextDrawLinearGradient绘制渐变

9.恢复Graphical Context状态

编译运行项目后,效果如下

原文:http://www.ioscreator.com/tutorials/draw-gradients-core-graphics-ios8-swift


鲜花

握手

雷人

路过

鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
上一篇:
[Swift]LeetCode97.交错字符串|InterleavingString发布时间:2022-07-13
下一篇:
喜欢 Swift 编程语言的人主要是初学者?发布时间:2022-07-13
热门推荐
热门话题
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap