Пользовательская форма UIButton без использования изображения - PullRequest
Новая
       20

Пользовательская форма UIButton без использования изображения

8 голосов
/ 31 мая 2011

Я хочу создать UIButton, который будет похож на UIBackBarButtonItem (со стрелкой, указывающей влево для стека навигации. Я бы предпочел сделать это без использования изображения, если это возможно, потому что кнопка будет иметь другой размер в зависимости от размерана ориентацию телефона.

Есть ли способ активировать этот эффект в коде? Моя идея как-то использовать CALayer кнопки.

Спасибо!

РЕДАКТИРОВАТЬ

Я пытаюсь воспользоваться советом @ Deepak, но столкнулся с проблемой. Я хочу, чтобы правая сторона кнопки выглядела как [UIBezierPath bezierPathWithRoundedRect: rect cornerRadius: 4], а левая сторона - в виде стрелкиЯ попытался сделать это, используя метод addQuadCurveToPoint: controlPoint.

Я использую угол прямоугольника в качестве контрольной точки, но путь не изгибается, как я ожидал. Он все еще загнут, как если бы я толькоиспользовал метод addLineToPoint: мой код приведен ниже. 

float radius = 4.0;
UIBezierPath *path = [UIBezierPath bezierPath];

CGPoint startPoint = CGPointMake(rect.size.width/5.0, 0);
CGPoint pointBeforeTopCurve = CGPointMake(rect.size.width - radius, 0);
CGPoint topRightCorner = CGPointMake(rect.size.width, 0);
CGPoint pointAfterTopCurve = CGPointMake(rect.size.width, 0.0-radius);

CGPoint pointBeforeBottomCurve = CGPointMake(rect.size.width, rect.size.height-radius);
CGPoint bottomRightCorner = CGPointMake(rect.size.width, rect.size.height);
CGPoint pointAfterBottomCurve = CGPointMake(rect.size.width - radius, rect.size.height);

CGPoint pointBeforeArrow = CGPointMake(rect.size.width/5.0, rect.size.height);
CGPoint arrowPoint = CGPointMake(0, rect.size.height/2.0);


[path moveToPoint:pointBeforeTopCurve];
[path addQuadCurveToPoint:pointAfterTopCurve controlPoint:topRightCorner];

[path addLineToPoint:pointBeforeBottomCurve];
[path addQuadCurveToPoint:pointAfterBottomCurve controlPoint:bottomRightCorner];


[path addLineToPoint:pointBeforeArrow];
[path addLineToPoint:arrowPoint];
[path addLineToPoint:startPoint];

Ответы [ 2 ]

7 голосов
/ 31 мая 2011

Вы можете сделать это с помощью Quartz. Вам понадобится подкласс UIButton и реализация его drawRect: метода. Вам нужно будет определить путь и заполнить его градиентом.

Вам также придется реализовать hitTest:withEvent:, так как он имеет непрямоугольную форму.

0 голосов
/ 19 марта 2012

Это решило трудности рисования для меня 

    float radius = 10.0;
UIBezierPath *path = [UIBezierPath bezierPath];

CGPoint startPoint = CGPointMake(rect.size.width/5.0, 0);
CGPoint pointBeforeTopCurve = CGPointMake(rect.size.width - radius, 0);
CGPoint topRightCorner = CGPointMake(rect.size.width, 0.0);
CGPoint pointAfterTopCurve = CGPointMake(rect.size.width, radius);

CGPoint pointBeforeBottomCurve = CGPointMake(rect.size.width, rect.size.height-radius);
CGPoint bottomRightCorner = CGPointMake(rect.size.width, rect.size.height);
CGPoint pointAfterBottomCurve = CGPointMake(rect.size.width - radius, rect.size.height);

CGPoint pointBeforeArrow = CGPointMake(rect.size.width/5.0, rect.size.height);
CGPoint arrowPoint = CGPointMake(0.0, rect.size.height/2.0);


[path moveToPoint:pointBeforeTopCurve];
[path addQuadCurveToPoint:pointAfterTopCurve controlPoint:topRightCorner];

[path addLineToPoint:pointBeforeBottomCurve];
[path addQuadCurveToPoint:pointAfterBottomCurve controlPoint:bottomRightCorner];


[path addLineToPoint:pointBeforeArrow];
[path addLineToPoint:arrowPoint];
[path addLineToPoint:startPoint];


[path fill];
...