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
5
votes
3 answers

How to add a custom shape to an UIImageView in Swift?

I'm trying to add a custom shape to an imageView. Please check the below images. This is the required one: This is what I have done so far: I'm new to Core Graphics and I have done this so far: private func customImageClipper(imageV:…
Rob13
  • 381
  • 8
  • 20
5
votes
3 answers

Custom image mask in iOS

I have a issue with masking images. I do game "puzzle" and have to make custom images. I found and tried 2 way of custom cropping: Using CALayer.mask property. Using UIImage.mask property. In first option i create my custom path, then assign it…
akozin
  • 529
  • 1
  • 7
  • 18
5
votes
2 answers

How do I remove a CAShapeLayer and CABasicAnimation from my UIView?

This is my code: @objc func drawForm() { i = Int(arc4random_uniform(UInt32(formNames.count))) var drawPath = actualFormNamesFromFormClass[i] shapeLayer.fillColor = UIColor.clear.cgColor shapeLayer.strokeColor = UIColor.black.cgColor …
5
votes
1 answer

Adding a mask to CAGradientLayer makes UIBezierPath disappear

I want to add an inner border to a view with a gradient. The following code works and gives me this result import UIKit class InnerGradientBorderView: UIView { override init(frame: CGRect) { super.init(frame: frame) …
Zia
  • 14,622
  • 7
  • 40
  • 59
5
votes
1 answer

CAShapeLayer line's rounded corners

I want to draw diagonal line with rounded corners in view. My code: class DiagonalView: UIView { // MARK: - Public Properties @IBInspectable var fillColor: UIColor = UIColor.white { didSet { self.diagonalLayer.strokeColor =…
RomanHouse
  • 2,552
  • 3
  • 23
  • 44
5
votes
2 answers

CAShapeLayer path spring animation not 'overshooting'

I'm experimenting with animating CAShapeLayer paths with CASpringAnimation. The expected result is a 'morphing' between shapes that acts 'springy'. I have a basic code example between a circle and square path as below, however the end result is a…
Sarreph
  • 1,986
  • 2
  • 19
  • 41
5
votes
1 answer

CABasicAnimation drawing a path does not scale when superView's scale changes

I have an animation of drawing a rectangle to a specific percentage of it. For that i am drawing a CAShapeLayer: func drawTheLayer() -> CAShapeLayer { let lineWidth: CGFloat = borderWidth * bounds.size.width / standardSizeWidth let…
Mihriban Minaz
  • 3,043
  • 2
  • 32
  • 52
5
votes
1 answer

CAShapeLayer draw partially through path end points

When I use CAShapeLayer and create a rectangle shape then the path starts at rectangle's origin (top-left corner) and draws clockwise. Now if I want to draw only part of the shape then I'm using strokeStart and strokeEnd properties. The problem…
frangulyan
  • 3,580
  • 4
  • 36
  • 64
5
votes
0 answers

Draw CAShapeLayer strokeEnd circle one side

I have implemented a basic line drawing animation for a progress bar.The line has a round cap edge.When I moving the slider the line drawing the ending of line is having a rounded cap but in the starting its a square. below is the code I am using…
Ramkumar chintala
  • 958
  • 11
  • 24
5
votes
2 answers

CAShapeLayer: different line cap at start/end

I'm using CAShapeLayer to draw a semicircle and I want to have a kCGLineCapRound at the start and a kCGLineCapButt at the end. How can I do that? UIBezierPath *circlePathMax = [UIBezierPath bezierPathWithArcCenter:CGPointMake(self.view.center.x,…
Luciano
  • 1,208
  • 2
  • 17
  • 36
5
votes
2 answers

Need a tip with UIBezierPath. Triangle Shape like Instagram Sign Up View

I'm trying to create a bezier path like the instagram triangle in the picture below, however I must be doing something wrong. The Bezier path does not show! - (void)viewDidLoad { [super viewDidLoad]; // Do any additional setup after loading the…
SleepsOnNewspapers
  • 3,353
  • 3
  • 23
  • 29
5
votes
1 answer

How to scale a CAShapeLayer

In swift I've successfully made an animated bezier path which is contained inside a CAShapeLayer. My only problem is implementing it onto other screen sizes. Does anybody know how I can scale the CAShapeLayer with the path inside of it? i.e. make it…
Matt Spoon
  • 2,760
  • 5
  • 25
  • 41
5
votes
2 answers

CAShapeLayer with UIBezierPath

I wanted to display a triangle shaped view in a UITableView cell like this. I managed to accomplish this using the blow code. import UIKit class TriangleView: UIView { override func drawRect(rect: CGRect) { let width =…
Isuru
  • 30,617
  • 60
  • 187
  • 303
5
votes
3 answers

Swift draw shadow to a uibezier path

I have a strange question. Even though I did read a lot of tutorials on how to do this, the final result only shows the bezier line, not any shadow whatsoever. My code is pretty simple : let borderLine =…
Razvan Soneriu
  • 587
  • 3
  • 7
  • 23
5
votes
2 answers

CAShapeLayer Shadow with UIBezierPath

This question continues from a previous answer. I have the following CAShapeLayer: - (CAShapeLayer *)gaugeCircleLayer { if (_gaugeCircleLayer == nil) { _gaugeCircleLayer = [CAShapeLayer layer]; _gaugeCircleLayer.lineWidth =…
gotnull
  • 26,454
  • 22
  • 137
  • 203