2016-06-15 3 views
2

Как бы одна перекрестная штриховка (применить набор параллельных линий на 45 градусов) по заполнению формы в IOS с использованием основной графики? Образец кода?Crosshatch в IOS с использованием CoreGraphics?

(Я специально заинтересован в использовании с MKPolygon в MKMapKit, однако на тот момент просто пытаюсь увидеть, если это возможно в UIView с помощью DrawRect ?. Так заполнить фон в UIView с crosshatch'ing)

ответ

2

Вот что я говорил о более чем в компании Apple Developer Forum:

#import "CrossHatchView.h" 

@implementation CrossHatchView 

static CGFloat sides = 5.0; 

- (void)drawRect:(CGRect)rect 
{ 
    CGRect bounds = self.bounds; 

    UIBezierPath *path = [UIBezierPath bezierPath]; 

    CGFloat xCentre = CGRectGetMidX(bounds); 
    CGFloat yCentre = CGRectGetMidY(bounds); 
    CGFloat radius = 0.0; 

    if (CGRectGetWidth(bounds) > CGRectGetHeight(bounds)) { 
     radius = CGRectGetHeight(bounds)/2.0; 
    } else { 
     radius = CGRectGetWidth(bounds)/2.0; 
    } 
    CGFloat angleIncrement = 2.0 * M_PI/sides; 

    CGFloat initialAngle = (M_PI + (2.0 * M_PI/sides))/2.0; 

    for (NSUInteger i = 0; i < sides; i++) { 
     CGFloat angle = initialAngle + i * angleIncrement; 
     CGFloat x = xCentre + radius * cos(angle); 
     CGFloat y = yCentre + radius * sin(angle); 
     CGPoint point = CGPointMake(x, y); 
     if (i == 0) { 
      [path moveToPoint:point]; 
     } else { 
      [path addLineToPoint:point]; 
     } 
    } 
    [path closePath]; 
    [[UIColor cyanColor] set]; 
    [path addClip]; 

    CGRect pathBounds = [path bounds]; 

    [path removeAllPoints]; 
    CGPoint p1 = pathBounds.origin; 
    CGPoint p2 = CGPointMake(CGRectGetMaxX(pathBounds), CGRectGetMaxY(pathBounds)); 
    [path moveToPoint:p1]; 
    [path addLineToPoint:p2]; 
    path.lineWidth = 400.0; 
    CGFloat dashes[] = { 2.0, 2.0 }; 
    [path setLineDash:dashes count:2 phase:0.0]; 
    [[UIColor blackColor] set]; 
    [path stroke]; 
} 

@end 
3

Создайте UIImage, содержащий ваш шаблон перекрестной связи любым способом (например, рисуя его с помощью Core Graphics или загрузив его из PNG-файла).

Затем используйте +[UIColor colorWithPatternImage:] (Swift UIColor(patternImage:)), чтобы создать «цвет», который рисует изображение перекрестия.

Наконец, задайте цвет рисунка в качестве цвета заливки и заполните форму (предположительно, заполнив путь, который начерчивает фигуру, или используя UIRectFill).

Если вам нужно больше контроля над рисунком (чтобы изменить его черепицу или выровнять), вы можете перейти на уровень базовой графики и использовать CGPatternCreate и CGColorCreateWithPattern.

+0

Мне интересен подход, который не требует изображений. Вы предполагаете, что нет такого метода, как «градиент», который бы это сделал? Т.е. нужно было бы эффективно программно рисовать один в drawrect с помощью команд CG? – Greg

+1

Нет ничего встроенного, который автоматически нарисовал бы вам шаблон перекрестия. –

+0

Хорошо спасибо. Поэтому я постараюсь работать в UIVIew – Greg

2

эй попробовать этот пример кода, который я попробовал на 300x300 UIView

- (void)drawRect:(CGRect)rect 
{ 
    CGContextRef context = UIGraphicsGetCurrentContext(); 
    CGContextSetLineWidth(context, 1.5); 
    CGContextSetStrokeColorWithColor(context, [UIColor grayColor].CGColor); 
    int backward=0; 

    for (int i=0;i<15; i++) 
    { 
     CGContextMoveToPoint(context, backward, 0); 
     CGContextAddLineToPoint(context, 300, 300-backward); 
     backward=backward+20; 
    } 
    int backwardNegitive=0; 
    for (int i=0;i<15; i++) 
    { 
     CGContextMoveToPoint(context, 0,backwardNegitive); 
     CGContextAddLineToPoint(context, 300-backwardNegitive,300); 
     backwardNegitive=backwardNegitive+20; 
    } 
    int forward=0; 
    for (int i=0;i<15; i++) 
    { 
     CGContextMoveToPoint(context, 300-forward, 0); 
     CGContextAddLineToPoint(context, 0, 300-forward); 
     forward=forward+20; 
    } 
    int forwardNegative=0; 
    for (int i=0;i<15; i++) 
    { 
     CGContextMoveToPoint(context, 0,300+forwardNegative); 
     CGContextAddLineToPoint(context,300+forwardNegative,0); 
     forwardNegative=forwardNegative+20; 
    } 
    CGContextStrokePath(context); 

} 

Надежда это поможет вам.

+0

приятно - спасибо - работает – Greg

1

для быстрой 3., используя подход от @ user3230875

final class CrossHatchView: UIView { 

    // MARK: - LifeCycle 

    override func draw(_ rect: CGRect) { 
     let path:UIBezierPath = UIBezierPath(roundedRect: bounds, cornerRadius: 5) 
     path.addClip() 

     let pathBounds = path.bounds 
     path.removeAllPoints() 
     let p1 = CGPoint(x:pathBounds.maxX, y:0) 
     let p2 = CGPoint(x:0, y:pathBounds.maxX) 
     path.move(to: p1) 
     path.addLine(to: p2) 
     path.lineWidth = bounds.width * 2 

     let dashes:[CGFloat] = [0.5, 7.0] 
     path.setLineDash(dashes, count: 2, phase: 0.0) 
     UIColor.lightGray.withAlphaComponent(0.5).set() 
     path.stroke() 
    } 
} 

результат:

enter image description here

Смежные вопросы