[ad_1]
Final 12 months, iOS 15 got here with a really helpful characteristic referred to as Stay Textual content. You might have heard of the time period OCR (quick for Optical Character Recognition), which is the method for changing a picture of textual content right into a machine-readable textual content format. That is what Stay Textual content is about.
Stay Textual content is built-into the digicam app and Images app. For those who haven’t tried out this characteristic, merely open the Digicam app. Once you level the machine’s digicam at a picture of textual content, you will discover a Stay Textual content button on the lower-right nook. By tapping the button, iOS robotically captures the textual content for you. You possibly can then copy and paste it into different functions (e.g. Notes).
This can be a very highly effective and handy options for many customers. As a developer, wouldn’t it’s nice should you can incorporate this Stay Textual content characteristic in your personal app? In iOS 16, Apple launched the Stay Textual content API for builders to energy their apps with Stay Textual content. On this tutorial, let’s see how you can use the Stay Textual content API with SwiftUI.
Allow Stay Textual content Utilizing DataScannerViewController
Within the WWDC session about Capturing Machine-readable Codes and Textual content with VisionKit, Apple’s engineer confirmed the next diagram:

Textual content recognization is just not a brand new characteristic on iOS 16. On older model of iOS, you should use APIs from the AVFoundation and Imaginative and prescient framework to detect and acknowledge textual content. Nonetheless, the implementation is sort of difficult, particularly for many who are new to iOS improvement.
Within the subsequent launch of iOS, all of the above is simplified to a brand new class known as DataScannerViewController in VisionKit. By utilizing this view controller, your app can robotically show a digicam UI with the Stay Textual content functionality.
To make use of the category, you first import the VisionKit framework after which verify if the machine helps the information scanner characteristic:
|
DataScannerViewController.isSupported |
The Stay Textual content API solely helps gadgets launched in 2018 or newer with Neural engine. On prime of that, you additionally must verify the supply to see if the consumer approves the usage of knowledge scanner:
|
DataScannerViewController.isAvailable |
As soon as each checks come again with optimistic outcomes, you’re prepared to begin the scanning. Right here is the pattern code to launch a digicam with Stay Textual content:
current(dataScanner, animated: true) {
attempt? dataScanner.startScanning()
}
|
let dataScanner = DataScannerViewController(                     recognizedDataTypes: [.text()],                     qualityLevel: .balanced,                     isHighlightingEnabled: true                   )  current(dataScanner, animated: true) {     attempt? dataScanner.startScanning() } |
All you want is create an occasion of DataScannerViewController and specify the acknowledged knowledge varieties. For textual content recognition, you cross .textual content() as the information kind. As soon as the occasion is prepared, you may current it and begin the scanning course of by calling the startScanning() methodology.
Working with DataScannerViewController in SwiftUI
The DataScannerViewController class now solely helps UIKit. For SwiftUI, it wants a bit of labor. We now have to undertake the UIViewControllerRepresentable protocol to make use of the category in SwiftUI tasks. On this case, I create a brand new struct named DataScanner like this:
|
struct DataScanner: UIViewControllerRepresentable { Â Â . Â Â . Â Â . } |
This struct accepts two binding variables: one for triggering the information scanning and the opposite is a binding for storing the scanned textual content.
|
@Binding var startScanning: Bool @Binding var scanText: String |
To efficiently undertake the UIViewControllerRepresentable protocol, we have to implement the next strategies:
return controller
}
func updateUIViewController(_ uiViewController: DataScannerViewController, context: Context) {
if startScanning {
attempt? uiViewController.startScanning()
} else {
uiViewController.stopScanning()
}
}
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 |
func makeUIViewController(context: Context) –> DataScannerViewController {     let controller = DataScannerViewController(                         recognizedDataTypes: [.text()],                         qualityLevel: .balanced,                         isHighlightingEnabled: true                     )      return controller }  func updateUIViewController(_ uiViewController: DataScannerViewController, context: Context) {      if startScanning {         attempt? uiViewController.startScanning()     } else {         uiViewController.stopScanning()     } } |
Within the makeUIViewController methodology, we return an occasion of DataScannerViewController. For updateUIViewController, we begin (or cease) the scanning relying on the worth of startScanning.
To seize the scanned textual content, we’ve got to undertake the next methodology of DataScannerViewControllerDelegate:
|
func dataScanner(_ dataScanner: DataScannerViewController, didTapOn merchandise: RecognizedItem) { Â Â . Â Â . Â Â . } |
The tactic known as when the consumer faucets the detected textual content, so we’ll implement it like this:
init(_ dad or mum: DataScanner) {
self.dad or mum = dad or mum
}
func dataScanner(_ dataScanner: DataScannerViewController, didTapOn merchandise: RecognizedItem) {
swap merchandise {
case .textual content(let textual content):
dad or mum.scanText = textual content.transcript
default: break
}
}
}
func makeCoordinator() -> Coordinator {
Coordinator(self)
}
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 |
class Coordinator: NSObject, DataScannerViewControllerDelegate {     var dad or mum: DataScanner      init(_ dad or mum: DataScanner) {         self.dad or mum = dad or mum     }      func dataScanner(_ dataScanner: DataScannerViewController, didTapOn merchandise: RecognizedItem) {         swap merchandise {         case .textual content(let textual content):             dad or mum.scanText = textual content.transcript         default: break         }     }  }  func makeCoordinator() –> Coordinator {     Coordinator(self) } |
We verify the acknowledged merchandise and retailer the scanned textual content if any textual content is acknowledged. Lastly, insert this line of code within the makeUIViewController methodology to configure the delegate:
|
controller.delegate = context.coordinator |
This controller is now prepared to be used in SwiftUI views.
Capturing Textual content Utilizing DataScanner
For instance, we’ll construct a textual content scanner app with a quite simple consumer interface. When the app is launched, it robotically shows the digicam view for reside textual content. When textual content is detected, customers can faucet the textual content to seize it. The scanned textual content is displayed within the decrease a part of the display screen.

Assuming you’ve created a typical SwiftUI challenge, open ContentView.swift and the VisionKit framework.
Subsequent, declare a few state variables to regulate the operation of the information scanner and the scanned textual content.
|
@State non-public var startScanning = false @State non-public var scanText = “” |
For the physique half, let’s replace the code like this:
Textual content(scanText)
.body(minWidth: 0, maxWidth: .infinity, maxHeight: .infinity)
.background(in: Rectangle())
.backgroundStyle(Shade(uiColor: .systemGray6))
}
.process {
if DataScannerViewController.isSupported && DataScannerViewController.isAvailable {
startScanning.toggle()
}
}
|
VStack(spacing: 0) { Â Â Â Â DataScanner(startScanning: $startScanning, scanText: $scanText) Â Â Â Â Â Â Â Â .body(top: 400) Â Â Â Â Â Textual content(scanText) Â Â Â Â Â Â Â Â .body(minWidth: 0, maxWidth: .infinity, maxHeight: .infinity) Â Â Â Â Â Â Â Â .background(in: Rectangle()) Â Â Â Â Â Â Â Â .backgroundStyle(Shade(uiColor: .systemGray6)) Â } .process { Â Â Â Â if DataScannerViewController.isSupported && DataScannerViewController.isAvailable { Â Â Â Â Â Â Â Â startScanning.toggle() Â Â Â Â } } |
We begin the information scanner when the app launches. However earlier than that, we name DataScannerViewController.isSupported and DataScannerViewController.isAvailable to make sure Stay Textual content is supported on the machine.
The demo app is nearly prepared to check. Since Stay Textual content requires Digicam entry, please keep in mind to go to the challenge configuration. Add the important thing Privateness – Digicam Utilization Description within the Data.plist file and specify the rationale why your app must entry the machine’s digicam.

After the adjustments, you may deploy the app to an actual iOS machine and take a look at the Stay Textual content operate.
Aside from English, Stay Textual content additionally helps French, Italian, German, Spanish, Chinese language, Portuguese, Japanese, and Korean.

For the supply code of this demo challenge, you may test it out on GitHub.
Be aware: We’re updating our Mastering SwiftUI guide for iOS 16. If you wish to begin studying SwiftUI, take a look at the guide right here. You’ll obtain a free replace later this 12 months.
[ad_2]
