как нарисовать дугу с линией, используя UIBezierPath

Я пытаюсь нарисовать фигуру, показанную на рисунке. Фон белый.. Надеюсь, он вам виден..

введите здесь описание изображения

Я использую путь Безье, чтобы нарисовать это. Я предоставил границы формы, как показано синей рамкой.

введите здесь описание изображения

Пока мне удается нарисовать только две линии (показаны зеленым). Я должен нарисовать тот, что с красным дальше.

введите здесь описание изображения

Я не могу нарисовать дугу из этой точки. Я не могу понять, как передать правильные параметры в addArcWithCenter.

Код

-(void) drawRect:(CGRect)rect
{
    //declare and instantiate the UIBezierPath object
    aPath = [UIBezierPath bezierPath];

    // Set the starting point of the shape.
    [aPath moveToPoint:CGPointMake(CGRectGetMinX(rect), CGRectGetMinY(rect))];

    // Draw some lines.
    [aPath addLineToPoint:CGPointMake(CGRectGetMaxX(rect), CGRectGetMinY(rect))];
    [aPath addLineToPoint:CGPointMake(CGRectGetMaxX(rect), CGRectGetMaxY(rect) - 40)];
    [aPath addArcWithCenter:self.center radius:40 startAngle:3 *(M_PI / 2) endAngle:M_PI clockwise:NO];

    //set the line width
    aPath.lineWidth = 2;

    //set the stoke color
    [[UIColor greenColor] setStroke];

    //draw the path
    [aPath stroke];

}

Я новичок в базовой графике. Пожалуйста, будьте снисходительны ко мне.. Спасибо..


person NightFury    schedule 08.03.2014    source источник
comment
Каков ваш размер прямоугольника (я хоп › 80 * 80, поскольку вы определяете радиус = 40) Ваша дуга должна выглядеть как 3/4 круга или только 1/4?   -  person Armand DOHM    schedule 08.03.2014
comment
Какого размера должен быть мой прямоугольник, чтобы я мог нарисовать дугу в положении, показанном на рисунке?   -  person NightFury    schedule 08.03.2014
comment
Основываясь на вашем изображении, вы не должны использовать addCurveToPoint:controlPoint1:controlPoint2: ?   -  person Wain    schedule 08.03.2014
comment
@Wain Я действительно понятия не имею, какую функцию лучше всего использовать на данный момент. Пожалуйста, не могли бы вы направить меня? Спасибо.   -  person NightFury    schedule 08.03.2014
comment
МОЖЕТЕ ли вы добавить картинку С каким должен быть следующий шаг (2 зеленые линии + дуга, как это должно быть красным).   -  person Armand DOHM    schedule 08.03.2014
comment
Пожалуйста, посмотрите мое редактирование. Я добавил рис.   -  person NightFury    schedule 08.03.2014
comment
Ранее я написал сообщение в блоге о построении пути Безье, в котором показаны обе дуги. и кривые как с UIBezierPath, так и с CGPath. Я надеюсь, что это поможет вам научиться использовать API.   -  person David Rönnqvist    schedule 08.03.2014
comment
спасибо за ссылку @DavidRönnqvist. Я обязательно пройду через это в ближайшее время :)   -  person NightFury    schedule 08.03.2014


Ответы (1)


Попробуйте это (как видите, я использовал addQuadCurveToPoint вариант addCurveToPoint, предложенный @wain — спросите у Google addCurveToPoint и переключитесь на поиск картинок, чтобы увидеть, как это работает):

-(void) drawRect:(CGRect)rect
{
    UIBezierPath * aPath = [UIBezierPath bezierPath];

    // Set the starting point of the shape.
    [aPath moveToPoint:CGPointMake(CGRectGetMinX(rect), CGRectGetMinY(rect))];

    // Draw some lines.
    [aPath addLineToPoint:CGPointMake(CGRectGetMaxX(rect), CGRectGetMinY(rect))];



//changes start here !

    //the point look to be at 80% down
    [aPath addLineToPoint:CGPointMake(CGRectGetMaxX(rect), CGRectGetMaxY(rect) * .8)];


    //1st arc
    //The end point look to be at 1/4 at left, bottom
    CGPoint p = CGPointMake(CGRectGetMaxX(rect) / 4, CGRectGetMaxY(rect));
    CGPoint cp = CGPointMake( (CGRectGetMaxX(rect) / 4) + ((CGRectGetMaxX(rect) - (CGRectGetMaxX(rect) / 4)) / 2) , CGRectGetMaxY(rect) * .8);

    [aPath addQuadCurveToPoint:p controlPoint:cp];


    //2nd arc
    //The end point look to be at 80% downt at left,
    CGPoint p2 = CGPointMake(CGRectGetMinX(rect), CGRectGetMaxY(rect) * .8);
    CGPoint cp2 = CGPointMake( (CGRectGetMaxX(rect) / 4) / 2 , CGRectGetMaxY(rect) * .8);

    [aPath addQuadCurveToPoint:p2 controlPoint:cp2];


    //close the path
    [aPath closePath];

    //set the line width
    aPath.lineWidth = 2;

    //set the stoke color
    [[UIColor greenColor] setStroke];

    //draw the path
    [aPath stroke];
}
person Armand DOHM    schedule 08.03.2014
comment
Вау, спасибо большое! Мне это кажется волшебством :D Ты классный парень. Вы мне многое прояснили. - person NightFury; 08.03.2014
comment
Одна вещь, которую я хочу спросить из кода: как вы рассчитывали очки для контрольной точки? Не могли бы вы немного пояснить? - person NightFury; 08.03.2014
comment
Представьте, что ваша дуга представляет собой прямоугольник, я решил поместить контрольную точку в середине X, вверху Y этого прямоугольника. Вам действительно нужно проверить документ, чтобы увидеть, как он работает: ссылка – отметьте пункт Добавление кривых на ваш путь. - person Armand DOHM; 08.03.2014