• Stars
    star
    1,010
  • Rank 43,705 (Top 0.9 %)
  • Language
    Swift
  • License
    MIT License
  • Created over 4 years ago
  • Updated 3 months ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

Easily customizable floating button menu created with SwiftUI

Β Β Β Β Β 

FloatingButton

Easily customizable floating button menu created with SwiftUI

SPM Compatible Cocoapods Compatible Carthage Compatible License: MIT

Usage

  1. Create main button view and a number of submenu buttons β€” both should be cast to AnyView type.

  2. Pass both to FloatingButton constructor:

    FloatingButton(mainButtonView: mainButton, buttons: buttons)
  3. You may also pass a binding which will determine if the menu is currently open. You may use this to close the menu on any submenu button tap for example.

FloatingButton(mainButtonView: mainButton, buttons: buttons, isOpen: $isOpen)
  1. Chain .straight() or .circle() to specify desired menu type.
  2. Chain whatever you like afterwards. For example:
    FloatingButton(mainButtonView: mainButton, buttons: textButtons)
        .straight()
        .direction(.top)
        .alignment(.left)
        .spacing(10)
        .initialOffset(x: -1000)
        .animation(.spring())
    
    FloatingButton(mainButtonView: mainButton2, buttons: buttonsImage.dropLast())
        .circle()
        .startAngle(3/2 * .pi)
        .endAngle(2 * .pi)
        .radius(70)
        .layoutDirection(.counterClockwise)

Universal options

spacing - space between submenu buttons
initialScaling - size multiplyer for submenu buttons when the menu is closed
initialOffset - offset for submenu buttons when the menu is closed
initialOpacity - opacity for submenu buttons when the menu is closed
animation - custom SwiftUI animation like Animation.easeInOut() or Animation.spring()
delays - delay for each submenu button's animation start - you can pass array of delays - one for each element - or you can pass delayDelta - then this same delay will be used for each element mainZStackAlignment - main button and submenu buttons are contained in one ZStack (not an overlay so the menu has a correct size), you can change this ZStack's alignment with this parameter inverseZIndex - inverse zIndex of mainButton and the children. Use, for example, if you have a negative spacing and want to change the order wholeMenuSize - pass CGSize binding to get updates of menu's size. Menu's size includes main button frame and all of elements' frames menuButtonsSize - pass CGSize binding to get updates of combined menu elements' size

Straight menu only options

direction - position of submenu buttons relative to main menu button
alignment - alignment of submenu buttons relative to main menu button

Circle only options

startAngle
endAngle
radius - distance between center of main button and centers of submenu buttons
layoutDirection - changes the button layout direction from the startAngle to the endAngle

Examples

To try out the FloatingButton examples:

  1. Clone the repo git clone [email protected]:exyte/FloatingButton.git.
  2. Open <FloatingButtonRepo>/Example.
  3. Run Example.xcodeproj - framework is imported as a local SPM package.
  4. Try it!

Installation

Swift Package Manager

dependencies: [
    .package(url: "https://github.com/exyte/FloatingButton.git")
]

CocoaPods

pod 'FloatingButton'

Carthage

github "Exyte/FloatingButton"

Requirements

  • iOS 14.0+ / macOS 11.0+ / watchOS 7.0+
  • Xcode 12+

Our other open source SwiftUI libraries

PopupView - Toasts and popups library
Grid - The most powerful Grid container
ScalingHeaderScrollView - A scroll view with a sticky header which shrinks as you scroll
AnimatedTabBar - A tabbar with number of preset animations
MediaPicker - Customizable media picker
Chat - Chat UI framework with fully customizable message cells, input view, and a built-in media picker
ConcentricOnboarding - Animated onboarding flow
ActivityIndicatorView - A number of animated loading indicators
ProgressIndicatorView - A number of animated progress indicators
SVGView - SVG parser
LiquidSwipe - Liquid navigation animation

More Repositories

1

Macaw

Powerful and easy-to-use vector graphics Swift library with SVG support
Swift
5,964
star
2

PopupView

Toasts and popups library written with SwiftUI
Swift
2,976
star
3

Grid

The most powerful Grid container missed in SwiftUI
Swift
1,643
star
4

ARTetris

Augmented Reality Tetris made with ARKit and SceneKit
Swift
1,532
star
5

ActivityIndicatorView

A number of preset loading indicators created with SwiftUI
Swift
1,276
star
6

ConcentricOnboarding

SwiftUI library for a walkthrough or onboarding flow with tap actions
Swift
1,242
star
7

ScalingHeaderScrollView

A scroll view with a sticky header which shrinks as you scroll. Written with SwiftUI.
Swift
890
star
8

ReadabilityKit

Preview extractor for news, articles and full-texts in Swift
Swift
829
star
9

fan-menu

Menu with a circular layout based on Macaw
Swift
726
star
10

Chat

A SwiftUI Chat UI framework with fully customizable message cells and a built-in media picker
Swift
561
star
11

SVGView

SVG parser and renderer written in SwiftUI
Swift
530
star
12

LiquidSwipe

Example of using SwiftUI to create a beautiful Liquid Swipe control
Swift
474
star
13

Macaw-Examples

Various usages of the Macaw library
Swift
354
star
14

AnimatedTabBar

A tabbar with a number of preset animations written in pure SwiftUI
Swift
284
star
15

AndroidAnimatedNavigationBar

AnimatedNavigationBar is a navigation bar with a number of preset animations written in Jetpack Compose
Kotlin
263
star
16

MediaPicker

Customizable media picker written with SwiftUI
Swift
255
star
17

replicating

Kotlin
245
star
18

ProgressIndicatorView

An iOS progress indicator view library written in SwiftUI
Swift
200
star
19

ComposeMultiplatformDribbbleAudio

A repo for the Dribbble Replicating Compose Multiplatform article
Kotlin
71
star
20

android-waves-progressbar

A depth gauge progress bar, inspired by Apple Watch dive widget.
Kotlin
41
star
21

clean-swift-article

Swift
37
star
22

sweet.eclipse

Sweet Eclipse
HTML
33
star
23

gaster

Ethereum transactions stats for your smart contracts
JavaScript
30
star
24

FlagAndCountryCode

A country code and flag icon provider library for iOS apps
Swift
28
star
25

android-replicating

Replicating complex UI using Jetpack Compose
Kotlin
23
star
26

ShapedBackgroundAndroid

Repo for the instagram-like shaped background on Android
Kotlin
23
star
27

wwdc2020-tutorials

Swift
21
star
28

AnimatedGradient

Swift
18
star
29

core-haptics-example

Swift
13
star
30

homebrew-formulae

Ruby
1
star
31

openai-assistants-api

Swift
1
star