{"id":15066889,"url":"https://github.com/hadiuzzaman524/swiftui-scrollable-tab-view","last_synced_at":"2026-02-10T18:35:24.998Z","repository":{"id":255725305,"uuid":"851748080","full_name":"hadiuzzaman524/swiftui-scrollable-tab-view","owner":"hadiuzzaman524","description":"ScrollableTabView is a SwiftUI component for creating a customizable, horizontally scrollable tab view. It offers adjustable styles for tab colors, corner radius, and spacing, and includes predefined components like WithText and WithTextAndIcon for easy tab content setup.","archived":false,"fork":false,"pushed_at":"2024-11-05T15:03:11.000Z","size":21503,"stargazers_count":2,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-08-20T21:40:52.841Z","etag":null,"topics":["ios","scrollable-tab-view","scrollableview","swift","swiftui","tabview-swiftui"],"latest_commit_sha":null,"homepage":"","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/hadiuzzaman524.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE.txt","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2024-09-03T16:34:40.000Z","updated_at":"2025-05-15T05:45:48.000Z","dependencies_parsed_at":null,"dependency_job_id":"e1503b73-1550-44dc-aaa5-9f3baabd4c06","html_url":"https://github.com/hadiuzzaman524/swiftui-scrollable-tab-view","commit_stats":null,"previous_names":["hadiuzzaman524/swiftui-scrollable-tab-view"],"tags_count":1,"template":false,"template_full_name":null,"purl":"pkg:github/hadiuzzaman524/swiftui-scrollable-tab-view","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/hadiuzzaman524%2Fswiftui-scrollable-tab-view","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/hadiuzzaman524%2Fswiftui-scrollable-tab-view/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/hadiuzzaman524%2Fswiftui-scrollable-tab-view/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/hadiuzzaman524%2Fswiftui-scrollable-tab-view/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/hadiuzzaman524","download_url":"https://codeload.github.com/hadiuzzaman524/swiftui-scrollable-tab-view/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/hadiuzzaman524%2Fswiftui-scrollable-tab-view/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":29311331,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-02-10T17:48:59.043Z","status":"ssl_error","status_checked_at":"2026-02-10T17:45:37.240Z","response_time":65,"last_error":"SSL_connect returned=1 errno=0 peeraddr=140.82.121.5:443 state=error: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"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":["ios","scrollable-tab-view","scrollableview","swift","swiftui","tabview-swiftui"],"created_at":"2024-09-25T01:13:35.747Z","updated_at":"2026-02-10T18:35:24.963Z","avatar_url":"https://github.com/hadiuzzaman524.png","language":"Swift","funding_links":[],"categories":[],"sub_categories":[],"readme":"# ScrollableTabView\nScrollableTabView is a customizable, horizontally scrollable tab view built in SwiftUI. It allows you to display multiple tabs with smooth scrolling and animation. The tabs can be styled with different colors, backgrounds, and layouts. The package includes predefined tab item views like WithText and WithTextAndIcon, which make it easy to display text or text with an icon in your tabs.\n\n## Features\n- Horizontally scrollable tabs with customizable background and foreground colors.\n- Support for active/inactive tab states with separate styles.\n- Adjustable tab corner radius, spacing, and padding.\n- Easy-to-use TabItem initializer to define custom tab views.\n- Smooth transitions and animations between tabs.\n- Works with SwiftUI's TabView for content rendering.\n\n## Installation\n\nSwift Package Manager (SPM)\nTo install the ScrollableTabView using Swift Package Manager, follow these steps:\n\n1. Open your Xcode project.\n\n2. Go to File \u003e Add Packages.\n\n3. In the search bar, paste the following URL:\n\n```bash\nhttps://github.com/hadiuzzaman524/swiftui-scrollable-tab-view.git\n\n```\n4. Select the package and click Add Package to integrate it into your project.\n\n\nTo create a `ScrollableTabView`, initialize it with an array of TabItem instances that define the title and body for each tab.\n\n### Example 1: Simple Text Tabs\n```swift\nimport SwiftUI\nimport ScrollableTabView\n\nstruct ContentView: View {\n    var body: some View {\n        ScrollableTabView(\n            items: [\n                TabItem(title: WithText(text: \"Home\"), body: Text(\"Home Content\")),\n                TabItem(title: WithText(text: \"Profile\"), body: Text(\"Profile Content\")),\n                TabItem(title: WithText(text: \"Settings\"), body: Text(\"Settings Content\"))\n            ]\n        )\n    }\n}\n\n```\nEach tab's title is displayed using the WithText component.\nThe corresponding body is simple text content.\n\n### Example 2: Tabs with Icons\n\n```swift\nimport SwiftUI\nimport ScrollableTabView\n\nstruct ContentView: View {\n    var body: some View {\n        ScrollableTabView(\n            items: [\n                TabItem(title: WithTextAndIcon(text: \"Home\", systemName: \"house\"), body: Text(\"Home Content\")),\n                TabItem(title: WithTextAndIcon(text: \"Profile\", systemName: \"person.circle\"), body: Text(\"Profile Content\")),\n                TabItem(title: WithTextAndIcon(text: \"Settings\", systemName: \"gearshape\"), body: Text(\"Settings Content\"))\n            ]\n        )\n    }\n}\n\n```\n### Custom Styling\n`ScrollableTabView` allows you to fully customize the appearance of the tabs through several styling parameters. You can control the background color, foreground color, corner radius, and spacing for both active and inactive states of the tabs.\n\n#### Customizing Background and Foreground Colors\nYou can change the background and text (foreground) colors of the active and inactive tabs using the following parameters:\n\n- `activeBgColor`: The background color of the active tab.\n- `inactiveBgColor`: The background color of inactive tabs.\n- `activeColor`: The text (foreground) color of the active tab.\n- `inActiveColor`: The text (foreground) color of inactive tabs.\n- `cornerRadius`: Controls the roundness of the tab corners.\n- `spaceBetween`: Defines the space between each tab in the scroll view.\n- `leadingSpace` and `trailingSpace`: Set custom padding before the first tab and after the last tab, respectively.\n\n### Complete Example\n\n```swift\nimport SwiftUI\nimport ScrollableTabView\n\nstruct ContentView: View {\n    var body: some View {\n        ScrollableTabView(\n            activeBgColor: Color.green,\n            inactiveBgColor: Color.orange,\n            activeColor: Color.white,\n            inActiveColor: Color.black,\n            cornerRadius: 16,\n            spaceBetween: 10,\n            leadingSpace: 20,\n            trailingSpace: 20,\n            items: [\n                TabItem(title: WithTextAndIcon(text: \"Home\", systemName: \"house\"), body: Text(\"Home Content\")),\n                TabItem(title: WithTextAndIcon(text: \"Search\", systemName: \"magnifyingglass\"), body: Text(\"Search Content\")),\n                TabItem(title: WithTextAndIcon(text: \"Settings\", systemName: \"gearshape\"), body: Text(\"Settings Content\"))\n            ]\n        )\n    }\n}\n\n\n```\n\n## Parameters\n\n| Parameter        | Type       | Default               | Description                                                      |\n|------------------|------------|-----------------------|------------------------------------------------------------------|\n| `activeBgColor`  | `Color`    | `Color.accentColor`   | The background color for the active tab.                         |\n| `inactiveBgColor`| `Color`    | `Color.gray`          | The background color for inactive tabs.                          |\n| `activeColor`    | `Color`    | `Color.primary`       | The text/icon color for the active tab.                          |\n| `inActiveColor`  | `Color`    | `Color.secondary`     | The text/icon color for inactive tabs.                           |\n| `cornerRadius`   | `CGFloat`  | `12`                  | The corner radius applied to the tabs.                           |\n| `spaceBetween`   | `CGFloat`  | `12`                  | The space between each tab in the scroll view.                   |\n| `leadingSpace`   | `CGFloat`  | `0`                   | The space before the first tab.                                  |\n| `trailingSpace`  | `CGFloat`  | `0`                   | The space after the last tab.                                    |\n| `items`          | `[TabItem]`| **Required**          | An array of `TabItem` objects representing each tab.             |\n\n## Predefined TabItem Components\n\n`WithText`\nDisplays text as the tab title.\n```swift\nWithText(text: \"Tab Title\", cornerRadius: 12)\n\n```\n`WithTextAndIcon`\nDisplays both text and an SF Symbol icon as the tab title.\n\n```swift\nWithTextAndIcon(text: \"Tab Title\", systemName: \"icon.name\", cornerRadius: 12)\n\n```\n\n## License\nThis package is available under the MIT license.","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fhadiuzzaman524%2Fswiftui-scrollable-tab-view","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fhadiuzzaman524%2Fswiftui-scrollable-tab-view","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fhadiuzzaman524%2Fswiftui-scrollable-tab-view/lists"}