PopupView

Implementation of view popups written with SwiftUI

Bottom	Top	Center

Requirements

Platform	Minimum Swift Version	Installation
iOS 15+	5.7	Swift Package Manager

Installation

The Swift package manager is a tool for automating the distribution of Swift code and is integrated into the swift compiler.

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

dependencies: [
    .package(url: "https://github.com/Mijick/PopupView.git", branch(“main”))
]

Usage

Setup project
Implement animation protocol
Present popup view
Dismiss popup view

Setup project

Inside @main structure body call the implementPopupView method

  var body: some Scene {
        WindowGroup(content: ContentView().implementPopupView)
  }

Animation protocols

The library provides an ability to use custom views. In order to present a view on top of other views, it is necessary to inherit from one of the protocols during popup creation:

TopPopup – presents popup view from the top
CentrePopup – presents popup view from the center
BottomPopup – presents popup view from the bottom

Common Setup

Inheritance from one of the popup protocols requires the implementation of the following requirements:

Set the id parameter to control the uniqueness of the views being presented

let id: String { "some_id" }

Implement createContent method. It’s used instead of the body property, and declares the design of the popup view

func createContent() -> some View {
        VStack(alignment: .leading, spacing: 0) {
            Text("First")
            Spacer.height(12)
            Text("Another element")
        }
        .padding(.top, 36)
}

Implement configurePopup(popup: Config) -> Config method to setup UI of presented view Each protocol has its own set of configuration type

An example of implementing BottomPopup protocol configurations setups

func configurePopup(popup: BottomPopupConfig) -> BottomPopupConfig {
        popup
            .contentIgnoresSafeArea(true)
            .activePopupCornerRadius(0)
            .stackedPopupsCornerRadius(0)
}

Available Configurations

	TopPopup	CentrePopup	BottomPopup
backgroundColour	✅	✅	✅
contentIgnoresSafeArea	✅	❌	✅
horizontalPadding	✅	✅	✅
bottomPadding	❌	❌	✅
topPadding	✅	❌	❌
stackedPopupsOffset	✅	❌	✅
stackedPopupsScale	✅	❌	✅
stackedElementsLimit	✅	❌	✅
cornerRadius	❌	✅	❌
activePopupCornerRadius	✅	❌	✅
stackedPopupsCornerRadius	✅	❌	✅
activePopupCornerRadius	✅	❌	✅
dragGestureProgressToClose	✅	❌	✅
dragGestureAnimation	✅	❌	✅
tapOutsideToDismiss	❌	✅	❌
transitionAnimation	✅	✅	✅

TopPopup

Safe area	Ignore safe area

CentrePopup

BottomPopup

Safe Area	Ignore Safe Area

Popup Stack

The PopupView allows you to stack views and present several popups on the screen at the same time. The library automatically manages the display of multiple pop-up windows depending on the type of presentation.

Bottom stack	Top stack	Different view heights	Bottom stack

Popup presentation

To present a view, it is enough to initialize it and call the method present

 SomeView().present()

Popup dismiss

Call the method dismiss inside the popup view to dismiss it

It’s also available to dismiss any view with methods inside the PopupManager class:

dismissLast – Dismisses the last presented popup view

PopupManager.dismissLast()

dismiss(id:) – Dismisses the presented popup view with concrate id

PopupManager.dismiss(id: "some_id")

dismissAll – Dismisses all presented popup views

PopupManager.dismissAll()

Project example

PopupView-Example – example of usage PopupView library

GitHub

View Github