Backpack-SwiftUI/Bottom sheet

Large Bottom Sheet

Day	Night

Medium Bottom Sheet

Day	Night

Content Fit Bottom Sheet

Day	Night

Modal Closeable Bottom Sheet

Day	Night

Usage

BPKBottomSheet works as a ViewModifier that can be applied to any SwiftUI View. It's presented by binding the isPresented property to a Binding<Bool>.

The medium bottom sheet can be dragged to full screen.

You can close the bottom sheet by dragging the handle, tapping the close icon or by tapping the scrim.

Large Bottom Sheet

                                                
                                                BPKButton("Show bottom sheet") {
                                                    showBottomSheet.toggle()
                                                }
                                                .bpkBottomSheet(
                                                    isPresented: $showBottomSheet,
                                                    contentMode: .large) {
                                                        content
                                                    }

Closeable Bottom Sheet

                                                
                                                BPKButton("Show bottom sheet") {
                                                    showBottomSheet.toggle()
                                                }
                                                .bpkCloseableBottomSheet(
                                                    isPresented: $showBottomSheet,
                                                    contentMode: .medium,
                                                    closeButtonAccessibilityLabel: "Close button") {
                                                        content
                                                    }

Content Fit Bottom Sheet

                                                
                                                BPKButton("Show bottom sheet") {
                                                    showBottomSheet.toggle()
                                                }
                                                .bpkBottomSheet(
                                                    isPresented: $showBottomSheet,
                                                    contentMode: .contentFit) {
                                                        content
                                                    }