exyte / fan-menu

Menu with a circular layout based on Macaw

     

FanMenu

Easily customizable floating circle menu created with Macaw

Usage

1. Create UIView in your storyboard or programatically.
2. Set FanMenu as UIView class.
3. Set the button

fanMenu.button = FanMenuButton(
    id: "main",
    image: "plus",
    color: Color(val: 0x7C93FE)
)

4. Set menu items

fanMenu.items = [
    FanMenuButton(
        id: "exchange_id",
        image: "exchange",
        color: Color(val: 0x9F85FF)
    ),
    ...
    FanMenuButton(
        id: "visa_id",
        image: "visa",
        color: Color(val: 0xF55B58)
    )
]

5. Add an event handler

// call before animation
fanMenu.onItemDidClick = { button in
    print("ItemDidClick: \(button.id)")
}
// call after animation
fanMenu.onItemWillClick = { button in
    print("ItemWillClick: \(button.id)")
}

6. Configure optional parameters

// distance between button and items
fanMenu.menuRadius = 90.0

// animation duration
fanMenu.duration = 0.35

// menu opening delay
fanMenu.delay = 0.05

// interval for buttons in radians
fanMenu.interval = (0, 2.0 * M_PI)

// menu background color
fanMenu.menuBackground = Color.red

7. Useful methods

fanMenu.isOpen
fanMenu.open()
fanMenu.close()

Customization

FanMenu is created with Macaw, our vector graphics Swift library. Thanks to that, it can be easily modified and improved for your purposes.

All source code is located in one single file called FanMenu.swift. To modify the menu simply copy this file and apply necessary changes.

Examples

To try out the FanMenu examples:

• Clone the repo git clone [email protected]:exyte/fan-menu.git
• Open terminal and run cd <FanMenuRepo>/Example
• Run pod install to install all dependencies
• Run xed . to open project in the Xcode
• Try it!

We have the following examples:

• FinanceViewController.swift Accounting & Financial Management. Inspired by Yingfang Xie.
• TaskViewController.swift Color Coding Microinteraction. Insipred by Filippos Protogeridis.
• ShopViewController.swift Inspired by Tice.
• CustomViewController.swift Inspired by awesome Ramotion control circle-menu

Installation

CocoaPods

pod 'FanMenu'

Carthage

github 'Exyte/fan-menu'

Manually

Drop FanMenu.swift into your project.

Requirements

• iOS 9.0+ / macOS 10.12+
• Xcode 10.2+

fan-menu's Issues

How do I set the size of the first icon?

Receiving warning: CUICatalog: Invalid asset name supplied: ''

When an image string is left blank (like in the TaskViewController example), one gets the warning:

CUICatalog: Invalid asset name supplied: ''

Easy fix is to add:

if (!button.image.isEmpty) {...}

around the two places an UIImage is loaded.

Thanks!

Use with SwiftUI

Hey, is it possible to use this with SwiftUI? And how would I use it?

Thanks

[iPhone 4inch] Layout errors the example

Error while run Example

Showing All Messages
:-1: Multiple commands produce '/Users/Libern/Library/Developer/Xcode/DerivedData/Example-bkhumjvbaunwschkvskgzvdrrwki/Build/Products/Debug-iphoneos/FanMenu/FanMenu.framework/Info.plist':
1) Target 'FanMenu' (project 'Pods') has copy command from '/Users/Libern/LibernWorking/Projects/Someline/ios/fan-menu-master/Sources/Info.plist' to '/Users/Libern/Library/Developer/Xcode/DerivedData/Example-bkhumjvbaunwschkvskgzvdrrwki/Build/Products/Debug-iphoneos/FanMenu/FanMenu.framework/Info.plist'
2) Target 'FanMenu' (project 'Pods') has process command with output '/Users/Libern/Library/Developer/Xcode/DerivedData/Example-bkhumjvbaunwschkvskgzvdrrwki/Build/Products/Debug-iphoneos/FanMenu/FanMenu.framework/Info.plist'

Xcode 11.4 / Swift 5.2

Dear Fan-Menu team,

i am trying out your interesting Pod on CocoaPods - alas it does not seem to compile with Xcode 11.4 Swift 5.2 respectively. Seems some incompatibility with the Macaw library, that was updated for Swift 5.2.

Will there be an update to the FanMenu pod?

Regards,
Mike

semanticContentAttribute not changing for arabic language

I have implemented fanmenu like displayed in TaskViewController.swift. It is working good in english language but while change language to arabic fanMenuView is not changing semanticContentAttribute to rigthtToLeft

ios Deployment Target for FanMenu

Thanks for a great library :)

When I downloaded it I couldn't get it running, had to change the development target for the FanMenu Pod to "iOS 9.1" (it defaults at "iOS 8.0") in the Pods>Targets:FanMenu>BuildSettings>iOS Deployment Target.

For reference here is the error I got:
Module file's minimum deployment target is ios9.1 v9.1: /Users/xxxxxxxxxx/Library/Developer/Xcode/DerivedData/FanMenuBase-caahzwnyrbhuevepdjyscebyqvtb/Build/Products/Debug-iphonesimulator/Macaw/Macaw.framework/Modules/Macaw.swiftmodule/x86_64.swiftmodule

After I swapped that and Cleaned my build it works beautifully. 👍

Minimum deployment target

Hello.
The README says min deployment target is iOS 8.0
My project's min deployment target is 9.0, yet I am getting this error using cocoa pods:

[!] CocoaPods could not find compatible versions for pod "FanMenu":
  In Podfile:
    FanMenu (from `https://github.com/exyte/fan-menu`)

Specs satisfying the `FanMenu (from `https://github.com/exyte/fan-menu`)` dependency were found, but they required a higher minimum deployment target.

Carthage support

Handle events while animation playing

add method so we can change the image of FanMenuButton

Hi
first of all thanks for this wonderful component, it would be very nice if we could have better access to the image view of FanMenuButton. for example we could change the image or set the font for the title label. I think that way you can not use struct for FanMenuButton

Fan Menu project structure with examples

Support swift package manager

Background circle reduce to half

Hello sir,

I want to show half circle rather than full circle.
which code should I need to update ??

Rotate center button

Errors compiling the example.

I receive the following warning and error when I try and build the example in Xcode 10.1.

1. Target 'FanMenu' (project 'Pods') has copy command from '/Users/martin/dev/fan-menu/Sources/Info.plist' to '/Users/martin/Library/Developer/Xcode/DerivedData/Example-fykvmcsmliphikcyocogamyeedyl/Build/Products/Debug-iphonesimulator/FanMenu/FanMenu.framework/Info.plist'

2. Target 'FanMenu' (project 'Pods') has process command with output '/Users/martin/Library/Developer/Xcode/DerivedData/Example-fykvmcsmliphikcyocogamyeedyl/Build/Products/Debug-iphonesimulator/FanMenu/FanMenu.framework/Info.plist'

menu not response in iOS 12

Button seems not working in iOS 12 properly, all of them are no response .

Build failed after integrated

Showing All Messages
:-1: Multiple commands produce '/Users/Libern/Library/Developer/Xcode/DerivedData/Sparkle-eluqypnvotfmphgsbcljsqmyugvd/Build/Products/Debug-iphoneos/FanMenu/FanMenu.framework/Info.plist':
1) Target 'FanMenu' (project 'Pods') has copy command from '/Users/Libern/LibernWorking/Projects/Someline/sparkle-ios/Pods/FanMenu/Sources/Info.plist' to '/Users/Libern/Library/Developer/Xcode/DerivedData/Sparkle-eluqypnvotfmphgsbcljsqmyugvd/Build/Products/Debug-iphoneos/FanMenu/FanMenu.framework/Info.plist'
2) Target 'FanMenu' (project 'Pods') has process command with output '/Users/Libern/Library/Developer/Xcode/DerivedData/Sparkle-eluqypnvotfmphgsbcljsqmyugvd/Build/Products/Debug-iphoneos/FanMenu/FanMenu.framework/Info.plist'

Menus been hidden after displayed, but clickable, animation is working also.

It may working in the example project, but not on new project.
Latest Xcode new project with deployment target 10
Latest Master branch code.

See the video in action.
1550933952454388.mp4.zip

Allowing buttons to show outside view

I have the following

swift node.place = Transform.move( dx: Double(self.frame.width) / 2, dy: Double(self.frame.height) + 100 )

which takes the fanMenu.button outside the view but is not shown. Is there a method to allow it show - I looked at clip to bounds with no luck.

Possible tint on button

I have an example built using the interface builder which is set to display on top of another view.

When the view background color is #95c11f and the button circle is also set to the same it results in a slight difference in color on overlay. Am I missing a tint that I need to remove/ set to clear?

let circle = Shape( form: Circle(r: 55.0), fill: Color (val: 0x95c11f) )

i want to add a label next to every button in menu

i want to add a label next to every button in menu anyone can help ?

iTunes Connect upload error : CFBundleIdentifier Collision

Uploading my app on iTunes Connect is giving an error with the FanMenu framework used inside, (integrated through Carthage)

ERROR ITMS-90685: "CFBundleIdentifier Collision. There is more than one bundle with the CFBundleIdentifier value 'com.exyte.Macaw' under the iOS application 'MyApp.app'."
ERROR ITMS-90205: "Invalid Bundle. The bundle at 'MyApp.app/Frameworks/FanMenu.framework' contains disallowed nested bundles."
ERROR ITMS-90206: "Invalid Bundle. The bundle at 'MyApp.app/Frameworks/FanMenu.framework' contains disallowed file 'Frameworks'."

Is it something that you're aware of ?

Delegate not called

two item button are working and give id in return and items number more than 2 are not clickable.

XCode update to 10.2 crashes with "This coder requires that replaced objects be returned from initWithCoder:"

The error appears after dropping a FanMenu / UIView on Interface Builder and calling the IBOutlet associated with it.

I think this may be a Macaw related error.

Never mind: updating to Macaw 0.9.5 fixed this.

(Letting this here to the admin to close)

Adapt example projects for iPhone SE screen size

Swift 3 version

how can i use it in swift 3?

Change items array and re render

I have a custom fan menu based on CustomViewController.swift

I need to use the menu in a non standard way where a user is presented with a first menu and on press will present a second menu.

I have successfully closed the menu and switched the items but on opening the items are not still showing the first menu unless I use updateNode which completely re-instantiates the menu and places it according to the original position, which is not required at this point. (I moved the whole fanmenu on open)

I tried implementing an updateScene function but this in turn eventually places the menu in it's original position.

The updateScene tried:

func updateScene() { var oContent = self.scene!.node.contents let buttonsNode = Group(contents: items.enumerated().map { (arg) -> Node in let (index, item) = arg return CustomButtonsScene(customMenu: self).createCustomButton(customMenu: self, data: item, index: index) }) oContent[0] = buttonsNode self.scene!.node.contents = oContent }

func updateScene() { var oContent = self.scene!.node.contents let menuButton = CustomMenuButtonScene(radius: radius) oContent[0] = menuButton.node self.scene!.node.contents = oContent }

Is there a way to render different items or change the class I previously set in IB?

Does not work in Xcode 9

SWXMLHash.XMLIndexer Invalid redeclaration of 'Element'

https://stackoverflow.com/questions/45722820/github-exyte-macaw-examples-swift-compiler-error/45723640#45723640

Use remote image (from url) in the menu?

Thanks for the awesome framework!

I looked through the FanMenu code and it seems like it is using the image's name to load an local UIImage for the animation.

Is this a hard requirement by Macaw? Is it possible to use an UIImageView as a buttonItem where I handle the loading of the image from url?

Thank you!

Sorry to use this but this is the only way I can message you I don’t have your Twitter or discord or phone number

Can you please make one with a lot of switches like different stiles and check boxes and drop down menus and more please it will help me I’m making a app but idk how to do it please it can be done around in 1 month if you can do and can I get your PayPal to make a donate button for you please it will be in my app

I won't close nods after press them

Hi.
There is no delegate for nodes when we pressed one of them.
1- I won't close nodes after I pressed one of them but I want to get id of node that I pressed it.
2- I want to hide mainButton but I can't do that.
3- Is it possible set clear color to main circle of fan-menu?

Thanks.

FanMenu pod

elements underneath not accessible

When my instance of the fan menu is closed (the .button is visable bot not .items) the overall bounds seem to be covering elements and preventing user interaction.

How to make buttons scrollable?

How to make buttons scrollable?

incomplete warning

print("WARNING: FanMenu doesn't fit into view bounds. It should be at least ((fanMenu.menuRadius + fanMenu.radius) * 2.0) wide and in high")

Fix overlaying of buttons

Start from Sources in Readme

fanMenu.onItemWillClick doesn't call when click on fan menu button items

Hi
first of all thanks for this wonderful component, it would be very nice if we could have better access
when click on one of items at fan menu , there isn't any callback method fire

Customisation section in Readme

Carthage 11.3

Hello,

I felt very happy when i saw the Carthage release but you set the minimum target to 11.3 :(

Cannot use a single menu item.

When creating a menu with a single item

fanViewButton.items = [FanMenuButton(
id: "test",
image: UIImage(named: "Hook"),
color: Color.clear
)]

you get the following error.

Error: this application, or a library it uses, has passed an invalid numeric value (NaN, or not-a-number) to CoreGraphics API and this value is being ignored. Please fix this problem.

Can you give some guidance on how to set it up to use a single menu option?

Feature Request: Update Images?

Great control, thank you for it!

How would one go about allowing for a button image to be updated? Imagine a state: on/off - off having a different image or a just an image with some opacity. Or even a button with a series of states.

If you can point me in the right direction, I will happily code it up and submit a pull request.

Thank you again and cheers!

View overlapped

HI!
I found that when creating a view on the top for menu use, then it will cover the content from the bottom and the bottom view cannot click or slide. Is there an alternative way to make it??

Thank you!!

Change center button image on click on it.

FanMenu inside toolBar?

Hi,
I'm trying to put a fan menu inside my toolbar. Here is the toolbar item I have defined (the fan menu is clipped by the frame size, but if I don't provide a frame size then it does not show up at all in the toolbar. Is there any way to do this?

Thanks

Brian

lazy var barFanMenu: UIBarButtonItem = {
var fanMenu = FanMenu()
fanMenu.button = FanMenuButton(
id: "main",
image: UIImage(named: "chicken")?.withRenderingMode(.alwaysTemplate),
color: Color(val: 0x7C93FE)
)

    fanMenu.items = [
        FanMenuButton(
            id: "exchange_id",
            image: "desserts",
            color: Color(val: 0x9F85FF)
        ),
        FanMenuButton(
            id: "visa_id",
            image: "bread",
            color: Color(val: 0xF55B58)
        )
    ]
    
    fanMenu.menuRadius = 90.0
    fanMenu.duration = 0.2
    fanMenu.delay = 0.05
    fanMenu.interval = (Double.pi, 2 * Double.pi)
    fanMenu.frame = CGRect(x: 0, y: 0, width: 180, height: 90)
    fanMenu.clipsToBounds = false
    
    let b: UIBarButtonItem = UIBarButtonItem(customView: fanMenu)
    
    return b
}()

Rename CiculoMenu to FanMenu