TGImage
一款以最时髦的方式来使用UIImage的swift插件
Features
- 支持链式编程
- 支持with 和size两种开启模式
- 支持+= 、+两种图片相加操作
- 用例丰富、快速使用
Usage
size开启模式
UIImage.size() 或.resizable()
.color .border .corner
.image
.position其中size开启的是固定大小模式、resizable开启的是可变大小模式
其中color支持传入渐变色，如 gradient: [.lightGray, .white], locations: [0, 1], from: CGPoint(x: 0, y: 1), to: CGPoint(x: 0, y: 0)
其中border可以设置color、width、radius、alignment
其中corner可以分别设置4个角或统一设置四个角为同一个值
其中image用于生成 UIImage
其中position用于后面+或+=时用
注意：按上面大的顺序链式编程，在size和image之间的color 、border 、corner没有顺序要求
size开启方式
UIImage.size(width: CGFloat, height: CGFloat)
UIImage.size(_ size: CGSize)
UIImage.resizable()with CGContext开启模式
支持UIImage.with类方式开启或image.with类实例开启
类方式是返回单图，实例方式开始是在实例图的基础再加上with图，实际是两图相加模式
with开启方式
UIImage.with(width: CGFloat, height: CGFloat, block: ContextBlock)//单
image.with(size: CGSize, opaque: Bool = false, scale: CGFloat = 0, block: ContextBlock)//相加
image.with(_ block: ContextBlock)//单应用场景及Demo(以下图都是用代码绘制的哦)
在cell的某角上放一个某角载剪的渐变图
在某图上再画图
多个图相加放入容器图中
…
1
UIImageView(image: ({ () -> UIImage in
var container = UIImage.size(width: 180, height: 20)
.color(.clear)
.image
for i in 0..<7{
let doti = UIImage.size(width: 20, height: 20)
.color(gradient: [UIColor.randomColor(), UIColor.randomColor()], locations: [0, 1], from: CGPoint(x: 0, y: 0), to: CGPoint(x: 1, y: 1))
.corner(radius: 10)
.image
.position(CGPoint(x: i * 20 + (i + 1) * 3, y: 0))
container = container + doti
}
return container
})())
2
UIImageView(image: ({ () -> UIImage in
var container = UIImage.size(width: 30, height: 120)
.color(.clear)
.image
for i in 0..<4{
let doti = UIImage.size(width: CGFloat(30 - i * 4), height: CGFloat(30 - i * 4))
.color(gradient: [UIColor.randomColor(), UIColor.randomColor()], locations: [0, 1], from: CGPoint(x: 0, y: 0), to: CGPoint(x: 1, y: 1))
.corner(radius: CGFloat(30 - i * 4) * 0.5)
.image
.position(CGPoint(x: i * 2, y: 30 * i + (i + 1) * 3))
container += doti
}
return container
})())
3
UIImageView(image:
UIImage.size(width: 27, height: 27)
.corner(radius: 13.5)
.color(.white)
.border(color: .lightGray)
.border(width: 2)
.image
.with({ context in
context.setLineCap(.round)
UIColor.lightGray.setStroke()
context.setLineWidth(2)
context.move(to: CGPoint(x: 6, y: 12))
context.addLine(to: CGPoint(x: 9, y: 18))
context.move(to: CGPoint(x: 9, y: 18))
context.addLine(to: CGPoint(x: 21, y: 9))
context.strokePath()
})
)
4
UIImageView(image: UIImage.size(width: 100, height: 100)
.color(gradient: [.green, .blue], locations: [0, 1], from: CGPoint(x: 0, y: 1), to: CGPoint(x: 0, y: 0))
.border(gradient: [.red, .yellow], locations: [0, 1], from: CGPoint(x: 0, y: 0), to: CGPoint(x: 1, y: 0))
.border(width: 5)
.border(alignment: .outside)
.corner(topLeft: 20)
.corner(topRight: 50)
.corner(bottomLeft: 50)
.corner(bottomRight: 20)
.image)
5
UIImageView(image: ({ () -> UIImage in
let background = UIImage.size(width: 120, height: 120)
.color(gradient: [.black, .white], locations: [0, 1], from: CGPoint(x: 0, y: 0), to: CGPoint(x: 0, y: 1))
.corner(radius: 13.5)
.image
let circle = UIImage.size(width: 106, height: 106)
.color(.white)
.corner(radius: 50)
.image
let center = UIImage.size(width: 8, height: 8)
.color(.black)
.corner(radius: 3)
.image
let clock = background + circle + center
return clock.with { context in
context.setLineCap(.round)
UIColor.black.setStroke()
context.setLineWidth(2)
context.move(to: CGPoint(x: clock.size.width / 2, y: clock.size.height / 2))
context.addLine(to: CGPoint(x: clock.size.width / 2 - 5, y: 15))
context.move(to: CGPoint(x: clock.size.width / 2, y: clock.size.height / 2))
context.addLine(to: CGPoint(x: clock.size.width - 25, y: clock.size.height / 2 - 3))
context.strokePath()
UIColor.red.setStroke()
context.setLineWidth(1)
context.move(to: CGPoint(x: clock.size.width / 2 + 8, y: clock.size.height / 2 - 7))
context.addLine(to: CGPoint(x: 26, y: clock.size.height / 2 + 35))
context.strokePath()
UIColor.red.setFill()
let rect = CGRect(x: clock.size.width / 2 - 1, y: clock.size.height / 2 - 1, width: 3, height: 3)
context.fillEllipse(in: rect)
}
})())
6
UIImageView(image:
({ () -> UIImage in
let circle = UIImage.size(width: 8, height: 8)
.color(.white)
.corner(radius: 4)
.image
.position(CGPoint(x: 5, y: 5))
return UIImage.size(width: UIScreen.main.bounds.width*0.5, height: 44)
.color(gradient: [.red, .white], locations: [0, 1], from: CGPoint(x: 0, y: 0), to: CGPoint(x: 1, y: 1))
.corner(bottomRight: 20)
.image + circle
})())
UIImageView(image:
({ () -> UIImage in
let circle = UIImage.size(width: 8, height: 8)
.color(.white)
.corner(radius: 4)
.image
.position(CGPoint(x: UIScreen.main.bounds.width * 0.5 - 15, y: 5))
return UIImage.size(width: UIScreen.main.bounds.width*0.5, height: 44)
.color(gradient: [.white, .lightGray], locations: [0, 1], from: CGPoint(x: 0, y: 0), to: CGPoint(x: 1, y: 1))
.corner(bottomLeft: 20)
.image + circle
})())
UIImageView(image:
({ () -> UIImage in
return UIImage.size(width: UIScreen.main.bounds.width*0.5, height: 44)
.color(gradient: [.white, UIColor.randomColor().withAlphaComponent(0.5)], locations: [0, 1], from: CGPoint(x: 0, y: 0), to: CGPoint(x: 1, y: 1))
.corner(topLeft: 20)
.image
})())
UIImageView(image:
({ () -> UIImage in
return UIImage.size(width: UIScreen.main.bounds.width*0.5, height: 22)
.color(gradient: [UIColor.randomColor(), .white], locations: [0, 1], from: CGPoint(x: 0, y: 0), to: CGPoint(x: 1, y: 1))
.corner(topLeft: 10)
.image
})())
UIImageView(image:
({ () -> UIImage in
return UIImage.size(width: UIScreen.main.bounds.width*0.5, height: 22)
.color(gradient: [.lightGray, .white], locations: [0, 1], from: CGPoint(x: 0, y: 0), to: CGPoint(x: 1, y: 1))
.corner(bottomLeft: 10)
.image
})())
更多使用配置组合效果请download本项目或fork本项目查看
Installation
-
下载并拖动TGImage.swift到你的工程中
-
Cocoapods
pod 'TGImage'
Reference
- http://blog.csdn.net/callzjy
- https://github.com/targetcloud/baisibudejie
- https://github.com/targetcloud/TGRefreshSwift
- https://github.com/targetcloud/TGLabel
- https://github.com/targetcloud/TGPhotoPicker
如果你觉得赞，请Star
