Ios Swift-如何使用UIGraphics混合模式?
我想为AppleWatch开发一种进度条动画。 我决定用UIGraphicContext来完成这一切 因为我是一个完全的初学者,我真的不明白如何将某种“globalCompositeOperation”应用到我的上下文中 为了更好地说明我的想法,这里有一些图片:Ios Swift-如何使用UIGraphics混合模式?,ios,swift,watchkit,uigraphicscontext,Ios,Swift,Watchkit,Uigraphicscontext,我想为AppleWatch开发一种进度条动画。 我决定用UIGraphicContext来完成这一切 因为我是一个完全的初学者,我真的不明白如何将某种“globalCompositeOperation”应用到我的上下文中 为了更好地说明我的想法,这里有一些图片: 这是我到目前为止的源代码: let size = CGSize(width: 300, height: 100) UIGraphicsBeginImageContext(size) let context = UIGraphi
这是我到目前为止的源代码:
let size = CGSize(width: 300, height: 100)
UIGraphicsBeginImageContext(size)
let context = UIGraphicsGetCurrentContext()!
context.setFillColor(UIColor.red.cgColor)
context.fill(CGRect(x: 0.0, y: 0.0, width: size.width * 0.5, height: size.height))
context.setBlendMode(CGBlendMode.destinationOver)
let count = 5;
let padding = (size.width / CGFloat(count)) * 0.5
for i in 0...count {
let offsetX = size.width * (CGFloat(i) / CGFloat(count))
let rect = CGRect(x: offsetX + padding/2, y: 0, width: padding, height: size.height)
context.setFillColor(UIColor.green.cgColor)
context.fill(rect)
}
UIGraphicsEndImageContext()
我猜这是一种错误的方法,因为结果更像这样:
任何帮助都将不胜感激。提前谢谢。您需要
.sourcetop
。下面是一个演示:
let green = UIImage(named:"green.png")! // your original 5 green rects
let sz = green.size
let red = UIGraphicsImageRenderer(size:sz).image {
ctx in
UIColor.red.setFill()
// width value determines how much we will fill
ctx.fill(CGRect(x: 0, y: 0, width: sz.width/2, height: sz.height))
}
let result = UIGraphicsImageRenderer(size:sz).image {
ctx in
green.draw(at: .zero)
red.draw(at: .zero, blendMode: .sourceAtop, alpha: 1)
}
只需改变
宽度:sz.width/2处的值,以获得不同的“温度计”量。基于@matt使用的回答。SourceTop
我找到了WatchKit的有效解决方案:
let size = CGSize(width: 300, height: 100)
UIGraphicsBeginImageContext(size)
let context = UIGraphicsGetCurrentContext()!
let count = 5;
let padding = (size.width / CGFloat(count)) * 0.5
for i in 0...count {
let offsetX = size.width * (CGFloat(i) / CGFloat(count))
let rect = CGRect(x: offsetX + padding/2, y: 0, width: padding, height: size.height)
context.setFillColor(UIColor.green.cgColor)
context.fill(rect)
}
context.setFillColor(UIColor.red.cgColor)
context.setBlendMode(CGBlendMode.sourceAtop)
context.fill(CGRect(x: 0.0, y: 0.0, width: size.width * 0.5, height: size.height))
UIGraphicsEndImageContext()
我猜这不是一个有效的Watchkit解决方案:帖子中的家伙在谈论堆叠多个视图-这对于WK来说是没有选择的。谢谢你@谢谢你的回答。看起来是iOS的有效解决方案,但不幸的是,WiGraphicSimageRenderer在watchOS上不可用。是的,很抱歉!但它告诉你这是正确的混合模式,这是你真正需要知道的。