CircleAnimatedMenu

CircleAnimatedMenu - convenient customizable menu which can be used to show and select different categories. Selection can be done by sliding around the center of menu or just by tapping at section.

Requirements

iOS 9.0
Xcode 8.0+

Installation

CircleAnimatedMenu is available through CocoaPods. To install it, simply add the following line to your Podfile:

pod "CircleAnimatedMenu"

Usage

With storyboard

Create a new UIView inheriting from CircleAnimatedMenu
Create IBOutlet property in your view controller:

@IBOutlet weak var testMenu: CircleAnimatedMenu!

Connect IBOutlet with CircleAnimatedMenu in IB.
Build array of tuples. Each tuple should contain two String values, first value - image name, second - category text. It can be written in func viewDidLoad.

testMenu.tuplesArray = [("facebook", "Facebook"), ("insta", "Instagram"), ("twit", "Twitter"),
("link", "LinkedIn"), ("googlePlus", "GooglePlus"), ("github", "GitHub")];

Set delegate to get index and text selected section.

testMenu.delegate = self

Programmatically

let menuFrame = CGRect(x: 0, y: 0, width: 220, height: 220)
let testMenu = CircleAnimatedMenu(menuFrame: menuFrame, dataArray: [("facebook", "Facebook"), ("insta", "Instagram"), ("twit", "Twitter"), ("link", "LinkedIn"), ("googlePlus", "GooglePlus"), ("github", "GitHub")])
testMenu.delegate = self
self.view.addSubview(testMenu)

Delegate method

// to get text and index of selected section
func sectionSelected(text: String, index: Int)

Public properties

// Inner radius of menu
@IBInspectable public var innerRadius: CGFloat = 30

// Outer radius of menu
@IBInspectable public var outerRadius: CGFloat = 75

// Width of line between sections and central circle
@IBInspectable public var closerBorderWidth: CGFloat = 2

// Width of border menu
@IBInspectable public var farBorderWidth: CGFloat = 0 

// Menu fill color
@IBInspectable public var menuFillColor: UIColor = .darkGray

// Menu background color - color of layer that lies under section layers and inner circle layer
@IBInspectable public var menuBackgroundColor: UIColor = .white

// Inner circle color
@IBInspectable public var innerCircleColor: UIColor = .darkGray

// Color of section after selection
@IBInspectable public var highlightedColor: UIColor = .blue

// Color of line between slices and central circle
@IBInspectable public var closerBorderColor: UIColor = .white

// Border menu color
@IBInspectable public var farBorderColor: UIColor = .white

// Sections stroke color
@IBInspectable public var sectionsStrokeColor: UIColor = .white

// Text color
@IBInspectable public var textColor: UIColor = .white

// Shadow color
@IBInspectable public var shadowColor: UIColor = .lightGray 

// Shadow radius
@IBInspectable public var menuShadowRadius: CGFloat = 15

// Duration it takes to sections to expand.
public var animDuration: Double = 1.0

// Menu width line
@IBInspectable public var menuWidthLine: CGFloat = 0

// Text font - to set font and font size of text
@IBInspectable public var titleFont: UIFont = UIFont.systemFont(ofSize: 13)

// Image size value
public var imageSize: CGFloat = 30

// Default highlighted section index. Set it if you want to highlight some section at start
@IBInspectable public var defaulHighlightedtSectionIndex: Int = -1 

// set animation state. Default - true
public var animated: Bool = true 

// Data
public var tuplesArray: [(String, String)] = []

// You can set highlighted colors array if you want to highlight each section separately
public var highlightedColors: [UIColor] = []

Example

To run the example project, clone the repo, and run pod install from the Example directory first.

License

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

tiffsaka/CircleAnimatedMenu