SystemNotification
About SystemNotification
SystemNotification
is lets you mimic the native iOS system notification (that is presented when e.g. toggling silent mode on and off) in your SwiftUI
apps.
The result can look like this…or completely different:
These notifications have a default style, but can be customized to fit your specific app.
Installation
Swift Package Manager
https://github.com/danielsaidi/SystemNotification.git
CocoaPods
pod SystemNotification
Getting started
SystemNotification
contains a SystemNotification
view, that can be created with an isActive
binding, an optional configuration
and a custom view
.
For instance:
let notification = SystemNotification(
isActive: $isNotificationActive,
configuration: SystemNotification.Configuration(edge: .bottom)) { _ in
SystemNotificationMessage(
icon: Image(systemName: "exclamationmark.triangle"),
title: "Alert",
text: "Something happened!",
configuration: SystemNotificationMessage.Configuration(
iconColor: .red
)
)
}
You can use any view you like in the notification, but if you want to use the standard SystemNotificationMessage
, you can just use this shorthand:
let notification = SystemNotification(
icon: Image?,
title: String,
text: String,
isActive: $isNotificationActive,
configuration: SystemNotification.Configuration(edge: .bottom)) { isActive in
SystemNotificationMessage(
icon: Image(systemName: "exclamationmark.triangle"),
title: "Alert",
text: "Something happened!",
configuration: SystemNotificationMessage.Configuration(
iconColor: .red
)
)
}
Once you have a notification, you can add it to any view, using the systemNotification
modifier:
List(items) { item
HStack { item.name }
}.systemNotification(notification)
The notification will be added above the view and docked outside of to the selected edge. When the isActive
binding is set to true, it will slide in using the selected animation.
You can also use a SystemNotificationContext
to easily present multiple notifications with a single systemNotification
modifier:
let context = SystemNotificationContext()
context.present(notification1)
context.present(notification2)
// To use it, provide it instead of an `isActive` binding:
List(items) { item
HStack { item.name }
}.systemNotification(context: context)
SystemNotification.Configuration
A SystemNotification
can be configured with a SystemNotification.Configuration
that specifies:
animation
backgroundColor
cornerRadius
edge
minWidth
duration
shadowRadius
You can customize these properties to control how the notification looks and behaves.
The default configuration makes the notification look and behave like the native one.
SystemNotificationMessage.Configuration
A SystemNotificationMessage
view can be configured with a SystemNotificationMessage.Configuration
instance that specifies:
iconColor
iconFont
padding
textColor
textFont
titleColor
titleFont
You can customize these properties to control how the notification message looks.
The default configuration makes the message look like the native one.
Demo app
This repo contains a basic demo app that demonstrates how to use the bottom sheet.
Just open the Demo
project and run the app.
Contact me
Feel free to reach out if you have questions or if you want to contribute in any way:
- E-mail: [email protected]
- Twitter: @danielsaidi
- Web site: danielsaidi.com
License
SystemNotification is available under the MIT license. See LICENSE file for more info.