Questions tagged [cashapelayer]

CAShapeLayer is a special purpose CALayer subclass for drawing animatable shapes using cubic Bezier splines. It's a part of the QuartzCore framework and is available for both iOS (since iOS 3.0) and OS X (since OS X v10.6 "Snow Leopard").

CAShapeLayer is a special purpose CALayer subclass for drawing animatable shapes using cubic Bezier splines. It's a part of the framework and is available for both (since iOS 3.0) and (since OS X v10.6 "Snow Leopard").

The shapes is defined using the path property and can be both filled and stroked using the fillColor and strokeColor properties. Note that the backgroundColor property inherited from CALayer does not fill the shape. The path of the shape is animatable (but doesn't support implicit animations) but the appearance of the animation is undefined if the two paths have a different number of control points or segments.

There are several properties (animatable) to configure how the shape is stroked and filled. Using these properties the stroke can for example get a moving dashed patten (commonly called "marching ants").

The strokeStart and strokeEnd properties can also be used to only stroke part of the shape or to animate the shape being stroked. Both values go from 0.0 (beginning of path) to 1.0 (end of path) and values in between are interpolated along the path.


The page about Paths in the Quartz 2D Programming Guide is a great resource for learning more about creating paths, stroking, rounding and joining paths, filling paths and creating dash patterns.

951 questions
7
votes
1 answer

Animate CAShapeLayer with wave animation

Below i have attached image,I want to achieve the below animation.I have tried water wave animation but don't know how to control the animation like the above. I have CAShapeLayer in which i have to achieve this animation. Init Code UIBezierPath…
Mukesh
  • 3,680
  • 1
  • 15
  • 32
7
votes
1 answer

Animate a CAShapeLayer circle into a rounded-corner triangle

I'd like to animate a shape as it transitions from a circle to a rounded-corner triangle. TL;DR: How do I animate a CAShapeLayer's path between two CGPath shapes? I know that they need to have the same number of control points, but I think I'm doing…
bryanjclark
  • 6,247
  • 2
  • 35
  • 68
7
votes
3 answers

completely erasing UIBezierPath & CAShapeLayer drawn items

In portrait mode (first time drawing) After rotating to landscape, why are the older shapes: I am using UIBezierPath & CAShapeLayer to draw circles & lines in a custom UIView's layer. The problem is inspite of being able to draw new circles &…
ystack
  • 1,785
  • 12
  • 23
7
votes
1 answer

iOS: CAShapeLayer to draw non-rectagular image and animating its shape

I have been reading the documentation on CAShapeLayer but I still don't quite get it. From my understanding, Layer is always flat and its size is always a rectangle. CAShapeLayer on the other hand, allows you to define a layer that is not just…
Unheilig
  • 16,196
  • 193
  • 68
  • 98
7
votes
1 answer

CABasicAnimation - Setting start stroke position

I'm animating the drawing of a basic circle. This works fine, except the animation begins drawing at the 3 o'clock position. Does anyone know how I can make it start at 12 o'clock? self.circle = [CAShapeLayer layer]; self.circle.fillColor =…
Jonathan
  • 13,947
  • 17
  • 94
  • 123
6
votes
3 answers

UIView bounds.applying but with rotation

I'd like to create a dash border around a view, which can be moved/rotated/scaled. Here's my code: func addBorder() { let f = selectedObject.bounds.applying(selectedObject.transform) borderView.backgroundColor = UIColor(red: 1,…
Makalele
  • 7,431
  • 5
  • 54
  • 81
6
votes
1 answer

Stroke of CAShapeLayer stops at wrong point?

I drew a simple circular progress view like this: let trackLayer:CAShapeLayer = CAShapeLayer() let circularPath:UIBezierPath = UIBezierPath(arcCenter: CGPoint(x: progressView.frame.width / 2, y: 39.5), radius: progressView.layer.frame.size.height *…
Mark Carols
  • 403
  • 4
  • 20
6
votes
2 answers

How to ensure CAShapeLayer resizes to fit in UIView

I am currently converting an MKPolyline to a BezierPath then a CAShapeLayer then adding the layer as a sublayer to a UIView. Currently struggling to ensure the path is not drawn outside the bounds of the UIView. I do not want to mask and have part…
lifewithelliott
  • 1,012
  • 2
  • 16
  • 35
6
votes
2 answers

How to get CAShapeLayer superview position?

I'm working on a circular chart, and I need to add small view at end of the highlighted circle (not shadow) for pointing at the target value. Can I find a circle (highlight) super view x,y positions based on the stroke end point? UIView->Circle…
Gopik
  • 255
  • 2
  • 17
6
votes
2 answers

CAShapeLayer strokeStart and strokeEnd positions

I have this piece of code: let arcPath = UIBezierPath(ovalInRect: CGRectMake(0, 0, frame.width, frame.height)) circleLayer = CAShapeLayer() circleLayer.path = arcPath.CGPath circleLayer.fillColor = UIColor.clearColor().CGColor …
gasparuff
  • 2,295
  • 29
  • 48
6
votes
1 answer

Correct way to subclass CAShapeLayer

Inspired by this example, I have a created custom CALayer subclasses for wedges and arcs. The allow me to draw arcs and wedges and animate changes in them so that they sweep radially. One of the frustrations with them, is that apparently when you go…
Travis Griggs
  • 21,522
  • 19
  • 91
  • 167
6
votes
2 answers

UIBezierPath: roundedRect: byRoundingCorners: cornerRadii: acts weird

I'm trying to make 2 corners of a button round. If I select .TopLeft and .BottomLeft like this: let bezierDisableAdsPath = UIBezierPath(roundedRect: disableAdsButton.bounds, byRoundingCorners: [UIRectCorner.TopLeft , UIRectCorner.BottomLeft]…
potato
  • 4,479
  • 7
  • 42
  • 99
6
votes
1 answer

Creating a triangle shape in a UIButton

I am trying to create a button with a triangle icon/shape in it. I have created the triangle in Paintcode then copied the beizer path and added it to the button layer as below. -(void)setupShowHideRouteButton { UIBezierPath* bezierPath =…
StuartM
  • 6,743
  • 18
  • 84
  • 160
6
votes
2 answers

Add semi-transparent mask to CALayer?

I'm trying to darken the surrounding area of my UIImageView, and leave a portion alone (which I define with my mask). Right now I'm defining my mask and setting my imageView.layer.mask, however instead of darkening the rest of the image, it's…
Vadoff
  • 9,219
  • 6
  • 43
  • 39
5
votes
1 answer

iPhone how to use CAShapeLayer link error with armv7

This probably something really simple, but I have never used CAShapeLayers before, I imported this at the top: import < QuartzCore/QuartzCore.h > And the compiler is not complaining, but the linker is with this error: "_OBJC_CLASS_$_CAShapeLayer",…
Oscar Gomez
  • 18,436
  • 13
  • 85
  • 118