{"id":13405989,"url":"https://github.com/chicio/TabBarUIAction","last_synced_at":"2025-03-14T10:32:15.901Z","repository":{"id":56923586,"uuid":"352325851","full_name":"chicio/TabBarUIAction","owner":"chicio","description":"📚📱 A SwiftUI custom TabBar view with action button for modal content display. Fully compatible with Mac Catalyst.  📚📱","archived":false,"fork":false,"pushed_at":"2021-04-01T16:00:31.000Z","size":30119,"stargazers_count":24,"open_issues_count":0,"forks_count":5,"subscribers_count":2,"default_branch":"main","last_synced_at":"2024-09-26T15:03:55.492Z","etag":null,"topics":["apple","catalyst","ios","ipados","library","maccatalyst","macos","swift","swift-package-manager","swiftpackagemanager","swiftui","tabbar","tabbaritem","tabbarview","tabview"],"latest_commit_sha":null,"homepage":"https://tabbaruiaction.fabrizioduroni.it","language":"Swift","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/chicio.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE.md","code_of_conduct":"CODE_OF_CONDUCT.md","threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2021-03-28T12:40:00.000Z","updated_at":"2024-05-27T21:46:28.000Z","dependencies_parsed_at":"2022-08-20T22:50:22.007Z","dependency_job_id":null,"html_url":"https://github.com/chicio/TabBarUIAction","commit_stats":null,"previous_names":[],"tags_count":1,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/chicio%2FTabBarUIAction","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/chicio%2FTabBarUIAction/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/chicio%2FTabBarUIAction/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/chicio%2FTabBarUIAction/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/chicio","download_url":"https://codeload.github.com/chicio/TabBarUIAction/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":243562166,"owners_count":20311232,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["apple","catalyst","ios","ipados","library","maccatalyst","macos","swift","swift-package-manager","swiftpackagemanager","swiftui","tabbar","tabbaritem","tabbarview","tabview"],"created_at":"2024-07-30T19:02:17.890Z","updated_at":"2025-03-14T10:32:15.893Z","avatar_url":"https://github.com/chicio.png","language":"Swift","funding_links":[],"categories":["Swift"],"sub_categories":[],"readme":"# TabBarUIAction\n\n![SwiftLint](https://github.com/chicio/TabBarUIAction/workflows/SwiftLint/badge.svg)\n[![codecov](https://codecov.io/gh/chicio/TabBarUIAction/branch/main/graph/badge.svg?token=c8kYDnOOhu)](https://codecov.io/gh/chicio/TabBarUIAction)\n[![Supported platform](https://img.shields.io/badge/platform-macOS%20%7C%20iOS%20%7C%20iPadOS-orange.svg)](https%3A%2F%2Fimg.shields.io%2Fbadge%2Fplatform-macOS%20%7C%20iOS%20%7C%20iPadOS-orange.svg)\n[![CocoaPods Version](https://img.shields.io/cocoapods/v/TabBarUIAction.svg)](https://cocoapods.org/pods/TabBarUIAction)\n[![codebeat badge](https://codebeat.co/badges/5b39bd5d-32fc-45a9-987c-d38abe4c97f5)](https://codebeat.co/projects/github-com-chicio-tabbaruiaction-main)\n[![GitHub license](https://img.shields.io/badge/license-MIT-blue.svg)](https://raw.githubusercontent.com/chicio/TabBarUIAction/master/LICENSE.md)\n \n📚📱 A SwiftUI custom TabBar view with action button for modal content display. Fully compatible with Mac Catalyst. 📚📱\n\n![tabbaruiaction logo](https://github.com/chicio/TabBarUIAction/blob/main/Screenshots/logo-github.png?raw=true)\n\n***\n\n### Installation\n\nThere are four ways to install `TabBarUIAction` in your project: manual installation, as a standalone framework, cocoapods or the Swift Package Manager.\n\n**Manual installation**\n\nTo manually install `TabBarUIAction` simply drag and drop all the file contained in the [Source](https://github.com/chicio/TabBarUIAction/tree/master/Source) folder inside your project.\n\n**Framework**\n\n`TabBarUIAction` is available also as a framework. To install it follow the standard installation procedure for a cocoa touch framework:\n\n- drag the TabBarUIAction.xcodeproj inside your project \n- add it to the Embedded Binaries/Linked Frameworks and Libraries section of your project. \n\nSee the `TabBarUIAction` demo project/target for an example of the setup of the framework.\n\n**CocoaPods**\n\n`TabBarUIAction` is also available as a pod on \u003ca href=\"https://cocoapods.org/pods/TabBarUIAction\"\u003eCocoaPods\u003c/a\u003e.\nAdd the dependency to your Podfile similar to the following:\n\n```\ntarget 'MyApp' do\n    pod 'TabBarUIAction', '~\u003e 0.8'\nend\n```\n\nand then run pod install (or pod update).\n\n**Swift Package Manager (SPM)**\n\n`TabBarUIAction` is also available as a SPM package. Add it from the project configuration using the Github repository url. Choose main branch or a tag. \nSee the [DemoSPM](https://github.com/chicio/TabBarUIAction/tree/main/DemoSPM) project for an example of the setup with the Swiftp Package Manager.\n\n![spm](https://raw.githubusercontent.com/chicio/TabBarUIAction/master/Screenshots/spm.png)\n\n***\n\n### Usage\n\nTo use `TabBarUIAction` in your app you have to:\n\n* import `TabBarUIAction` in your SwiftUI view\n* define two `@State` variables:\n   * a `currentTab` state variable of type `TabPosition`\n   * a `showModal` state variable of type `Bool`\n* configure it with colors and screens content\n\nBelow you can find two examples of tab bar:\n* one with 3 screens: 2 standard tabs screen and a modal.\n* one with 5 screens: 4 standard tabs screen and a modal.\n\n```swift\nimport SwiftUI\nimport TabBarUIAction\n\nstruct YourView: View {\n    @State private var currentTab: TabPosition = .tab1\n    @State private var showModal: Bool = false\n    //... other state of your views\n\n    var body: some View {\n        VStack {\n            TabBarUIAction(\n                currentTab: $currentTab,\n                showModal: $showModal,\n                colors: Colors(\n                    tabBarBackgroundColor: Color(.white),\n                    tabItemsColors: TabItemsColors(\n                        tabItemColor: Color(.black),\n                        tabItemSelectionColor: Color(.blue)\n                    )\n                )\n            ) {\n                TabScreen(\n                    tabItem: TabItemContent(\n                        systemImageName: \"folder.badge.plus\",\n                        text: \"Tab Item 1\",\n                        font: Font.system(size: 16)\n                    )\n                ) {\n                    /**\n                        Your first tab screen. Could be any SwiftUI view.\n                        For example...\n                    */\n                    VStack {\n                        ///...other content\n                    }\n                }\n                TabModal {\n                    /**\n                        Define an element to be used as tab bar modal item.\n                        Here you can find an exampl: an image used as button.\n                     */   \n                    Image(systemName: \"plus.circle.fill\")\n                        .resizable()\n                        .aspectRatio(contentMode: .fit)\n                        .frame(width: 55, height: 55, alignment: .center)\n                        .foregroundColor(Color(.systemBlue))\n                        .background(Color(.white))\n                        .cornerRadius(55/2)\n                        .overlay(RoundedRectangle(cornerRadius: 55/2).stroke(Color(.blue), lineWidth: 2))\n                        .accessibility(identifier: \"TabBarModalButton\")\n                } content: {\n                    /**\n                        Your modal screen. Could be any SwiftUI view.\n                        For example...\n                    */\n                    VStack {\n                        ///...other content\n                    }\n                }\n                TabScreen(\n                    tabItem: TabItemContent(systemImageName: \"gear\", text: \"Tab Item 2\", font: Font.system(size: 16))\n                ) {\n                    /**\n                        Your second tab screen. Could be any SwiftUI view.\n                        For example...\n                    */\n                    VStack {\n                        ///...other content\n                    }\n                }\n            }\n        }\n    }\n}\n```\n```swift\nimport SwiftUI\nimport TabBarUIAction\n\nstruct YourView: View {\n    @State private var currentTab: TabPosition = .tab1\n    @State private var showModal: Bool = false\n\n    var body: some View {\n        VStack {\n            TabBarUIAction(\n                currentTab: $currentTab,\n                showModal: $showModal,\n                colors: Colors(\n                    tabBarBackgroundColor: Color(.systemGray5),\n                    tabItemsColors: TabItemsColors(\n                        tabItemColor: Color(.systemPurple),\n                        tabItemSelectionColor: Color(.systemIndigo)\n                    )\n                )\n            ) {\n                TabScreen(\n                    tabItem: TabItemContent(\n                        systemImageName: \"tray.fill\",\n                        text: \"Tab Item 1\",\n                        font: Font.system(size: 12)\n                    )\n                ) { \n                    /**\n                        Your first tab screen. Could be any SwiftUI view.\n                        For example...\n                    */\n                    VStack {\n                        ///...other content\n                    }\n                }\n                TabScreen(\n                    tabItem: TabItemContent(\n                        systemImageName: \"gamecontroller.fill\",\n                        text: \"Tab Item 2\",\n                        font: Font.system(size: 12)\n                    )\n                ) { \n                    /**\n                        Your first tab screen. Could be any SwiftUI view.\n                        For example...\n                    */\n                    VStack {\n                        ///...other content\n                    }\n                }\n                TabModal {\n                    /**\n                        Define an element to be used as tab bar modal item.\n                        Here you can find an exampl: an image used as button.\n                     */   \n                    Image(systemName: \"plus\")\n                        .resizable()\n                        .aspectRatio(contentMode: .fit)\n                        .frame(width: 30, height: 30, alignment: .center)\n                        .foregroundColor(Color(.white))\n                        .padding(10)\n                        .background(Color(.systemRed))\n                        .cornerRadius(10)\n                        .overlay(RoundedRectangle(cornerRadius: 10).stroke(Color(.systemRed), lineWidth: 2))\n                        .accessibility(identifier: \"TabBarModalButton\")\n                } content: {\n                    /**\n                        Your modal screen. Could be any SwiftUI view.\n                        For example...\n                    */\n                    VStack {\n                        ///...other content\n                    }\n                }\n                TabScreen(\n                    tabItem: TabItemContent(\n                        systemImageName: \"dpad.fill\",\n                        text: \"Tab Item 3\",\n                        font: Font.system(size: 12)\n                    )\n                ) { \n                    /**\n                        Your first tab screen. Could be any SwiftUI view.\n                        For example...\n                    */\n                    VStack {\n                        ///...other content\n                    }\n                }\n                TabScreen(\n                    tabItem: TabItemContent(\n                        systemImageName: \"l1.rectangle.roundedbottom.fill\",\n                        text: \"Tab Item 4\",\n                        font: Font.system(size: 12)\n                    )\n                ) { \n                    /**\n                        Your first tab screen. Could be any SwiftUI view.\n                        For example...\n                    */\n                    VStack {\n                        ///...other content\n                    }\n                }\n            }\n        }\n    }\n}\n```\n\n***\n\n### Documentation\n\nYou can find the complete api documentation on [fabrizioduroni.it](https://tabbaruiaction.fabrizioduroni.it \"TabBarUIAction doc\").\n\n***\n\n### Examples\n\nIn the following screenshots you can find some TabBarUIAction usage examples. You can find these examples in the [demo catalyst app project](https://github.com/chicio/TabBarUIAction/tree/master/TabBarUIActionDemo).\n\n![iphone screens](https://github.com/chicio/TabBarUIAction/blob/main/Screenshots/iphones-screens.png?raw=true)\n![ipad screens](https://github.com/chicio/TabBarUIAction/blob/main/Screenshots/ipad-screen.png?raw=true)\n![macos screens](https://github.com/chicio/TabBarUIAction/blob/main/Screenshots/macos-screen.png?raw=true)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fchicio%2FTabBarUIAction","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fchicio%2FTabBarUIAction","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fchicio%2FTabBarUIAction/lists"}