Giter Club home page Giter Club logo

popupview's Introduction

Popup View

Toasts, alerts and popups library written with SwiftUI


We are a development agency building phenomenal apps.




Twitter Version Carthage Compatible License Platform

Usage

  1. Put all your body code into a ZStack
  2. Add a binding bool to control popup presentation state
  3. Add .popup modifier to your ZStack
struct ContentView: View {

    @State var showingPopup = false

    var body: some View {
        ZStack {
            // your view
        }
        .popup(isPresented: $showingPopup, autohideIn: 2) {
            Text("The popup")
                .frame(width: 200, height: 60)
                .background(Color(red: 0.85, green: 0.8, blue: 0.95))
                .cornerRadius(30.0)
        }
    }
}

Required parameters

isPresented - binding to determine if the popup should be seen on screen or hidden
view - view you want to display on your popup

Available customizations - optional parameters

type - toast, float or default
position - top or bottom (for default case it just determines animation direction)
animation - custom animation for popup sliding onto screen
autohideIn - time after which popup should disappear
dragToDismiss - true by default: enable/disable drag to dismiss (upwards for .top popup types, downwards for .bottom and default type)
closeOnTap - true by default: enable/disable closing on tap on popup
closeOnTapOutside - false by default: enable/disable closing on tap on outside of popup
backgroundColor - Color.clear by default: change background color of outside area
dismissCallback - custom callback to call once the popup is dismissed

Draggable card

With latest addition of dragToDismiss, you can use bottom toast to add this popular component to your app (see example project for implementation)

.popup(isPresented: $show, type: .toast, position: .bottom) {
    // your content
}

Examples

To try PopupView examples:

  • Clone the repo https://github.com/exyte/PopupView.git
  • Open terminal and run cd <PopupViewRepo>/Example/
  • Run pod install to install all dependencies
  • Run open PopupViewExample.xcworkspace/ to open project in the Xcode
  • Try it!

Installation

To install PopupView, simply add the following line to your Podfile:

pod 'ExytePopupView'

To integrate PopupView into your Xcode project using Carthage, specify it in your Cartfile

github "Exyte/PopupView"
dependencies: [
    .package(url: "https://github.com/exyte/PopupView.git", from: "1.0.0")
]

Manually

Drop PopupView.swift in your project.

Requirements

  • iOS 13+
  • Xcode 11+

popupview's People

Contributors

denis-obukhov avatar f3dm76 avatar jlz avatar jpangburn avatar kaioelfke avatar mnndnl avatar richardgroves avatar shipinev avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.