Comment créer une ligne pointillée avec des coins symésortingques

Je crée une ligne pointillée à partir d'un UIBezierPath qui ressemble à ceci:

Ligne pointillée

C'est le code que j'utilise pour build et dessiner le path:

 const CGContextRef context = UIGraphicsGetCurrentContext(); const CGSize visibleSize = CGSizeMake(self.width - (kIndent * 2), self.height - (kIndent * 2)); UIBezierPath *borderPath = [UIBezierPath bezierPathWithRoundedRect:CGRectMake(kIndent, kIndent, visibleSize.width, visibleSize.height) cornerRadius:kCornerRadius]; CGContextSetStrokeColorWithColor(context, [UIColor colorWithWhite:1.0 alpha:0.5].CGColor); [borderPath setLineWidth:2.0]; [borderPath setLineCapStyle:kCGLineCapRound]; const CGFloat pattern[] = {6, 6}; [borderPath setLineDash:pattern count:2 phase:0]; [borderPath stroke]; 

Ce que je veux, c'est que chaque coin de ma case ait exactement les mêmes courbures les unes que les autres. Je sais que cela sera finalement déterminé par mes valeurs de model. J'ai essayé de calculer différentes valeurs à partir de la largeur de la forme (la largeur change avec la largeur de l'écran), mais je ne peux pas get le look désiré.

Quelqu'un a-t-il déjà fait cela ou a-t-il des idées à partager sur la façon dont je ferais cela?

C'est très simple:

 [yourView.layer setBorderWidth:5.0]; [yourView.layer setBorderColor:[[UIColor colorWithPatternImage:[UIImage imageNamed:@"DotedImage.png"]] CGColor]];///just add image name and create image with dashed or doted drawing and add here 

Ici, il vous suffit d'append le QuartzCore/QuartzCore.h dans le projet et de l'importer comme ci-dessous dans le file .m

 #import <QuartzCore/QuartzCore.h> 

Ou essayez d'utiliser

 - (void)drawDashedBorderAroundView:(UIView *)v { //border definitions CGFloat cornerRadius = 10; CGFloat borderWidth = 2; NSInteger dashPattern1 = 8; NSInteger dashPattern2 = 8; UIColor *lineColor = [UIColor orangeColor]; //drawing CGRect frame = v.bounds; CAShapeLayer *_shapeLayer = [CAShapeLayer layer]; //creating a path CGMutablePathRef path = CGPathCreateMutable(); //drawing a border around a view CGPathMoveToPoint(path, NULL, 0, frame.size.height - cornerRadius); CGPathAddLineToPoint(path, NULL, 0, cornerRadius); CGPathAddArc(path, NULL, cornerRadius, cornerRadius, cornerRadius, M_PI, -M_PI_2, NO); CGPathAddLineToPoint(path, NULL, frame.size.width - cornerRadius, 0); CGPathAddArc(path, NULL, frame.size.width - cornerRadius, cornerRadius, cornerRadius, -M_PI_2, 0, NO); CGPathAddLineToPoint(path, NULL, frame.size.width, frame.size.height - cornerRadius); CGPathAddArc(path, NULL, frame.size.width - cornerRadius, frame.size.height - cornerRadius, cornerRadius, 0, M_PI_2, NO); CGPathAddLineToPoint(path, NULL, cornerRadius, frame.size.height); CGPathAddArc(path, NULL, cornerRadius, frame.size.height - cornerRadius, cornerRadius, M_PI_2, M_PI, NO); //path is set as the _shapeLayer object's path _shapeLayer.path = path; CGPathRelease(path); _shapeLayer.backgroundColor = [[UIColor clearColor] CGColor]; _shapeLayer.frame = frame; _shapeLayer.masksToBounds = NO; [_shapeLayer setValue:[NSNumber numberWithBool:NO] forKey:@"isCircle"]; _shapeLayer.fillColor = [[UIColor clearColor] CGColor]; _shapeLayer.strokeColor = [lineColor CGColor]; _shapeLayer.lineWidth = borderWidth; _shapeLayer.lineDashPattern = [NSArray arrayWithObjects:[NSNumber numberWithInt:dashPattern1], [NSNumber numberWithInt:dashPattern2], nil]; _shapeLayer.lineCap = kCALineCapRound; //_shapeLayer is added as a sublayer of the view, the border is visible [v.layer addSublayer:_shapeLayer]; v.layer.cornerRadius = cornerRadius; } 

Vous pouvez avoir une étude dans

http://lukagabric.com/cashapelayer-example-round-corners-view-with-dashed-line-border/

https://github.com/lukagabric/LBorderView

dessiner une ligne pointillée en utilisant CALayer

UIView avec une ligne pointillée

C'est ce que j'ai fait avant. Pas parfait mais je pense que cela peut vous aider.

  - (void)tailorRect:(CGRect)aRect dotsWidth:(CGFloat)dotWidth radius:(CGFloat)radius withColor:(UIColor*)color{ CGContextRef c = UIGraphicsGetCurrentContext(); CGContextSaveGState(c); CGFloat minSpacing = 10; CGFloat mWidth = aRect.size.width - radius *2; CGFloat mHeight = aRect.size.height - radius *2; int countW = mWidth / (dotWidth + minSpacing); int countH = mHeight / (dotWidth + minSpacing); CGFloat spacingW = (mWidth - (dotWidth * countW)) / (countW + 1); CGFloat spacingH = (mHeight -(dotWidth * countH)) / (countH + 1); CGContextSetLineCap(c, kCGLineCapRound); CGContextSetLineWidth(c, 1.2); CGRect tempRect = aRect; for (int r = 0; r<=1; r++) { if (r==0) { CGContextSetStrokeColorWithColor(c, [[UIColor whiteColor] colorWithAlphaComponent:0.9].CGColor); aRect = CGRectOffset(tempRect, 0, 0.5); } else { CGContextSetStrokeColorWithColor(c, color.CGColor); aRect = tempRect; } for (int w = 0; w<=1; w++) { CGFloat y = (w==0) ? aRect.origin.y : CGRectGetMaxY(aRect); CGPoint pointsW[countW*2]; for (int i = 0; i<countW*2; i++) { CGFloat x; CGFloat startPointX = radius + spacingW +aRect.origin.x; if (i%2 != 0) { x = startPointX + dotWidth * (i+1)/ 2 + spacingW * ((int)i/2); } else { x = startPointX + (dotWidth+spacingW) * ((int)i/2); } pointsW[i] = CGPointMake(x, y); } CGContextStrokeLineSegments(c, pointsW, countW*2); } for (int h = 0; h<=1; h++) { CGFloat x = (h==0) ? aRect.origin.x : CGRectGetMaxX(aRect); CGPoint pointsH[countH*2]; for (int j = 0; j<countH*2; j++) { CGFloat startY = radius + spacingH + aRect.origin.y; CGFloat y; if (j%2 != 0) { y = startY + dotWidth * (j+1)/2 + spacingH * ((int)j/2); } else { y = startY + (dotWidth + spacingH) * ((int)j/2); } pointsH[j] = CGPointMake(x, y); } CGContextStrokeLineSegments(c, pointsH, countH*2); } //radius for (int i = 0; i<4; i++) { CGPoint point0; CGPoint point1; CGPoint point2; switch (i) { case 0: point0 = CGPointMake(CGRectGetMinX(aRect), CGRectGetMinY(aRect) + radius); point1 = CGPointMake(CGRectGetMinX(aRect), CGRectGetMinY(aRect)); point2 = CGPointMake(CGRectGetMinX(aRect) + radius, CGRectGetMinY(aRect)); break; case 1: point0 = CGPointMake(CGRectGetMaxX(aRect) - radius, CGRectGetMinY(aRect)); point1 = CGPointMake(CGRectGetMaxX(aRect), CGRectGetMinY(aRect)); point2 = CGPointMake(CGRectGetMaxX(aRect) , CGRectGetMinY(aRect) +radius); break; case 2: point0 = CGPointMake(CGRectGetMaxX(aRect), CGRectGetMaxY(aRect) - radius); point1 = CGPointMake(CGRectGetMaxX(aRect), CGRectGetMaxY(aRect)); point2 = CGPointMake(CGRectGetMaxX(aRect) - radius, CGRectGetMaxY(aRect)); break; case 3: point0 = CGPointMake(CGRectGetMinX(aRect), CGRectGetMaxY(aRect) - radius); point1 = CGPointMake(CGRectGetMinX(aRect), CGRectGetMaxY(aRect)); point2 = CGPointMake(CGRectGetMinX(aRect) + radius, CGRectGetMaxY(aRect)); break; default: break; } CGContextMoveToPoint(c, point0.x, point0.y); CGContextAddArcToPoint(c, point1.x, point1.y, point2.x, point2.y, radius); CGContextStrokePath(c); } } CGContextRestoreGState(c); }