{"id":2749,"url":"https://github.com/yonat/MultiSelectSegmentedControl","last_synced_at":"2025-08-06T15:30:33.076Z","repository":{"id":8144734,"uuid":"9563979","full_name":"yonat/MultiSelectSegmentedControl","owner":"yonat","description":"UISegmentedControl remake that supports selecting multiple segments, vertical stacking, combining text and images.","archived":false,"fork":false,"pushed_at":"2024-11-01T14:11:53.000Z","size":371,"stargazers_count":300,"open_issues_count":1,"forks_count":60,"subscribers_count":12,"default_branch":"master","last_synced_at":"2024-11-28T17:17:16.421Z","etag":null,"topics":["selected-segments","selection","uisegmentedcontrol"],"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/yonat.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":".github/FUNDING.yml","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},"funding":{"github":["yonat"]}},"created_at":"2013-04-20T12:48:41.000Z","updated_at":"2024-11-01T14:11:55.000Z","dependencies_parsed_at":"2022-08-18T22:11:43.532Z","dependency_job_id":"650375e8-a09b-4f8f-9be6-89cd72b22425","html_url":"https://github.com/yonat/MultiSelectSegmentedControl","commit_stats":{"total_commits":100,"total_committers":9,"mean_commits":11.11111111111111,"dds":0.24,"last_synced_commit":"b7ca9865a18f39e0be623526750208f203824b1b"},"previous_names":[],"tags_count":26,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/yonat%2FMultiSelectSegmentedControl","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/yonat%2FMultiSelectSegmentedControl/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/yonat%2FMultiSelectSegmentedControl/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/yonat%2FMultiSelectSegmentedControl/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/yonat","download_url":"https://codeload.github.com/yonat/MultiSelectSegmentedControl/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":228915461,"owners_count":17991409,"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":["selected-segments","selection","uisegmentedcontrol"],"created_at":"2024-01-05T20:16:21.832Z","updated_at":"2025-08-06T15:30:33.053Z","avatar_url":"https://github.com/yonat.png","language":"Swift","readme":"\u003cimg src=\"Screenshots/MultiSelectSegmentedControl.png\"\u003e\n\n# MultiSelectSegmentedControl\n\n[![Swift Version][swift-image]][swift-url]\n[![Build Status][travis-image]][travis-url]\n[![License][license-image]][license-url]\n[![CocoaPods Compatible](https://img.shields.io/cocoapods/v/MultiSelectSegmentedControl.svg)](https://img.shields.io/cocoapods/v/MultiSelectSegmentedControl.svg)  \n[![Platform](https://img.shields.io/cocoapods/p/MultiSelectSegmentedControl.svg?style=flat)](http://cocoapods.org/pods/MultiSelectSegmentedControl)\n[![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg?style=flat-square)](http://makeapullrequest.com)\n\nUISegmentedControl remake that supports selecting multiple segments, vertical stacking, combining text and images.\n\n## Features\n\n- [x] Single or multiple selection.\n- [x] Horizontal or vertical stacking.\n- [x] Can show text and images together.\n- [x] Use from either storyboard or code.\n- [x] UIAppearance support.\n\n## Usage\n\nVery similar to `UISegmentedControl`, can be used as a drop-in replacement in most cases.\n\nIf you use Interface Builder, add a regular `UIView` and then set its class to `MultiSelectSegmentedControl`.\n\n### SwiftUI Usage\n\n```swift\nMultiSegmentPicker(\n    selectedSegmentIndexes: $indexSet,\n    items: [\"One\", \"Two\", image, [image2, \"Text\"], \"Last\"]\n)\n```\n\nThe properties mentioned below can be passed as arguments to the `MultiSegmentPicker` initializer, or used as view modifiers (e.g., `.borderWidth(3)`).\n\n### Creating Segments\n\nEach segment can contain an image, a text, or both:\n\n```swift\nlet multiSelect = MultiSelectSegmentedControl()\nmultiSelect.items = [\"One\", \"Two\", image, [image2, \"Text\"], \"Last\"]\n```\n\nImages are shown in full color (unlike `UISegmentedControl`). To make them render in the same `tintColor` as the control, use template mode:\n\n```swift\nmultiSelect.items = [image1, image2, image3].map { $0.withRenderingMode(.alwaysTemplate) }\n```\n\n### Selecting Segments\n\n```swift\nmultiSelect.selectedSegmentIndexes = [1, 2, 4]\n```\n\nOr just single selection:\n\n```swift\nmultiSelect.allowsMultipleSelection = false\nmultiSelect.selectedSegmentIndex = 3\n```\n\n### Getting Selected Segments\n\n```swift\nlet selectedIndices: IndexSet = multiSelect.selectedSegmentIndexes\n```\n\nOr to get the titles:\n\n```swift\nlet titles: [String] = multiSelect.selectedSegmentTitles\n```\n\n### Handling User Selection Changes\n\nYou can use standard target-action:\n\n```swift\nmultiSelect.addTarget(self, action: #selector(selectionChanged), for: .valueChanged)\n```\n\nOr conform to the delegate protocol:\n\n```swift\nextension MyViewController: MultiSelectSegmentedControlDelegate {\n    func multiSelect(_ multiSelectSegmentedControl: MultiSelectSegmentedControl, didChange value: Bool, at index: Int) {\n        print(\"selected \\(value) at \\(index)\")\n    }\n}\n```\n\n... and set the delegate:\n\n```swift\nmultiSelect.delegate = self\n```\n\n### Changing Appearance\n\nColor:\n\n```swift\nmultiSelect.tintColor = .green\n```\n\nBackground Color (optional - use if background color should be different from tint color):\n\n```swift\nmultiSelect.selectedBackgroundColor = .blue\n```\n\nShape:\n\n```swift\nmultiSelect.borderWidth = 3 // Width of the dividers between segments and the border around the view.\nmultiSelect.borderRadius = 32 // Corner radius of the view.\n```\n\nStack the segments vertically:\n\n```swift\nmultiSelect.isVertical = true\n```\n\nStack each segment contents vertically when it contains both image and text:\n\n```swift\nmultiSelect.isVerticalSegmentContents = true\n```\n\nText styling:\n\n```swift\nmultiSelect.setTitleTextAttributes([.foregroundColor: UIColor.yellow], for: .selected)\nmultiSelect.setTitleTextAttributes([.obliqueness: 0.25], for: .normal)\n```\n\nMore label styling:\n\n```swift\nmultiSelect.titleConfigurationHandler = {\n    $0.numberOfLines = 0\n    $0.lineBreakMode = .byWordWrapping\n}\n```\n\n## Installation\n\n### CocoaPods:\n\n```ruby\npod 'MultiSelectSegmentedControl'\n```\n\n### Swift Package Manager:\n\n```swift\ndependencies: [\n    .package(url: \"https://github.com/yonat/MultiSelectSegmentedControl\", from: \"2.4.2\")\n]\n```\n\n## TODO\n\n- [ ] foreground color of selected segment should be/appear transparent\n- [ ] configure segment `layoutMargins`, `stackView.spacing`\n\n\n## Meta\n\n[@yonatsharon](https://twitter.com/yonatsharon)\n\n[https://github.com/yonat/MultiSelectSegmentedControl](https://github.com/yonat/MultiSelectSegmentedControl)\n\n[swift-image]:https://img.shields.io/badge/swift-5.0-orange.svg\n[swift-url]: https://swift.org/\n[license-image]: https://img.shields.io/badge/License-MIT-blue.svg\n[license-url]: LICENSE.txt\n[travis-image]: https://img.shields.io/travis/dbader/node-datadog-metrics/master.svg?style=flat-square\n[travis-url]: https://travis-ci.org/dbader/node-datadog-metrics\n","funding_links":["https://github.com/sponsors/yonat"],"categories":["UI","Libs","UI [🔝](#readme)"],"sub_categories":["Segmented Control","UI","Other free courses"],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fyonat%2FMultiSelectSegmentedControl","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fyonat%2FMultiSelectSegmentedControl","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fyonat%2FMultiSelectSegmentedControl/lists"}