Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/smartvipere75/bottombar-swiftui
BottomBar component for SwiftUI
https://github.com/smartvipere75/bottombar-swiftui
Last synced: 2 months ago
JSON representation
BottomBar component for SwiftUI
- Host: GitHub
- URL: https://github.com/smartvipere75/bottombar-swiftui
- Owner: smartvipere75
- License: mit
- Created: 2019-07-02T17:19:26.000Z (over 5 years ago)
- Default Branch: master
- Last Pushed: 2022-08-15T14:14:42.000Z (over 2 years ago)
- Last Synced: 2024-08-03T09:03:00.739Z (6 months ago)
- Language: Swift
- Homepage:
- Size: 12.8 MB
- Stars: 490
- Watchers: 6
- Forks: 39
- Open Issues: 3
-
Metadata Files:
- Readme: README.md
- Funding: .github/FUNDING.yml
- License: LICENSE
Awesome Lists containing this project
- fucking-about-SwiftUI - bottombar-swiftui
README
# BottomBar-SwiftUI
BottomBar component for SwiftUI inspired by this [concept](https://dribbble.com/shots/5925052-Google-Bottom-Bar-Navigation-Pattern)
![Preview](./preview.gif "Preview")
### Requirements
* Xcode 11
* iOS 13### Installation
In Xcode go to `File -> Swift Packages -> Add Package Dependency` and paste this repo url `https://github.com/smartvipere75/bottombar-swiftui` then `Next -> Branch: master -> Next`
### Usage
1. `import BottomBar_SwiftUI`
2. Create array of `BottomBarItem` (maximum 4)
3. Create `@State private var selectedIndex` within a View to keep track of `BottomBar` selected index
4. Create `BottomBar`like `BottomBar(selectedIndex: $selectedIndex, items: items)`### Example
```
import SwiftUI
import BottomBar_SwiftUIlet items: [BottomBarItem] = [
BottomBarItem(icon: "house.fill", title: "Home", color: .purple),
BottomBarItem(icon: "heart", title: "Likes", color: .pink),
BottomBarItem(icon: "magnifyingglass", title: "Search", color: .orange),
BottomBarItem(icon: "person.fill", title: "Profile", color: .blue)
]struct BasicView: View {
let item: BottomBarItemvar detailText: String {
"\(item.title) Detail"
}var followButton: some View {
Button(action: openTwitter) {
VStack {
Text("Developed by Bezhan Odinaev")
.font(.headline)
.foregroundColor(item.color)Text("@smartvipere75")
.font(.subheadline)
.foregroundColor(.gray)
}
}
}var destination: some View {
Text(detailText)
.navigationBarTitle(Text(detailText))
}var navigateButton: some View {
NavigationLink(destination: destination) {
ZStack {
Rectangle()
.fill(item.color)
.cornerRadius(8)
.frame(height: 52)
.padding(.horizontal)Text("Navigate")
.font(.headline)
.foregroundColor(.white)
}
}
}func openTwitter() {
guard let url = URL(string: "https://twitter.com/smartvipere75") else {
return
}
UIApplication.shared.open(url, options: [:], completionHandler: nil)
}var body: some View {
VStack {
Spacer()followButton
Spacer()
navigateButton
}
}
}struct ContentView : View {
@State private var selectedIndex: Int = 0var selectedItem: BottomBarItem {
items[selectedIndex]
}var body: some View {
NavigationView {
VStack {
BasicView(item: selectedItem)
.navigationBarTitle(Text(selectedItem.title))
BottomBar(selectedIndex: $selectedIndex, items: items)
}
}
}
}
```### Extra
Check out my app [Spendy](https://apps.apple.com/us/app/spendy-spendings-reimagined/id1524435907)
Follow me on [Twitter](https://twitter.com/smartvipere75) for latest updates.