SpriteKit Floating Bubble Picker (inspired by Apple Music)
Clone or download
Latest commit 1b70a10 Dec 6, 2018
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
.github Update CONTRIBUTING.md Dec 5, 2017
Example Swift 4.2 (#70) Dec 6, 2018
Images Added logo Oct 10, 2017
Magnetic.xcodeproj Swift 4.2 (#70) Dec 6, 2018
Sources 2.1.2 Dec 6, 2018
docs 2.0.8 May 8, 2018
.gitignore Initial commit Mar 9, 2017
.swift-version 2.0.0 Sep 20, 2017
.travis.yml Update .travis.yml Oct 19, 2018
CHANGELOG.md 2.1.2 Dec 6, 2018
LICENSE Initial commit Mar 9, 2017
Magnetic.podspec 2.1.2 Dec 6, 2018
Package.swift created project Mar 9, 2017
README.md 2.1.1 Dec 6, 2018

README.md

Magnetic

Build Status Language Version License Platform Carthage compatible

Magnetic is a customizable bubble picker like the Apple Music genre selection.

$ pod try Magnetic

Features

  • Adding/Removing Nodes
  • Selection/Deselection/Removed Animations
  • Multiple Selection
  • Images
  • Multiline Label
  • Documentation

Requirements

  • iOS 9.0+
  • Xcode 9.0+
  • Swift 4 (Magnetic 2.x), Swift 3 (Magnetic 1.x)

Usage

A Magnetic object is an SKScene.

To display, you present it from an SKView object.

import Magnetic

class ViewController: UIViewController {

    var magnetic: Magnetic?
    
    override func loadView() {
        super.loadView()
        
        let magneticView = MagneticView(frame: self.view.bounds)
        magnetic = magneticView.magnetic
        self.view.addSubview(magneticView)
    }

}

Properties

var magneticDelegate: MagneticDelegate? // magnetic delegate
var allowsMultipleSelection: Bool // controls whether you can select multiple nodes. defaults to true
var selectedChildren: [Node] // returns selected chidren

Nodes

A Node object is a SKShapeNode subclass.

Interaction

// add circular node
let node = Node(text: "Italy", image: UIImage(named: "italy"), color: .red, radius: 30)
magnetic.addChild(node)

// add custom node
let node = Node(text: "France", image: UIImage(named: "france"), color: .blue, path: path, marginScale: 1.1)
magnetic.addChild(node)

// remove node
node.removeFromParent()

Properties

var text: String? // node text
var image: UIImage? // node image
var color: UIColor // node color. defaults to white

Animations

override func selectedAnimation() {
    // override selected animation
}

override func deselectedAnimation() {
    // override deselected animation
}

override func removedAnimation(completion: @escaping () -> Void) {
    // override removed animation
}

Delegation

The MagneticDelegate protocol provides a number of functions for observing the current state of nodes.

func magnetic(_ magnetic: Magnetic, didSelect node: Node) {
    // handle node selection
}

func magnetic(_ magnetic: Magnetic, didDeselect node: Node) {
    // handle node deselection
}

Customization

Subclass the Node for customization.

For example, a node with an image by default:

class ImageNode: Node {
    override var image: UIImage? {
        didSet {
            sprite.texture = image.map { SKTexture(image: $0) }
        }
    }
    override func selectedAnimation() {}
    override func deselectedAnimation() {}
}

Installation

CocoaPods

To install with CocoaPods, simply add this in your Podfile:

use_frameworks!
pod "Magnetic"

Carthage

To install with Carthage, simply add this in your Cartfile:

github "efremidze/Magnetic"

Mentions

Communication

  • If you found a bug, open an issue.
  • If you have a feature request, open an issue.
  • If you want to contribute, submit a pull request.

Credits

https://github.com/igalata/Bubble-Picker

License

Magnetic is available under the MIT license. See the LICENSE file for more info.