ios – 沿路径绘制图案

概述我的目标是采取这样的模式   并沿圆形路径重复绘制,以产生类似于此图像的内容：    我在其他问题和完整的演示项目here中找到了几个代码示例,但结果如下： 我认为这两个图像之间的区别是显而易见的,但我发现很难描述(原谅我缺乏图形词汇).结果似乎是没有所需的图案旋转/变形的平铺.我认为我可以忍受缺乏变形,但旋转是关键.我认为也许可以/应该修改绘制回调以包含旋转,但是无法弄清楚如何在回调点检索/确定 我的目标是采取这样的模式

 

并沿圆形路径重复绘制,以产生类似于此图像的内容：

  

我在其他问题和完整的演示项目here中找到了几个代码示例,但结果如下：

我认为这两个图像之间的区别是显而易见的,但我发现很难描述(原谅我缺乏图形词汇).结果似乎是没有所需的图案旋转/变形的平铺.我认为我可以忍受缺乏变形,但旋转是关键.我认为也许可以/应该修改绘制回调以包含旋转,但是无法弄清楚如何在回调点检索/确定角度.

我考虑过一种方法,我手动变形/旋转图像并围绕中心点绘制几次以达到我想要的效果,但我相信CoreGraphics可以更高效率和更少的代码来实现.

任何关于如何实现我想要的结果的建议将不胜感激.

以下是ChalkCircle项目的相关代码：

const float kPatternWIDth = 8;const float kPatternHeight = 8;voID DrawPatternCellCallback(voID *info,CGContextRef cgContext){UIImage *patternImage = [UIImage imagenamed:@"chalk_brush.png"];CGContextDrawImage(cgContext,CGRectMake(0,kPatternWIDth,kPatternHeight),patternImage.CGImage);}- (voID)drawRect:(CGRect)rect {float startDeg = 0; // where to start drawingfloat endDeg = 360; // where to stop drawingint x = self.center.x;int y = self.center.y;int radius = (self.bounds.size.wIDth > self.bounds.size.height ? self.bounds.size.height : self.bounds.size.wIDth) / 2 * 0.8;CGContextRef ctx = UIGraphicsGetCurrentContext();const CGRect patternBounds = CGRectMake(0,kPatternHeight);const CGPatternCallbacks kPatternCallbacks = {0,DrawPatternCellCallback,NulL};CGAffinetransform patterntransform = CGAffinetransformIDentity;CGPatternRef strokePattern = CGPatternCreate(NulL,patternBounds,patterntransform,// horizontal spacingkPatternHeight,// vertical spacingkCGPatternTilingNodistortion,true,&kPatternCallbacks);CGfloat color1[] = {1.0,1.0,1.0};CGcolorSpaceRef patternSpace = CGcolorSpaceCreatePattern(NulL);CGContextSetstrokecolorSpace(ctx,patternSpace);CGContextSetstrokePattern(ctx,strokePattern,color1);CGContextSetlinewidth(ctx,4.0);CGContextMovetoPoint(ctx,x,y - radius);CGContextAddArc(ctx,y,radius,(startDeg-90)*M_PI/180.0,(endDeg-90)*M_PI/180.0,0);CGContextClosePath(ctx);CGContextDrawPath(ctx,kCGPathstroke);CGPatternRelease(strokePattern);strokePattern = NulL;CGcolorSpaceRelease(patternSpace);patternSpace = NulL;}

.来自SAM的解决方案

我修改了sam的解决方案来处理非方形图案,使结果居中,并通过从传入的图像中计算它们来删除硬编码的数字：

#define MAX_CIRCLE_DIAMETER   290.0f#define OVERLAP 1.5f-(voID) drawInCircle:(UIImage *)patternImage{    int numberOfImages = 12;    float diameter =  (MAX_CIRCLE_DIAMETER * numberOfImages * patternImage.size.wIDth) / ( (2.0 * M_PI * patternImage.size.height) + (numberOfImages * patternImage.size.wIDth));    //get the radius,circumference and image size    CGRect replicatorFrame = CGRectMake((320-diameter)/2.0f,60.0f,diameter,diameter);    float radius = diameter/2;    float circumference = M_PI * diameter;    float imageWIDth = circumference/numberOfImages;    float imageHeight = imageWIDth *  patternImage.size.height / patternImage.size.wIDth;    //create a replicator layer and add it to our vIEw    CAReplicatorLayer *replicator = [CAReplicatorLayer layer];    replicator.frame = replicatorFrame;    [self.vIEw.layer addSublayer:replicator];    //configure the replicator    replicator.instanceCount = numberOfImages;    //apply a rotation transform for each instance    CAtransform3D transform = CAtransform3DIDentity;    transform = CAtransform3DRotate(transform,M_PI / (numberOfImages/2),1);    replicator.instancetransform = transform;    //create a sublayer and place it insIDe the replicator    CALayer *layer = [CALayer layer];    //the frame places the layer in the mIDdle of the replicator layer and on the outsIDe of    //the replicator layer so that the the size is accurate relative to the circumference    layer.frame = CGRectMake(radius - (imageWIDth/2.0) - (OVERLAP/2.0),-imageHeight/2.0,imageWIDth+OVERLAP,imageHeight);    layer.anchorPoint = CGPointMake(0.5,1);    [replicator addSublayer:layer];    //apply a perspective transform to the layer    CAtransform3D perspectivetransform = CAtransform3DIDentity;    perspectivetransform.m34 = 1.0f / -radius;    perspectivetransform = CAtransform3DRotate(perspectivetransform,(M_PI_4),-1,0);    layer.transform = perspectivetransform;    //set the image as the layer's contents    layer.contents = (__brIDge ID)patternImage.CGImage;}

解决方法 使用Core Animation的复制器层,我设法创建了这个结果：

我认为它接近你想要的东西.在此示例中,所有图像都是正方形,并且每个图像都应用了3d X旋转.

#import <QuartzCore/QuartzCore.h>    //set the number of images and the diameter (wIDth) of the circleint numberOfImages = 30;float diameter = 450.0f;//get the radius,circumference and image sizefloat radius = diameter/2;float circumference = M_PI * diameter;float imageSize = circumference/numberOfImages;//create a replicator layer and add it to our vIEwCAReplicatorLayer *replicator = [CAReplicatorLayer layer];replicator.frame = CGRectMake(100.0f,100.0f,diameter);[self.vIEw.layer addSublayer:replicator];//configure the replicatorreplicator.instanceCount = numberOfImages;//apply a rotation transform for each instanceCAtransform3D transform = CAtransform3DIDentity;transform = CAtransform3DRotate(transform,1);replicator.instancetransform = transform;//create a sublayer and place it insIDe the replicatorCALayer *layer = [CALayer layer];//the frame places the layer in the mIDdle of the replicator layer and on the outsIDe of the replicator layer so that the the size is accurate relative to the circumferencelayer.frame = CGRectMake(radius - (imageSize/2),-imageSize/2,imageSize,imageSize);layer.anchorPoint = CGPointMake(0.5,1);[replicator addSublayer:layer];//apply a perspective transofrm to the layerCAtransform3D perspectivetransform = CAtransform3DIDentity;perspectivetransform.m34 = 1.0f / -radius;perspectivetransform = CAtransform3DRotate(perspectivetransform,0);layer.transform = perspectivetransform;//set the image as the layer's contentslayer.contents = (__brIDge ID)[UIImage imagenamed:@"WCR3Q"].CGImage;

总结

以上是内存溢出为你收集整理的ios – 沿路径绘制图案全部内容，希望文章能够帮你解决ios – 沿路径绘制图案所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。