A SwiftUI based custom sheet card to reuse in iOS application.
If you want to learn how to build this type of component try the following tutorial.
Add this Swift package to your project
https://github.com/mahmudahsan/SwiftUI-Action-Sheet-Card
import SwiftUI
import ActionSheetCard
struct ContentView: View {
@State var showingSheet = false
var content: some View {
VStack {
Text("Custom Sheet")
.font(.largeTitle)
.padding()
Button(action: {
showingSheet = true
}) {
Text("Open Sheet")
}
}
.edgesIgnoringSafeArea(.all)
}
var sheetView: some View {
ActionSheetCard(isShowing: $showingSheet,
items: [
ActionSheetCardItem(sfSymbolName: "play", label: "Play") {
print("Play Tapped")
showingSheet = false
},
ActionSheetCardItem(sfSymbolName: "stop", label: "Stop", foregrounColor: Color.red) {
print("Stop Tapped")
showingSheet = false
},
ActionSheetCardItem(sfSymbolName: "record.circle", label: "Record")
])
}
var body: some View {
ZStack {
content
sheetView
}
}
}
import ActionSheetCard
in your SwiftUI View@State var showingSheet = false
stateActionSheetCard(isShowing: $showingSheet,
items: [
ActionSheetCardItem(sfSymbolName: "play", label: "Play") {
print("Play Tapped")
showingSheet = false
},
ActionSheetCardItem(sfSymbolName: "stop", label: "Stop", foregrounColor: Color.red) {
print("Stop Tapped")
showingSheet = false
},
ActionSheetCardItem(sfSymbolName: "record.circle", label: "Record")
])
ActionSheetCardItem(sfSymbolName: "stop", label: "Stop", foregrounColor: Color.red) {
// Callback
print("Stop Tapped")
showingSheet = false
}
// No Callback
ActionSheetCardItem(sfSymbolName: "record.circle", label: "Record")
ZStack
, otherwise the black background view will not show correctlyvar body: some View {
ZStack {
content
sheetView
}
}
For more examples open /Demo/Demo.xcodeproj
// If font and color is not provide, default values will be used
ActionSheetCardItem(
label: "Stop",
sfSymbolName: "stop",
labelFont: Font.largeTitle,
foregrounColor: Color.red,
foregroundInactiveColor: Color.gray
) {
print("Stop Tapped")
showingSheet = false
},
ActionSheetCard(
isShowing: $showingSheet,
items: [],
backgroundColor: Color.red
)
link |
Stars: 20 |
Last commit: 2 years ago |
Swiftpack is being maintained by Petr Pavlik | @ptrpavlik | @swiftpackco | API | Analytics