如何绘制填充颜色不是纯色而是图像的MKCircle
如何绘制填充颜色不是纯色而是图像的MKCircle
提问于 2013-01-29 00:32:42
我发现了如何在地图注解周围画圆圈。我是这样做的：
MKCircle *circle = [MKCircle circleWithCenterCoordinate:theCoordinate radius:15000];
[myMap addOverlay:circle];
-(MKOverlayView *)mapView:(MKMapView *)mapView viewForOverlay:(id)overlay
{
MKCircleView *circleView = [[MKCircleView alloc] initWithOverlay:overlay];
circleView.fillColor =[UIColor redColor];
return circleView;
}它工作正常，但我想画一个圆圈，它的填充颜色不是实心的，如下所示：
回答 6
Stack Overflow用户
回答已采纳
发布于 2013-02-06 01:11:56
要绘制具有渐变的圆，您必须提供自己的注释视图类，因为现有的注释视图类都不支持它。您可以做的是在MKCircleView的子类中覆盖- (void)fillPath:(CGPathRef)path inContext:(CGContextRef)context方法。下面是一些代码(非优化的，带有硬编码的填充参数)来帮助您入门：
@interface TWOGradientCircleView : MKCircleView
@end
@implementation TWOGradientCircleView
- (void)fillPath:(CGPathRef)path inContext:(CGContextRef)context
{
CGRect rect = CGPathGetBoundingBox(path);
CGContextAddPath(context, path);
CGContextClip(context);
CGFloat gradientLocations[2] = {0.6f, 1.0f};
// Start color white with 0.25 alpha,
// End color green with 0.25 alpha
CGFloat gradientColors[8] = {1.0f, 1.0f, 1.0f, 0.25f, 0.0f, 1.0f, 0.0f, 0.25f};
CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceRGB();
CGGradientRef gradient = CGGradientCreateWithColorComponents(colorSpace, gradientColors, gradientLocations, 2);
CGColorSpaceRelease(colorSpace);
CGPoint gradientCenter = CGPointMake(CGRectGetMidX(rect), CGRectGetMidY(rect));
CGFloat gradientRadius = MIN(rect.size.width, rect.size.height) / 2;
CGContextDrawRadialGradient(context, gradient, gradientCenter, 0, gradientCenter, gradientRadius, kCGGradientDrawsAfterEndLocation);
CGGradientRelease(gradient);
}要使用它，只需用TWOGradientCircleView替换MKCircleView
- (MKOverlayView *)mapView:(MKMapView *)mapView viewForOverlay:(id)overlay
{
MKCircleView *circleView = [[TWOGradientCircleView alloc] initWithOverlay:overlay];
return circleView;
}如果您想使用图像而不是绘制渐变，您可以用图像绘制替换上面的渐变绘制。因为放大会模糊图像，你应该禁用缩放，或者平铺图像，就像苹果在WWDC10的一次会议上演示的那样(参见here中的存储库及其示例代码)。使用模式图像设置UIColor在半径为15000的情况下不起作用(除非您使用非常非常大的图像；)。
Stack Overflow用户
发布于 2013-12-04 00:35:23
使用MKCircleRenderer的iOS 7的答案...
您应该继承MKCircleRenderer的子类，并覆盖fillPath:inContext方法，类似于这个问题的公认答案。例如：
@implementation MKGradientCircleRenderer
- (void)fillPath:(CGPathRef)path inContext:(CGContextRef)context
{
CGRect rect = CGPathGetBoundingBox(path);
CGContextAddPath(context, path);
CGContextClip(context);
CGFloat gradientLocations[2] = {0.6f, 1.0f};
// Start color white with 0.25 alpha,
// End color green with 0.25 alpha
CGFloat gradientColors[8] = {1.0f, 1.0f, 1.0f, 0.25f, 0.0f, 1.0f, 0.0f, 0.25f};
CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceRGB();
CGGradientRef gradient = CGGradientCreateWithColorComponents(colorSpace, gradientColors, gradientLocations, 2);
CGColorSpaceRelease(colorSpace);
CGPoint gradientCenter = CGPointMake(CGRectGetMidX(rect), CGRectGetMidY(rect));
CGFloat gradientRadius = MIN(rect.size.width, rect.size.height) / 2;
CGContextDrawRadialGradient(context, gradient, gradientCenter, 0, gradientCenter, gradientRadius, kCGGradientDrawsAfterEndLocation);
CGGradientRelease(gradient);
}然后在您的MKMapView委托中，实现以下方法...
-(MKOverlayRenderer *)mapView:(MKMapView*)mapView rendererForOverlay:(id<MKOverlay>)overlay {
MKCircle * circle = (MKCircle *)overlay;
MKGradientCircleRenderer * renderer = [[MKGradientCircleRenderer alloc] initWithCircle:circle];
return renderer;
}这将允许您达到相同的效果，但使用iOS 7中提供的新方法。
Stack Overflow用户
发布于 2016-02-24 07:42:37
为了在SWIFT2.0 (iOS7+)中实现该解决方案，我使用了以下解决方案
import Foundation
import MapKit
class TWOGradientCircleRenderer: MKCircleRenderer {
override func fillPath(path: CGPath, inContext context: CGContext) {
let rect:CGRect = CGPathGetBoundingBox(path)
CGContextAddPath(context, path);
CGContextClip(context);
let gradientLocations: [CGFloat] = [0.6, 1.0];
let gradientColors: [CGFloat] = [1.0, 1.0, 1.0, 0.25, 0.0, 1.0, 0.0, 0.25];
let colorSpace = CGColorSpaceCreateDeviceRGB();
let gradient = CGGradientCreateWithColorComponents(colorSpace, gradientColors, gradientLocations, 2);
let gradientCenter = CGPointMake(CGRectGetMidX(rect), CGRectGetMidY(rect));
let gradientRadius = min(rect.size.width, rect.size.height) / 2;
CGContextDrawRadialGradient(context, gradient, gradientCenter, 0, gradientCenter, gradientRadius, .DrawsAfterEndLocation);
}
}在你的MKMapViewDelegate中，你需要添加
func mapView(mapView: MKMapView, rendererForOverlay overlay: MKOverlay) -> MKOverlayRenderer {
if overlay is MKCircle {
let circleRenderer = TWOGradientCircleRenderer(overlay: overlay)
return circleRenderer
} else {
return MKOverlayRenderer()
}
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/14566614
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号