A SwiftUI implementation of a picker that also allows direct input.

Overview

ComboPicker

ComboPicker is a SwiftUI view that allows users to input a value by selecting from a predefined set or by typing a custom one.

ComboPicker

Installation

ComboPicker is available through Swift Package Manager.

.package(url: "https://github.com/MrAsterisco/ComboPicker", from: "<see GitHub releases>")

Latest Release

To find out the latest version, look at the Releases tab of this repository.

Usage

ComboPicker can display any type that conforms to the ComboPickerModel protocol. The following example shows a model that wraps a Int:

public struct ExampleModel: ComboPickerModel {
  public static func ==(lhs: ExampleModel, rhs: ExampleModel) -> Bool {
    lhs.value == rhs.value
  }

  public let id = UUID()
  public let value: Int
  
  // Default initializer.
  public init(value: Int) {
    self.value = value
  }
  
  // Initializer to convert user input into a value.
  public init?(customValue: String) {
    guard let doubleValue = NumberFormatter().number(from: customValue)?.intValue else { return nil }
    self.init(value: doubleValue)
  }
  
  // Convert the value to prefill the manual input field.
  public var valueForManualInput: String? {
    NumberFormatter().string(from: .init(value: value))
  }
}

You also have to provide an implementation of ValueFormatterType, so that the ComboPicker knows how to represent values in the Pickers. The following example illustrates a simple formatter for the model implemented above:

final class ExampleModelFormatter: ValueFormatterType {
  func string(from value: ExampleModel) -> String {
    "# \(NumberFormatter().string(from: .init(value: value.value)) ?? "")"
  }
}

Once you have a collection of models and the formatter implementation, building a ComboPicker is easy:

@State private var content: [ExampleModel]
@State private var selection: ExampleModel

ComboPicker(
  title: "Pick a number",
  manualTitle: "Custom...",
  valueFormatter: ExampleModelFormatter(),
  content: $content,
  value: $selection
)

Platform Behaviors

ComboPicker adapts to the platform to provide an easy and accessible experience regardless of the device.

iOS & iPadOS

On iOS and iPadOS, the ComboPicker shows a one-line UIPickerView that the user can scroll. If the user taps on it, a text field for manual input appears.

ComboPicker

If necessary, you can customize the keyboard type for the manual input field:

.keyboardType(.numberPad)

Note: because of limitations of the SwiftUI Picker regarding the gestures handling, as well as the ability of showing and using multiple wheel pickers in the same screen, ComboPicker is currently relying on a UIViewRepresentable implementation of a UIPickerView. You can read more about the current limitations here.

watchOS

On watchOS, the ComboPickershows a normal Picker that the user can scroll using their fingers or the digital crown. If the user taps on it, a text field for manual input appears.

ComboPicker

There is no support for specifying the keyboard type, at the moment, as Apple doesn't provide a way to do so on watchOS.

macOS

On macOS, the ComboPicker becomes an NSComboBox. Users will be able to select options or type custom ones directly into the component.

See the Apple docs for further information on how combo boxes work.

tvOS

On tvOS, the ComboPicker shows a Picker followed by a TextField. The user can move on the picker or scroll down to the text field and input a custom value.

ComboPicker

If necessary, you can customize the keyboard type for the manual input field:

.keyboardType(.numberPad)

Compatibility

ComboPicker requires iOS 15.0 or later, macOS 12.0 or later, watchOS 8.0 or later and tvOS 15.0 or later.

Contributions

All contributions to expand the library are welcome. Fork the repo, make the changes you want, and open a Pull Request.

If you make changes to the codebase, I am not enforcing a coding style, but I may ask you to make changes based on how the rest of the library is made.

Status

This library is under active development. Even if most of the APIs are pretty straightforward, they may change in the future; but you don't have to worry about that, because releases will follow Semantic Versioning 2.0.0.

License

ComboPicker is distributed under the MIT license. See LICENSE for details.

Comments
  • Add font customization, fix manual input

    Add font customization, fix manual input

    Overview

    This PR adds the ability to provide a custom font on iOS and iPadOS, as well as fixing the manual input not adding values on macOS and tvOS.

    References

    • Closes #7
    • Closes #5
    opened by MrAsterisco 0
  • Manual Input doesn't add values on tvOS and macOS

    Manual Input doesn't add values on tvOS and macOS

    Overview

    When inserting a new value via manual input, it should be added to the list of existing values. This isn't working properly on macOS and tvOS.

    bug 
    opened by MrAsterisco 0
  • Fix ComboPicker in List

    Fix ComboPicker in List

    Overview

    This PR introduces changes to the NativePicker so that it calculates its size correctly. It also fixes a crash caused by ManualInput not being able to resign when displayed in a List.

    The example app has also been updated to include a List.

    References

    • Closes #4
    opened by MrAsterisco 0
  • Allow customizing font for picker

    Allow customizing font for picker

    Overview

    On iOS and iPadOS, it should be possible to customize the font of items displayed in the picker. The same font should also be applied to the manual input field, for consistency.

    Proposed Solution

    We could make use of this delegate method, instead of the limited one we're using in NativePicker.Coordinator right now.

    enhancement 
    opened by MrAsterisco 0
  • Layout issues in List

    Layout issues in List

    Overview

    There are some layout issues when embedding the picker in a list, possibly because of the additional space that the picker would like to take.

    Screenshot 2022-07-03 at 16 47 30

    Proposed Solution

    Investigate how to override the intrinsicContentSize of the NativePicker, so that AutoLayout knows what size the picker should have.

    bug 
    opened by MrAsterisco 0
  • Fix multiple pickers on iOS, add value formatter

    Fix multiple pickers on iOS, add value formatter

    Overview

    This PR implements a UIViewRepresentable to support multiple pickers on iOS and iPadOS, as well as adding support for custom value formatters.

    References

    • Closes #1
    • Closes #2
    opened by MrAsterisco 0
  • Support more complicated value formatters

    Support more complicated value formatters

    Overview

    Currently, the only way to format values displayed in the picker is by overriding the label property of the ComboPickerModel implementation. This doesn't allow further customization, such as using additional context when formatting.

    Proposed Solution

    Add a new property that allows clients to inject a value formatter. This formatter is a generic protocol that must accept values of the ComboPickerModel implementation and return strings.

    This won't be applied to macOS, where the LosslessStringConvertible must be used instead.

    enhancement 
    opened by MrAsterisco 0
  • Multiple ComboPicker in the same view conflict with each other

    Multiple ComboPicker in the same view conflict with each other

    Overview

    Because of a limitation on how the Picker works in SwiftUI, when displaying two (or more) ComboPicker in the same view, only one of them will work correctly. The last added will intercept all tap and scroll events and will prevent the other pickers from being used.

    This is only a problem on iOS and iPadOS.

    Proposed Solution

    This could be fixed by rolling-out our own picker implementation, instead of relying on the system one. This would also have the benefit of allowing custom sizes (instead of forcing the picker to be as wide as its container).

    bug 
    opened by MrAsterisco 0
Releases(v2.1.0)
  • v2.1.0(Jul 6, 2022)

    New Features

    • #5 : It is now possible to customise the picker font on iOS and iPadOS.

    Fixes

    • #4 : the picker now computes its intrinsic size correctly on iOS and iPadOS.
    • #7 : adding values via manual input is now working correctly on macOS and tvOS.

    Full Changelog: https://github.com/MrAsterisco/ComboPicker/compare/v2.0.0...v2.1.0

    Source code(tar.gz)
    Source code(zip)
  • v2.0.0(Jul 3, 2022)

    New Features

    #2: it is now possible to format values with an external formatter that is injected into the ComboPicker.

    Bugs Fixed

    #1: iOS and iPadOS now use the native UIPickerView, instead of the SwiftUI Picker, as it allows for multiple pickers to exist on the same screen.


    Full Changelog: https://github.com/MrAsterisco/ComboPicker/compare/v1.0.0...v2.0.0

    Source code(tar.gz)
    Source code(zip)
  • v1.0.0(Jul 2, 2022)

Owner
Alessio Moiso
Developer since childhood. Always interested in new languages, technologies and operating systems.
Alessio Moiso
A better SwiftUI Picker Use _Picker instead of Picker

BetterPicker A better SwiftUI Picker. Use _Picker instead of Picker. Create styles with _PickerStyle. The is a WIP This library is currently a work-in

Eric Lewis 17 Dec 14, 2022
Multi-picker for iOS and Mac available in SwiftUI

Multi-picker for iOS and Mac available in Swift UI

1amageek 5 Jul 12, 2022
iOS/macOS media picker for importing images and videos in SwiftUI

iOS/macOS media picker for importing images and videos in SwiftUI.

Mobile Development Club 13 Dec 30, 2022
FYPhoto is a photo/video picker and image browser library for iOS written in pure Swift. It is feature-rich and highly customizable to match your App's requirements.

FYPhoto is a photo/video picker and image browser library for iOS written in pure Swift. It is feature-rich and highly customizable to match your App's requirements.

null 10 Dec 11, 2022
Date picker dialog for iOS

DatePickerDialog 4.0 - iOS - Swift DatePickerDialog is an iOS drop-in classe that displays an UIDatePicker within an UIAlertView. Requirements DatePic

Squimer 535 Dec 17, 2022
a picker view shown as a popup for iOS in Objective-C

CZPicker Demo Change Log 3 most recent changes are listed here. Full change logs v0.4.3 - 2016-08-12 Added - (void)czpickerViewWillDisplay:(CZPickerVi

Chen Zeyu 527 Oct 2, 2022
🎯 Swift country and phone code Picker

CountryPicker Picker code Swift 3 / 4 / 5. Example To run the example project, clone the repo, and run pod install from the Example directory first. U

null 207 Dec 22, 2022
An iOS picker view to serve all your "picking" needs

Mandoline The PickerView is a UICollectionView that provides a smooth "picking" interface. In order to get the most out of it, a consuming view contro

Blue Apron 883 Nov 28, 2022
Elegant and Easy-to-Use iOS Swift Date Picker

D2PDatePicker Example To run the example project, clone the repo, and run pod install from the Example directory first. Example Code: Programmatical I

Pradheep Rajendirane 292 Nov 6, 2022
A country picker view controller for iOS

Planet A country picker view controller for iOS. Installation CocoaPods You can use CocoaPods to install Planet by adding it to your Podfile: platform

kWallet 71 Jul 11, 2022
MICountryPicker is a country picker controller for iOS8+ with an option to search.

MICountryPicker MICountryPicker is a country picker controller for iOS8+ with an option to search. The list of countries is based on the ISO 3166 coun

Mustafa Ibrahim 90 Mar 27, 2021
A drop in single image picker.

PHSingleImagePicker A low memory, single image picker wrapper that provide a significant smaller file size while also preserve high image quality. Int

Phanith NY 0 Nov 6, 2021
A simple yet customizable horizontal and vertical picker view

WheelPicker A simple yet customizable horizontal and vertical picker view Features Vertical or Horizontal picker Image or Text data Configure UILabel

Mind Studios 74 Sep 26, 2022
React-native-place-picker: Pick any place with single click 🚀

React-native-place-picker: Pick any place with single click ??

b0iq 59 Dec 29, 2022
LocationPicker - A ready for use and fully customizable location picker for your app

LocationPicker A ready for use and fully customizable location picker for your app. Features Installation Cocoapods Carthage Swift Package Manager Qui

Zhuoran 397 Nov 16, 2022
🤯 PickEmoji: A SwiftUI Extension to Pick the Emojis that you wish

?? PickEmoji: A SwiftUI Extension to Pick the Emojis that you wish You can use this library in your projects ?? . You can search the emojis too. Below

Mohammad Yasir 10 Sep 26, 2022
An alternative to Core Data for people who like having direct SQL access.

FCModel 2 An alternative to Core Data for people who like having direct SQL access. By Marco Arment. See the LICENSE file for license info (it's the M

null 1.7k Dec 28, 2022
Easy direct access to your database 🎯

OHMySQL ★★ Every star is appreciated! ★★ The library supports Objective-C and Swift, iOS and macOS. You can connect to your remote MySQL database usin

Oleg 210 Dec 28, 2022
Input Mask is an Android & iOS native library allowing to format user input on the fly.

Migration Guide: v.6 This update brings breaking changes. Namely, the autocomplete flag is now a part of the CaretGravity enum, thus the Mask::apply c

red_mad_robot 548 Dec 20, 2022