Floaty is simple floating action button for iOS.

Overview

Floaty

Swift 5.0 Version License Platform Build Status

Floaty is simple floating action button for iOS. (formerly KCFloatingActionButton)

Why change the name?

  1. Follow the swift naming convention.
  2. KCFloatingActionButton is too long.

Preview

Preview gif

Requirements

  • iOS 10.0+
  • Swift 5.0

Installation

CocoaPods

use_frameworks!
pod 'Floaty', '~> 4.2.0'

Carthage

github "kciter/Floaty"

Swift Package Manager

Once you have your Swift package set up, adding Floaty as a dependency is as easy as adding it to the dependencies value of your Package.swift.

dependencies: [
    .package(url: "https://github.com/kciter/Floaty.git", from: "4.2.1")
]

Manually

To install manually the Floaty in an app, just drag the Floaty/*.swift file into your project.

Usage

Storyboard support

Storyboard support1

Storyboard support2

Dependent on the UIWindow.

Floaty.global.button.addItem(title: "Hello, World!")
Floaty.global.show()

Dependent on the UIWindow

Dependent on the UIViewController.

let floaty = Floaty()
floaty.addItem(title: "Hello, World!")
self.view.addSubview(floaty)

Dependent on the UIViewController

Use icon

let floaty = Floaty()
floaty.addItem("Hello, World!", icon: UIImage(named: "icon")!)
self.view.addSubview(floaty)

Use icon

Use handler

Swift

let floaty = Floaty()
floaty.addItem("I got a handler", icon: UIImage(named: "icon")!, handler: { item in
    let alert = UIAlertController(title: "Hey", message: "I'm hungry...", preferredStyle: .alert)
    alert.addAction(UIAlertAction(title: "Me too", style: .default, handler: nil))
    self.present(alert, animated: true, completion: nil)
    floaty.close()
})
self.view.addSubview(floaty)

Use handler

Use custom item

let item = FloatyItem()
item.buttonColor = UIColor.blueColor()
item.title = "Custom item"
Floaty.global.button.addItem(item: item)

Use custom item

RTL Support

You can use the rtlMode property to mirror the Floaty Button for rtl languages.

Floaty.global.rtlMode = true

Rtl Enabled

Rtl Disabled

Sticky

You can use the sticky property.

floaty.sticky = true // sticking to parent UIScrollView(also UITableView, UICollectionView)
scrollView.addSubview(floaty)

Friendly Tap

You can use the friendlyTap property.

fab.friendlyTap = true
scrollView.addSubview(fab)

With the default location of the frame, the button is now tappable until the right and rightbottom of the screen. This prevents tapping behind it by accident.

Animation type

Pop Fade Slide Left
Pop animation gif Fade animation gif Slide left animation gif
Slide Up None
Slide up animation gif None animation gif

ToDo

  • Labels to come at the right hand side of the FAB Item menu.

Donate

If you like this open source, you can sponsor it. 😄

Paypal me

License

The MIT License (MIT)

Copyright (c) 2015 Lee Sun-Hyoup

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

Comments
  • How do I correctly adding Floaty to a UITableViewController inside a UITabBarController?

    How do I correctly adding Floaty to a UITableViewController inside a UITabBarController?

    Hi, I am new to swift and IOs development and I am trying to add Floaty programmatically to my UITableViewController which is inside a UITabBarController. The issue is that the bottom tab bar is overlayed on top of the floating action button.

    Inside my table view controller:

    let floaty = Floaty() ... self.view.addSubview(floaty) // also tried: self.tabBarController?.view.addSubview(floaty) I tried setting the margins like this:

    floaty.layoutMargins = UIEdgeInsets(top: 0, left: 0, bottom: 60, right: 0) floaty.layoutIfNeeded() self.view.layoutIfNeeded() But still it doesn't work.

    The problem is that the bottom tab bar is overlaying the floating button because the position is relative to the bottom right corner of the window, not the table view.

    opened by andreififiita 9
  • filling up the custom button background

    filling up the custom button background

    I am wanting to change the floating buttons to a custom 1 with a blue background. the image is round and is 1024 x 1024. When I place it into the code and run, the image is small and not filling up the default white background. How could I over come this? screen shot 2016-08-11 at 12 31 41 pm

    opened by SamuelShaw 9
  • How to use Floaty on Storyboard?

    How to use Floaty on Storyboard?

    I'm have problems with different iPhones, in iPhone X for example the Floaty is cutted by TabBar, so I did try set constraint programatically, but this not works beucase errors about views hieararchy. In the samples the Floaty is not added by storyboard.

    opened by augustocadini 7
  • Glitch position iPhoneX

    Glitch position iPhoneX

    Hello,

    I used sample in my own project:

    capture d ecran 2018-06-11 a 11 37 19

    When I pushed the view controller with the floaty button configured in viewDidLoad, I see that the button is shifting upwards (on the baseline, which is different on iPhoneX).

    simulator-screen-shot---iphone-x---2018-06-11-at-11 32 32

    Any solution ? Thanks

    opened by paul-lavoine 7
  • Floaty changing position itself when view appears

    Floaty changing position itself when view appears

    please check my video to see the problem 👍 https://youtu.be/GXUAQ9IgyJU

    I tried to put the following code in viewdidappear and viewdidload and it still keeps jumping up and down

      floaty.paddingY = 59
        floaty.buttonColor = UIColor.floatyColor()
        floaty.fabDelegate = self
        floaty.buttonImage = #imageLiteral(resourceName: "ic_fab_add")
        floaty.size = 56
        view.addSubview(floaty)
    

    what am I doing wrong or what should I add to the code or should modify it

    thanks

    opened by gulzatique 7
  • Change buttonColor on handler

    Change buttonColor on handler

    Hi, everyone i want change my button color on handler, but doesn´t change:

    (...)

        item.title = "Talvez"
        item.icon = UIImage(named: "neutral")
        item.handler = { item in
            itembuttonColor =  UIColor.gray
            
        }
    

    (...)

    It´s possible to give me some help ?

    Thanks for your time.

    opened by helderalvesoliveira 7
  • Problem with Keyboard into other scene

    Problem with Keyboard into other scene

    If you add the button into main scene and into other scene show the kayboard and back again the button Y is not correct!!

    You need to add this into "keyboardWillHide":

    internal func keyboardWillHide(_ notification: Notification) {
        UIView.animate(withDuration: 0.2, delay: 0, options: UIViewAnimationOptions(), animations: {
            if self.isCustomFrame == false {
                self.setRightBottomFrame()
            } else {
                self.size = min(self.frame.size.width, self.frame.size.height)
                self.frame = CGRect(
                    x: UIScreen.main.bounds.width-self.size - self.paddingX,
                    y: UIScreen.main.bounds.height-self.size - self.paddingY,
                    width: self.size,
                    height: self.size
                )
            }
    
            }, completion: nil)
    }
    

    Regards.

    opened by carmas123 7
  • Can't assign UIColor to the button color

    Can't assign UIColor to the button color

    I have a color and I'm trying to assign it as the button color. It's crashing right before the view with the button appears and the console says: 2016-03-29 22:23:31.643 Homework[34702:2044491] *** Terminating app due to uncaught exception 'NSInvalidArgumentException', reason: '*** -CGColor not defined for the UIColor <UIPlaceholderColor: 0x100a1ada0>; need to first convert colorspace.' *** First throw call stack: (0x184700f5c 0x1992f7f80 0x184700ea4 0x18a07c824 0x100173ff8 0x10016df94 0x10016e098 0x189488b4c 0x189473bd4 0x189472df4 0x189454d00 0x1894549ec 0x18945407c 0x189453dd0 0x18944d4bc 0x1846b7c30 0x1846b59d4 0x1845e4de0 0x189cc40ac 0x189cbef44 0x100051eb8 0x199b228b8) libc++abi.dylib: terminating with uncaught exception of type NSException (lldb) It points the crash to the class KCFloatingActionButton.swift line 433 and when you call that function in the same file, line 220. I'm sure the color I'm assigning is a UIColor.

    opened by HenriqueDoura 7
  • Floaty touch area bug.

    Floaty touch area bug.

    I used following code to make global floaty button's position more higher.

    override func viewDidLoad(){
        ...
        Floaty.global.button.paddingY += 48
        ...
    

    global button's position got higher, but its actual touch area is still at global button's default position.

    2018-05-23 4 43 13 2018-05-23 4 43 13

    So when I touch that area, Floaty works as it touched, so I can't touch the tabBar button behind Floaty's touch area.

    +++

    I figured out floaty's touch area with checking color blended layers in Simulator

    2018-05-23 4 52 32
    opened by Cyanide7523 6
  • XCTest can't find floaty item buttons

    XCTest can't find floaty item buttons

    What is the proper way to automate tests? I can set accessibility ids on FloatyItems but I can't seem to "find" them in my tests. They also don't [seem to] appear as descendants of the main Floaty.

    I can find the main button with: app.otherElements["floaty"].exists but not any items: app.otherElements["floatyitem"].exists

    if I look at the floaty: app.otherElements["floaty"].descendants(matching: .any).count I get one element, and it's the image.

    opened by jmilillo 6
  • Size issue when changing buttonImage

    Size issue when changing buttonImage

    Hi! Thanks for this amazing tool.

    I'm trying to change the floaty.buttonImage in the handler of one of the items and it looks like the image is not being constrained to the bounds of the button like it is for the item.icon...screen shot and img_0216 copy code below. placeToStayItem = FloatyItem() placeToStayItem?.buttonColor = UIColor.flatSunFlower() placeToStayItem?.title = "Place to stay" placeToStayItem?.icon = UIImage(named: "changeHotel") placeToStayItem?.handler = { item in self.spawnDoYouKnowWhereYouWillBeStayingQuestionView() self.floaty?.close() self.floaty?.buttonColor = (self.placeToStayItem?.buttonColor)! self.floaty?.buttonImage = UIImage(named: "changeHotel") }

    opened by mwurm93 6
  • Isn't the [weak self] needed in addItem() ?

    Isn't the [weak self] needed in addItem() ?

    This is the example of usage of Floaty buttons on this github repo. The code below creates a Floaty button and add on item inside.

    let floaty = Floaty()
    floaty.addItem("I got a handler", icon: UIImage(named: "icon")!, handler: { item in
        let alert = UIAlertController(title: "Hey", message: "I'm hungry...", preferredStyle: .alert)
        alert.addAction(UIAlertAction(title: "Me too", style: .default, handler: nil))
        self.present(alert, animated: true, completion: nil)
        floaty.close()
    })
    

    So my question is, are you sure that we really dont need a [weak self] since the method addItem is having a handler as an escaping closure?

    opened by qsd-faris 0
  • Floaty items aren't clickable when I turn voiceover on

    Floaty items aren't clickable when I turn voiceover on

    I tried to add accessibility features to my app but when I turn on VoiceOver, floaty items are not clickable. I manually added these lines below but they are still not clickable. I also tried #183. When I open VoiceOver from settings, can't click floaty items. iPhone 7 iOS 15.3 Swift 5 Xcode 13.4

      @discardableResult
      @objc open func addItem(_ title: String, icon: UIImage?, handler: @escaping ((FloatyItem) -> Void)) -> FloatyItem {
        let item = FloatyItem()
          // ---------
        item.isAccessibilityElement = true
        item.accessibilityLabel = title
        item.accessibilityHint = "hint hint"
        item.accessibilityTraits.insert(.button)
          // ---------
        itemDefaultSet(item)
        item.title = title
        item.icon = icon
        item.handler = handler
        addItem(item: item)
        return item
      }
    
      }
    
    opened by EmirhanKarahan 0
  • How to cover Overlay on TabBar & NavigationBar

    How to cover Overlay on TabBar & NavigationBar

    Hi How to cover the overlay on Tabbar & NavigtaionBar too ?

     fileprivate func setOverlayView() {
        setOverlayFrame()
        overlayView.backgroundColor = overlayColor
        overlayView.alpha = 0
        overlayView.isUserInteractionEnabled = true
      }
    
      fileprivate func setOverlayFrame() {
        if let superview = superview {
          overlayView.frame = CGRect(
            x: 0,y: 0,
            width: superview.bounds.width,
            height: superview.bounds.height
          )
        }
      }
    
    opened by arishanapalli 0
  • Floaty padding Y is not working when set rtlMode property is true!

    Floaty padding Y is not working when set rtlMode property is true!

    Floaty padding Y is not working when set rtlMode property is true!

    Here is my code:

        Floaty.global.rtlMode = true
        Floaty.global.button.paddingY = 55
        Floaty.global.show()
    
    
    opened by sadeghgoo 0
Owner
Lee Sun-Hyoup
Lee Sun-Hyoup
Material Design Floating Action Button in liquid state

LiquidFloatingActionButton [] (https://github.com/Carthage/Carthage) LiquidFloatingActionButton is floating action button component of material design

Takuma Yoshida 3.8k Dec 29, 2022
Easily customizable floating button menu created with SwiftUI

FloatingButton Easily customizable floating button menu created with SwiftUI We are a development agency building phenomenal apps. Usage Create main b

Exyte 715 Dec 30, 2022
Customizable download button with progress and transition animations. It is based on Apple's App Store download button.

AHDownloadButton is a customizable download button similar to the download button in the latest version of Apple's App Store app (since iOS 11). It fe

Amer Hukić 465 Dec 24, 2022
Revamped Download Button. It's kinda a reverse engineering of Netflix's app download button.

NFDownloadButton Revamped Download Button Requirements Installation Usage License Requirements iOS 8.0+ Swift 4.2+ Xcode 10.0+ Installation CocoaPods

Leonardo Cardoso 433 Nov 15, 2022
Simple and customizable button in Swift

SwiftyButton Maintainer(s): @nickm01 @pmacro @aryamansharda Simple and customizable button in Swift. Installation Cocoapods pod 'SwiftyButton' Cartha

Scoop 542 Dec 13, 2022
iOS Pod for a Soft UI (Neumorphic) Button for UIKit written in Swift

iOS Pod for a Soft UI (Neumorphic) Button for UIKit written in Swift

Pallav Agarwal 21 Oct 23, 2022
iOS 7-style bouncy button.

SSBouncyButton SSBouncyButton is simple button UI component with iOS 7-style bouncy animation. Take A Look Try It! pod 'SSBouncyButton', '~> 1.0' Use

StyleShare 310 Dec 15, 2022
Flat design pressable button for iOS developers.

HTPressableButton HTPressableButton is designed for iOS developers to be able to spend time developing ideas, not building basic buttons. These stylis

Famolus 859 Dec 12, 2022
Interactive and fully animated Material Design button for iOS developers.

WYMaterialButton Inspired by Google Material Design, written purely in Swift 3. WYMaterialButton implemented Material Design on iOS and add more dynam

Yu Wang 76 Oct 7, 2022
A high-performance button control with rounded corners for iOS.

TORoundedButton TORoundedButton is an open source UI control of a standard user button. Its design consists of displaying text on top of a solid recta

Tim Oliver 480 Dec 26, 2022
Cute Animated Button written in Swift.

DOFavoriteButton Cute Animated Button written in Swift. It could be just right for favorite buttons! Requirements iOS 7.0+ Swift 1.2 Installation Cart

Daiki Okumura 3.6k Dec 29, 2022
Customizable and easy to use expandable button in Swift.

ExpandableButton Requirements iOS 9.0+ Installation CocoaPods: Add the following line to your Podfile: pod 'ExpandableButton' #for swift less than 4.

Dmytro Mishchenko 98 Dec 5, 2022
IGStoryButtonKit provides an easy-to-use button with rich animation and multiple way inspired by instagram story/stories.

Introduction Have you ever seen UI like instagram story, haven't you? Actually, features like instagram story have been implemented in many applicatio

mutation 34 Nov 8, 2022
LTHRadioButton - A radio button with a pretty animation

LTHRadioButton Slightly inspired by Google's material radio button. The clip below has 3 sections: full speed, 25% and 10%, but after converting it to

Roland Leth 368 Dec 16, 2022
Multiple state tap-to-toggle UIButton (like old camera flash button)

Multiple State Toggle UIButton A UIButton subclass that implements tap-to-toggle button text. (Like the camera flash and timer buttons) Usage Just cre

Yonat Sharon 83 Oct 11, 2022
Lickable-Button We made the buttons on the screen look so good you'll want to lick them

Lickable-Button We made the buttons on the screen look so good you'll want to lick them. - Steve Jobs A little SwiftUI button project at WWDC 2021 Lic

Nate Thompson 14 Dec 29, 2021
Craft that perfect SwiftUI button effect 👌🏼

buttoncraft (SwiftUI 3.0 App) Experimenting with SwiftUI 3.0 whilst creating a practical app to craft that perfect button style. ✈️ Testflight https:/

An Trinh 188 Dec 28, 2022
Custom loading button with progress swiftui

CustomLoadingButton Simple Custom Loading Progress Button for SwiftUI Version 1.0.0 This version requires Xcode 11+ SwiftUI iOS 13+ macOS 10.15+ Insta

Tariqul 1 Dec 14, 2022
Flat button with 9 different states using POP

VBFPopFlatButton Flat button with 21 different states and 2 types animated using pop. These are some examples of both types in different states: And h

Victor Baro 3.1k Nov 30, 2022