如何创建只接受数字和单个点的SwiftUI TextField?

M.S*_*rag 1 textfield ios swiftui

如何创建一个swiftui文本字段,允许用户仅输入数字和单个点?换句话说,它在用户输入时逐位检查数字,如果输入是数字或点,并且文本字段没有其他点,则接受该数字,否则将忽略该数字条目。不能使用步进器。

sup*_*cio 7

SwiftUI不允许您为指定一组允许的字符TextField。实际上,这与UI本身无关,而与您如何管理背后的模型有关。在这种情况下,模型是后面的文字TextField。因此,您需要更改视图模型。

如果$@Published属性上使用标志,则可以访问属性本身Publisher后面的符号@Published。然后,您可以将自己的订阅者附加到发布者,并执行所需的任何检查。在这种情况下,我使用该sink函数将基于闭包的订阅者附加到发布者:

/// Attaches a subscriber with closure-based behavior.
///
/// This method creates the subscriber and immediately requests an unlimited number of values, prior to returning the subscriber.
/// - parameter receiveValue: The closure to execute on receipt of a value.
/// - Returns: A cancellable instance; used when you end assignment of the received value. Deallocation of the result will tear down the subscription stream.
public func sink(receiveValue: @escaping ((Self.Output) -> Void)) -> AnyCancellable
Run Code Online (Sandbox Code Playgroud)

实现:

import SwiftUI
import Combine

class ViewModel: ObservableObject {
    @Published var text = ""
    private var subCancellable: AnyCancellable!
    private var validCharSet = CharacterSet(charactersIn: "1234567890.")

    init() {
        subCancellable = $text.sink { val in
            //check if the new string contains any invalid characters
            if val.rangeOfCharacter(from: self.validCharSet.inverted) != nil {
                //clean the string (do this on the main thread to avoid overlapping with the current ContentView update cycle)
                DispatchQueue.main.async {
                    self.text = String(self.text.unicodeScalars.filter {
                        self.validCharSet.contains($0)
                    })
                }
            }
        }
    }

    deinit {
        subCancellable.cancel()
    }
}

struct ContentView: View {
    @ObservedObject var viewModel = ViewModel()

    var body: some View {
        TextField("Type something...", text: $viewModel.text)
    }
}
Run Code Online (Sandbox Code Playgroud)

重要说明:

  • $text$@Published属性上签名)为我们提供了一个类型的对象,Published<String>.Publisher即发布者
  • $viewModel.text$在上签名@ObservableObject)给我们一个类型的对象Binding<String>

那是两件事完全不同。

编辑:如果您愿意,甚至可以TextField使用此行为创建自己的自定义。假设您要创建一个DecimalTextField视图:

import SwiftUI
import Combine

struct DecimalTextField: View {
    private class DecimalTextFieldViewModel: ObservableObject {
        @Published var text = ""
        private var subCancellable: AnyCancellable!
        private var validCharSet = CharacterSet(charactersIn: "1234567890.")

        init() {
            subCancellable = $text.sink { val in                
                //check if the new string contains any invalid characters
                if val.rangeOfCharacter(from: self.validCharSet.inverted) != nil {
                    //clean the string (do this on the main thread to avoid overlapping with the current ContentView update cycle)
                    DispatchQueue.main.async {
                        self.text = String(self.text.unicodeScalars.filter {
                            self.validCharSet.contains($0)
                        })
                    }
                }
            }
        }

        deinit {
            subCancellable.cancel()
        }
    }

    @ObservedObject private var viewModel = DecimalTextFieldViewModel()

    var body: some View {
        TextField("Type something...", text: $viewModel.text)
    }
}

struct ContentView: View {
    var body: some View {
        DecimalTextField()
    }
}
Run Code Online (Sandbox Code Playgroud)

这样,您可以使用自定义文本字段编写:

DecimalTextField()
Run Code Online (Sandbox Code Playgroud)

您可以在任何地方使用它。

  • 如何在现有的应用程序中使用?即 DecimalTextField($myValue) ? (2认同)