BottomBar component for SwiftUI

Bezhan

Last update: Dec 10, 2022

Related tags

SwiftUI App bottombar-swiftui

Overview

BottomBar-SwiftUI

BottomBar component for SwiftUI inspired by this concept

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

import BottomBar_SwiftUI
Create array of BottomBarItem (maximum 4)
Create @State private var selectedIndex within a View to keep track of BottomBar selected index
Create BottomBarlike BottomBar(selectedIndex: $selectedIndex, items: items)

Example

import SwiftUI
import BottomBar_SwiftUI

let 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: BottomBarItem

    var 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 = 0

    var selectedItem: BottomBarItem {
        items[selectedIndex]
    }

var body: some View {
        NavigationView {
            VStack {
                BasicView(item: selectedItem)
                    .navigationBarTitle(Text(selectedItem.title))
                BottomBar(selectedIndex: $selectedIndex, items: items)
            }
        }
    }
}

Extra

Follow me on Twitter for latest updates.

Comments

License?

Hello, wonderful work. I don't believe you have chosen a license for this code. If you choose to open source it I suggest using the MIT license. We are interested in integrating some of this, but need your license to be defined.

opened by neodave 2
Contributing

Apparently, this small toy/tool got a little bit of attention from the community. Could the owner of the repo please clarify under which conditions pull requests that add or modify features (i.e. not just bug fixes) will be accepted/considered?

opened by AnarchoSystems 1
Convenience Initialization

Hey,

Your repo is exactly the solution I was looking for. I added two convenience methods for initialization. Maybe you find them useful. Also, somehow the animations didn't work on my device, so I fixed them.

Happy coding!

opened by AnarchoSystems 0
Setting to avoid seeing the initial animation?

It would be great if there was a parameter that allowed to specify whether initial animation that moves the BottomBar from (0, 0) to it's final resting place didn't happen. IMHO, while cool, it's a bit distracting.

opened by tciuro 1
BottomBarItem for each View

Hi, I don't know if this is possible but I'm not able to see it in the Wiki.

I have to link every BottomBarItem to an specific View, in the Wiki the only example is a Dynamic view which takes the selected bar item title and place it into the dynamic View.

Is it possible?

Thanks!

opened by ghost 1

Owner

Bezhan

iOS Developer.

GitHub

SwiftUI component for QuickLook

GXQuickLookView SwiftUI + QuickLook. ?? Требования ✅ Xcode 12.0 ✅ Swift 5+ ✅ iOS

12 Sep 19, 2022

A SwiftUI component which handles logging in with Apple to Firebase

Login with Apple Firebase SwiftUI I made this SwiftUI component to handle logging in with Apple to Firebase. Demo Gif Usage in SwiftUI struct ContentV

153 Dec 23, 2022

A swift package(SPM) with iOS UI component that loads and displays images from remote urls or local assets and displays in a slide-show form with auto scroll feature.

MDBannersView A swift package with an iOS UI component that loads and displays images from remote urls, local assets and displays in a slide-show form

2 Feb 5, 2022

🎲 100% SwiftUI 2.0, classic 2048 game [SwiftUI 2.0, iOS 14.0+, iPadOS 14.0+, macOS 11.0+, Swift 5.3].

swiftui-2048 If you like the project, please give it a star ⭐ It will show the creator your appreciation and help others to discover the repo. ✍️ Abou

174 Dec 17, 2022

A simple SwiftUI Application to demonstrate creation of UI using SwiftUI.

WatchShop_UI A simple SwiftUI Application to demonstrate creation of UI using SwiftUI. How to run the project ? Fork the project. Run the project usin

12 Apr 15, 2022

E-commerce app built in SwiftUI. Built in the course SwiftUI Masterclass in Udemy.

Touchdown-SwiftUI E-commerce app built in SwiftUI. Built in the course SwiftUI Masterclass in Udemy. Main components and concepts used: @EnvironmentOb

5 Aug 18, 2022

A multiplatform SwiftUI project demonstrating various SwiftUI features.

WikiDemo A multiplatform SwiftUI project demonstrating various SwiftUI features, including creating a master-detail interface. It's a multiplatform ve

6 Oct 17, 2022

SwiftUI Projects from Udemy SwiftUI Masterclass

SwiftUI Masterclass Repos: AsyncImage (N/A) Fructus (finished): an app for getting information about different fruits. Data comes from json files. Afr

1 Mar 3, 2022

Best architecture for SwiftUI + CombineBest architecture for SwiftUI + Combine

Best architecture for SwiftUI + Combine The content of the presentation: First of the proposed architectures - MVP + C Second of the proposed architec