ios - Cómo dibujar un UIButton en forma de triángulo

core-graphics cgcontext

Question

Realmente cavo el botón de esquina inferior derecha IFTTT, como se muestra en la imagen (abajo a la derecha).

Intenté jugar con CGContext y UIBezierPath para que coincida con el efecto, pero simplemente no sé lo suficiente para hacerlo bien. ¿Alguien tiene algún pensamiento / código sobre cómo hacer que esto suceda?

¡Gracias!

Answer 1

Haz un botón cuadrado, pon una imagen de triángulo en él. ¿No va a funcionar eso también? Para hacer que la ilusión sea aún mejor, dibuja imágenes separadas para el evento onclick () y ontouch (). Deshabilite el botón predeterminado, presione y haga clic en las animaciones para que se vea real.

Answer 2

Primero use un CAShapeLayer para crear una máscara

CAShapeLayer * shapeLayer = [CAShapeLayer layer];
//Use these to create path
CGMutablePathRef path = CGPathCreateMutable();
// CGPathMoveToPoint
// CGPathAddLines
shapeLayer.path = path;

Luego configura la máscara de tu botón

yourbutton.layer.mask = shapeLayer
yourbutton.masksToBounds = YES;

Ejemplo de una vista

 CAShapeLayer * shapeLayer = [CAShapeLayer layer];
CGMutablePathRef path = CGPathCreateMutable();
CGPathMoveToPoint(path, nil, 0, CGRectGetHeight(self.testview.frame));
CGPathAddLineToPoint(path, nil, CGRectGetWidth(self.testview.frame), 0);
CGPathAddLineToPoint(path, nil, CGRectGetWidth(self.testview.frame), CGRectGetHeight(self.testview.frame));
CGPathCloseSubpath(path);
shapeLayer.path = path;
self.testview.layer.masksToBounds = YES;
self.testview.layer.mask = shapeLayer;

Y captura de pantalla: