https://github.com/globulus/swiftui-side-menu
Add a side menu / navigation drawer in SwiftUI!
https://github.com/globulus/swiftui-side-menu
Last synced: about 1 month ago
JSON representation
Add a side menu / navigation drawer in SwiftUI!
- Host: GitHub
- URL: https://github.com/globulus/swiftui-side-menu
- Owner: globulus
- License: mit
- Created: 2021-05-13T10:40:25.000Z (almost 5 years ago)
- Default Branch: main
- Last Pushed: 2021-09-01T07:29:34.000Z (over 4 years ago)
- Last Synced: 2025-04-24T13:34:50.187Z (11 months ago)
- Language: Swift
- Size: 4.88 KB
- Stars: 21
- Watchers: 3
- Forks: 9
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# SwiftUISideMenu
Add a **Side Menu / Navigation Drawer** to your SwiftUI view! The side menu is animated, responds to user swipes and can be manually shown or hidden.
The end result looks like this:

### Recipe
Check out [this recipe](https://swiftuirecipes.com/blog/side-menu-in-swiftui) for in-depth description of the component and its code. Check out [SwiftUIRecipes.com](https://swiftuirecipes.com) for more **SwiftUI recipes**!
### Sample usage
```swift
struct SideMenuTest: View {
@State private var showSideMenu = false
var body: some View {
NavigationView {
List(1..<6) { index in
Text("Item \(index)")
}
.navigationBarTitle("Dashboard", displayMode: .inline)
.navigationBarItems(leading: (
Button(action: {
withAnimation {
self.showSideMenu.toggle()
}
}) {
Image(systemName: "line.horizontal.3")
.imageScale(.large)
}
))
}.sideMenu(isShowing: $showSideMenu) {
VStack(alignment: .leading) {
Button(action: {
withAnimation {
self.showSideMenu = false
}
}) {
HStack {
Image(systemName: "xmark")
.foregroundColor(.white)
Text("close menu")
.foregroundColor(.white)
.font(.system(size: 14))
.padding(.leading, 15.0)
}
}.padding(.top, 20)
Divider()
.frame(height: 20)
Text("Sample item 1")
.foregroundColor(.white)
Text("Sample item 2")
.foregroundColor(.white)
Spacer()
}.padding()
.frame(maxWidth: .infinity, alignment: .leading)
.background(Color.black)
.edgesIgnoringSafeArea(.all)
}
}
}
```
### Installation
This component is distrubuted as a **Swift package**.