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
2
votes
1 answer

Insert CAShapeLayer behind Image in UIImageView

Just as the title says. I have a UIImageView and I am inserting CAShapeLayers into the View. The issue is that I don't know how to insert them behind the image of the UIImageView. Any advice would be much appreciated, thanks.
Blue
  • 1,408
  • 4
  • 17
  • 36
2
votes
5 answers

Swift 3: Animate color fill of arc added to UIBezierPath

I wish to animate the color fill of a section of a pie chart. I create the pie chart by creating a UIBezierPath() for each piece of the pie and then use the addArc method to specify the size/constraints of the arc. To animate the pie chart segment,…
jshapy8
  • 1,983
  • 7
  • 30
  • 60
2
votes
1 answer

How to draw a rectangle and fill it with color based on battery level

I want to draw a rectangle in Swift3 and draw based on the battery level of the phone for example, if battery is 100% then rectangle must be filled completely. If battery is 67% then fill should be 67% of that rectangle's width. I am quite new to…
fscore
  • 2,567
  • 7
  • 40
  • 74
2
votes
1 answer

Swift: Resize/Scale UIBezierPath dynamically with parent view size

I am using UIBezierPath and CAShapeLayer to draw a line and adding it inside a view as a sublayer. Everything works fine, Now I have to resize 'Line' with its parent view with strictly keeping the proportion same of line with the view. Here is the…
2
votes
1 answer

Make parts of UIView transparent by using a masking layer

I am trying to achieve something like this: Where the pink part is fixed and the grey area could possibly scroll. I have the following view structure: I currently have this code: extension FloatingPoint { var degreesToRadians: Self { return…
José
  • 3,112
  • 1
  • 29
  • 42
2
votes
1 answer

CADisplayLink catches animation with delay

Trying to reproduce behaviour described in this article. Line by line. Everything works well but the last step... The problem is: I unpause CADisplayLink just before calling UIView.animate and expect the unpaused CADisplayLink to call the attached…
iWheelBuy
  • 5,470
  • 2
  • 37
  • 71
2
votes
1 answer

How to create a multiple path from several BezierPath

I'm working with swift 2.2 and I'm dealing with such problem: I have an array of UIBezier objects and I need to create a stroke for them as one path. I used to have a special function for that, but the pros of that approach, that it created several…
dand1
  • 371
  • 2
  • 8
  • 22
2
votes
0 answers

Why does CGBlendMode.color work correctly in simulator but fail on device?

I'm using CAShapeLayer's render(in:) with blend mode set to CGBlendMode.color to tint an image drawn to the current CGContext. It works perfectly in the simulator, but not on the device. Screenshot on the left is a simulated iPhone 7 Plus, on the…
Robert
  • 6,660
  • 5
  • 39
  • 62
2
votes
0 answers

SpriteKit follow partial path

I've used CGPath to create a race track by stroking the path and offsets of it to draw the road and lines. My hope was that I could use this CGPath in SpriteKit so that I could make a car sprite follow the track. I can get a sprite to follow the…
abaroody
  • 31
  • 1
2
votes
1 answer

CAShaperLayer as mask show only 1/4 of UIView

I try to make UIView to show zig-zag bottom edge. Something like…
sarunw
  • 8,036
  • 11
  • 48
  • 84
2
votes
1 answer

Two CABasicAnimations on Two Different Layers Simultaneously

I have a single animation that animates a layer mask successfully: // create new animation let anim = CABasicAnimation(keyPath: "path") anim.delegate = self anim.fromValue = self.maskLayerMWB.path anim.toValue = path2.CGPath anim.duration =…
Gizmodo
  • 3,151
  • 7
  • 45
  • 92
2
votes
0 answers

How to track strokeEnd point of a CAShapeLayer?

My question concerns the possibility of tracking the coordinates of the strokeEnd point of a CAShapeLayer.
shomi
  • 21
  • 3
2
votes
1 answer

How to add gradient color to a CAShapeLayer created using UIBezierPath

I have tried this and this but still no success. Basically I want to create something like this (inner circle). Circle will be created according to some data lets say if data is 50 we will get a half circle and if its 100 we will get full…
Umair Afzal
  • 4,947
  • 5
  • 25
  • 50
2
votes
0 answers

Filling color in a CAShapeLayer from left to right

For my current project, I need to draw a custom chart similar to the picture attached. I am using CABasicAnimation with strokeEnd property to stroke the path with animation. I am facing problem to fill the lower portion of the dashed line with color…
Sauvik Dolui
  • 5,520
  • 3
  • 34
  • 44
2
votes
1 answer

CAShapeLayer detect touch during animation Swift

I can detect a touch of a CAShapeLayer like this (touchesEnded): let touchLocation : CGPoint = (touch as! UITouch).locationInView(self.view) for shape in shapes{ if CGPathContainsPoint(shape.path, nil, touchLocation, false){ …
satvikb
  • 319
  • 1
  • 3
  • 17