Swift CAReplicatorLayer Sample Code

Created By: Debasis Das (29-May-2017)
In this post we will see how CAReplicatorLayer works and create a couple of sample code to play around with CAReplicatorLayer
CAReplicatorLayer is essentially a layer that creates a specified number of copies of its sublayers, each copy potentially having geometric, temporal, and color transformations applied to it.

We can use a CAReplicatorLayer object to build complex layouts based on a single source layer that is replicated with transformation rules that can affect the position, rotation color, and time.

In this post we will create the below samples
Swift_CAReplicatorLayer_Nesting_1
Swift_CAReplicatorLayer_Nesting_2
Swift_CAReplicatorLayer_ProgressIndicator_1
Swift_CAReplicatorLayer_ProgressIndicator_2
Swift_CAReplicatorLayer_ProgressIndicator_3
Read more ›

Posted in Swift, Swift 3.1 Tagged with: , ,

Swift Mac OS Animation using Animator Proxy – Part 2

In continuation to the Swift Mac OS Animation Part 1 we will work with Animator Proxy to achieve animation in Mac OS Applications.

Animator Proxy
Some simple Mac OSX Animation can be achieved through the usage of Animator Proxy. Animator proxy is the quickest and easiest way to implement animation effects in views and windows.
The animations caused by using animator proxy is called as Cocoa Animation or Cocoa Animatable Proxy Animation. Animator proxy provides a benefit to achieve animations without using core animation layers.

The way animator proxy works is rather than an UI object changing its own size or origin asks the animator proxy to change its properties values using an animation effect

Swift-AnimatorProxy
Read more ›

Posted in Swift, Swift 3.1 Tagged with: , ,

Swift Mac OS Animation using Core Animation- Part 1

Created By: Debasis Das (27-May-2017)
Swift Mac OS Animation
Animation in Mac OSX has a long history and there are more than one option for achieving an animated behavior in a Mac Application.

We can achieve animation in a Mac Application using
1. Simple View Animation
2. Using Animation Proxy or
3. Using Core Animation on CALayer

The above animation techniques can be used in isolation or it can be merged with each other to achieve a certain animation behavior

The decision to use one approach vs the other purely depends on the animation complexity and the degree of control that is desired. Whether user interaction is desired on the screen that has animated layers etc.

If a simple animation such as animating the size of the NSWindow is required, it would be easier to simply use an animator proxy to achieve the functionality, however if we have complex requirement of creating a firework effect, we would need to look beyond View Animation or using an animator proxy.

In this post we will see how Core Animation works in Mac OSX.
CAAnimation is the abstract superclass for all Core Animations.
CAAnimation has the following subclasses
– CABasicAnimation
– CAKeyframeAnimation
– CAAnimationGroup
– CATransition

We can animate the contents of our applications by attaching animations (Stated above) with Core Animation Layers

CABasicAnimation

  • Provides basic single-keyframe animations to the CALayers properties.
  • While initializing a CABasicAnimation we state the keypath of the property that we want to animate.
  • The property can be the backgroundColor, it can be the layer opacity or border color etc.
  • The animation has a from and a to value that need to be stated.
  • for example, we can animate the color change of a CALayer from red to green by creating a CABasicAnimation with backgroundColor keypath and then state the fromValue as red and toValue as green

CAKeyframeAnimation

  • Is similar to CABasicAnimation with a difference that it can accept multiple intermediate values and multiple intermediate keyTimes that controls how the transition happens
  • The timing and pacing of keyframe animations are complex than the basic animations.
  • There is a property of CAkeyframeAnimation called as calculationMode which defines the algorithm of the animation timing.
  • Below are the calculation modes
    • kCAAnimationLinear – provides a linear calculation between keyframe value
    • kCAAnimationDiscrete – each keyframe value is used in turn and no interpolated values are calculated.
    • kCAAnimationPaced – Linear keyframe values are interpolated to produce an even pace throughout the animation.
    • kCAAnimationCubic – Smooth spline calculation between keyframe values
    • kCAAnimationCubicPaced – Cubic keyframe values are interpolated to produce an even pace throughout the animation.
  • The decision of the calculationMode plays a key role based on what type of animation we are trying to achieve. A bouncing ball effect would require the ball to fall at a slow speed initially and gradually the speed should increase and when it hits the ground it should bounce back with initial higher speed and the speed should taper at the top before it reverses direction.

CAAnimationGroup

  • Allows multiple animations to be grouped and run concurrently.
  • We can create multiple animations using CABasicAnimation or CAKeyframeAnimation each having a different animation duration and then we can create a CAAnimationGroup using an array of individual animations.
  • The CAAnimationGroup also has a duration property which if smaller than individual animation durations will clip the individual animation durations.

Using a combination of CABasicAnimation, CAKeyframeAnimation and CAAnimationGroup we can achieve amazing animation effects.

We will progress through to create the below animation effect
SwiftGroupedAnimation
Read more ›

Posted in Swift, Swift 3.1 Tagged with: , , , , ,

Swift 3.1 URLSession, URLSessionDataTask Sample Code

In this tutorial we will create a simple application that demonstrates the use of URLSession and URLSessionDataTask in Swift 3.1

Note: As this article focusses primarily on the above stated aspects we will leave some UI functionality like showing a progress indicator when the web service is being called out of the scope of this post.

We will have a cocoa application that has two view based NSTableView. In one of the table view we will show a list of food menu items and once the user clicks one of the food menu item we will trigger a webservice call to get the list of sub menu items/ dishes for the selected food category.

Earlier while taking a course in angularjs at Coursera, I had created two webservices and will be using the same here.

https://knowstack-angularjs.herokuapp.com/categories.json gives a list of available menu items

https://knowstack-angularjs.herokuapp.com/menu_items.json?category=L gives the list of sub menu items/ dishes for a selected category.

Our final application will look as below

Swift 3.1 URLSession, URLSessionDataTask Sample Code

Swift 3.1 URLSession, URLSessionDataTask Sample Code

Read more ›

Posted in Swift, Swift 3.1 Tagged with: , ,

Swift 3.1 CAShapeLayer

Created By: Debasis Das (23-May-2017)
In this post we will explore the CAShapeLayer and create different sample CAShapeLayer and in some case animate a few of the properties
In our ViewController class we will add a rootLayer which is a CALayer and set the rootLayer as the layer of the view.
once the rootLayer is created, we will call different function that will create different CAShapeLayer and will add to the root layer

swift 3.1 cashapelayer sample code Swift 3.1 CAShapeLayer Simple Line

swift 3.1 cashapelayer sample code – Simple line

Swift 3.1 CAShapeLayer Line Dash Pattern

swift 3.1 cashapelayer sample code – line dash pattern

Swift 3.1 CAShapeLayer Path Animation

Swift 3.1 CAShapeLayer Ant Marching Animation

Swift 3.1 CAShapeLayer from NSBezierPath

Swift 3.1 Circle CAShapeLayer CGMutablePath

Swift 3.1 CAShapeLayer Rectangle

Swift 3.1 CAShapeLayer Triangle

Swift 3.1 CAShapeLayer Star
Step 1:

let rootLayer = CALayer()    
override func viewDidLoad() {
        super.viewDidLoad()
        rootLayer.frame = self.view.frame
        rootLayer.backgroundColor = NSColor.white.cgColor
        self.view.layer = rootLayer
        self.view.wantsLayer = true
        //linesShapeLayers()
        //linesShapeLayersLineDashPattern()
        //marchingAntAnimationUsingCAShapeLayer()
        //differentLineCaps()
        //circleShapeLayerSampleOne()
        //circleShapeLayerSampleTwo()
        //rectangeCAShapeLayer()
        //triangleCAShapeLayer()
        //starCAShapeLayer()
        //animateCAShapeLayerDrawing()
    }

Read more ›

Posted in Swift, Swift 3.1 Tagged with: , , , , , ,

Swift 3.1 Concurrency, Operation Queue, Grand Central Dispatch

Created By: Debasis Das (23-May-2017)

In this article we will cover the following topics in Cocoa with examples and sample code in Swift depicting the usage of each.

  • What is Concurrency?
  • Grand Central Dispatch
  • What is NSOperationQueue?
  • Introduction to Operation Queue
    • NSInvocationOperation
    • NSBlockOperation
    • Custom Operation
  • Dispatch Queues
    • Types of Dispatch Queues
  • NSOperationQueue vs DispatchQueues
  • Examples

Read more ›

Posted in Swift, Swift 3.1 Tagged with: , , , ,

Swift 3.1 NSTableView – Different Approaches Sample Code

Created By: Debasis Das (22-May-2017)

In this post we will try the different approaches of handling data population in a NSTableView and rendering different content types in a NSTableView.

We will create NSTableViews which are

  • Simple Cell based NSTableView using Datasource
  • Simple View based NSTableView using Datasource
  • View Based NSTableView with different UI Elements in Columns
  • View Based NSTableView single column multiple UI Elements in Row
  • View Based NSTableView Single column Header Cell and Data Cell

Swift 3.1 Cell Based NSTableView
Switf 3.1 View Based NSTableView using Datasource
Switf 3.1 View Based NSTableView multiple column types
Swift 3.1 View Based NSTableView Single Column Multiple Cell type
Swift 3.1 View Based NSTableView Header Cell Data Cell Read more ›

Posted in Swift 3.1 Tagged with:

Swift 3.1 Column Chart Animation using CABasicAnimation and CALayer

Created By: Debasis Das (22-May-2017)
In this post we will create a simple animation of Column Chart value changes.
We will be using CABasicAnimation and CALayers for creating this effect.

ColumnChart-Animation
Read more ›

Posted in Charts n Graphs, Swift 3.1 Tagged with:

Swift 3.1 Matrix Screensaver effect

Created By: Debasis Das (16-May-2017)

In this post we will create a simple cocoa application in Swift 3.1 to generate the matrix screen saver effect.
MatrixScreenSaver

Swift 3.1 Matrix Screen Saver Sample Code

Read more ›

Posted in CoreAnimation, Mac OSX Animation, Swift 3.1 Tagged with: , ,

Swift 3.1 CALayer

Created By: Debasis Das (15-May-2017)

An introduction to CALayer and Swift Sample code to create CALayer and modify its properties.
Layers are backing store for views and also can be used without a view to display content.
We can modify the visual attributes of a layer such as background color, border width, border color, shadow, opacity etc
In addition to the visual content, layers also maintain its position, size and transforms.
Animations can be initiated by modifying the properties of a layer
There are different types of layers such as

  • CALayer
  • CAGradientLayer
  • CATextLayer
  • CAShapeLayer
  • CAReplicatorLayer
  • CATiledLayer etc

In this article we will focus on creating a simple CALayer and setting it as the layer of the view and change the property of the layers on click of buttons

CALayer-gif

CAGradientLayer_gif2
Read more ›

Posted in Swift 3.1 Tagged with: , , , ,

Hit Counter provided by technology news