A Swift Package for presenting a configurable interactive capsule over all other content (including modal sheets).
Interactive Capsule Overlay is installed like any other Swift Package, just add this to the dependencies section of your Package.swift file
.package(url: "https://github.com/lontronix/Interactive-Capsule-Overlay", from: "1.1.0")
import InteractiveCapsuleOverlay
@main
struct ExampleApp: App {
var body: some Scene {
WindowGroup {
RootView()
.showsInteractiveCapsuleOverlay()
}
}
}Create a custom CapsuleOverlayConfiguration
| Parameter | Type | Description |
|---|---|---|
| title | String | Prominent text displayed in the capsule |
| timeoutInterval | TimeInterval | How long the capsule is displayed before being automatically dismissed |
| primaryAction | ActionConfiguration | The action that is invoked by tapping anywhere on the capsule but the secondary action button |
| secondaryAction | ActionConfiguration | the action that is invoked by tapping the secondary button |
| onDismissButtonPressed | (() -> Void)? | A closure that is called when the user taps the dismiss button |
The action is disable and hidden
The action is enabled and visible
| Parameter | Type | Description |
|---|---|---|
| iconIdentifier | String | The icon used to represent the action (an SF Symbol name) |
| onPressed | () -> Void | A callback this library calls when the action is invoked by the user |
The overlay is presented from the top of the screen.
The overlay is presented from the bottom of the screen.
| Parameter | Type | Description |
|---|---|---|
| yOffset | CGFloat | How far the capsule is offset from the top or bottom of the screen (based on the mode). |
Note: The specified value is automatically negated for the bottom mode. (i.e. 20 means move the capsule 20 points up)
import InteractiveCapsuleOverlay
extension CapsuleOverlayConfiguration {
static func taskCompleted(accentColor: Color) -> CapsuleOverlayConfiguration {
return CapsuleOverlayConfiguration(
title: "Task Completed",
primaryAction: .enabled(iconIdentifier: "slider.horizontal.3", onPressed: {
// Do something
}),
timeoutInterval: 5,
secondaryAction: .enabled(iconIdentifier: "arrow.uturn.backward.circle.fill", onPressed: {
// Do something
}),
accentColor: accentColor
)
}
}Use the showOverlay environment value to make the capsule appear with the desired configuration.
import InteractiveCapsuleOverlay
struct ContentView: View {
@Environment(\.showOverlay) private var showOverlay
var body: some View {
Button("Complete Task") {
showOverlay(.taskCompleted(.blue))
}
}
}