Извлечение текста из фрагментов изображений, снимков экрана и т. д.

WWDC22 содержит множество обновлений, позволяющих разработчикам создавать лучший пользовательский интерфейс. Теперь включить взаимодействие Live Text с изображениями стало проще, чем когда-либо прежде. С помощью всего нескольких строк кода вы можете помочь пользователям распознавать текст или машиночитаемый код внутри изображения, а пользователи могут легко копировать или делиться этими результатами.

В этой статье я поделюсь своим опытом встраивания функции Live Text в ваш проект SwiftUI. На следующем рисунке показан сегодняшний проект.

Создайте основной вид

Создайте новый проект Xcode, и сейчас мы сосредоточимся на файле ContentView.swift. Следующий код аналогичен коду, приведенному в моей предыдущей статье: API Live Text в iOS 16 — сканирование данных с помощью камеры в SwiftUI. Я полагаю, что у вас есть базовые знания о SwiftUI, если нет, ознакомьтесь с официальным документом Apple: Введение в SwiftUI.

Приведенный выше код создает представление, которое содержит только представление Button, его функция состоит в том, чтобы представить представление Live Text и позволить пользователям копировать или делать что-то еще с обнаруженными текстами или машиночитаемым кодом. Однако, по словам Apple, не все устройства поддерживают функцию Live Text:

Для приложений iOS Live Text доступен только на устройствах с процессором A12 Bionic и более поздних версий.

К счастью, Apple предоставляет нам новый API для проверки того, поддерживает ли устройство Live Text. Если устройство не поддерживает Live Text, при попытке нажать кнопку, чтобы представить представление Live Text, приложение выдаст предупреждение, которое показывает, что устройство не поддерживает Live Text.

Создание интерактивного текстового представления

Представление «Живой текст» содержит все функции, необходимые для выполнения действий с текстом и QR-кодами, отображаемыми на изображениях.

Создайте новый файл SwiftUI с именем LiveTextInteractionView.swift и добавьте в него следующий код:

Поскольку мы не создали наше представление «Живой текст», я поместил здесь текстовое представление.

Проверьте, поддерживает ли устройство Live Text

Прежде чем показывать интерфейс Live Text в своем приложении, проверьте, поддерживает ли устройство Live Text. Если свойство ImageAnalyzer isSupported равно true, показать интерфейс Live Text.

В коде ContentView добавьте следующее проверочное предложение внутри кода onAppear:

Это позволит вашему приложению проверять, поддерживает ли устройство Live Text, сразу после запуска приложения.

Добавьте объект взаимодействия Live Text в свое представление в iOS

Эта статья содержит только инструкции о том, как реализовать Live Text API внутри приложения для iOS или iPadOS, поэтому я не буду анализировать API в macOS.

Чтобы встроить UIView в представление SwiftUI, нам понадобится UIViewRepresentable.

Создайте новый файл Swift с именем LiveTextInteraction.swift и добавьте следующий код:

imageName здесь значение типа String, поэтому вам лучше подготовить изображение и добавить его в Assets. Я назвал это изображение 1.png .

imageView — это значение типа LiveTextImageView, унаследованное от UIImageView. LiveTextImageView используйте только для изменения размера изображения при встраивании UIImageView в представление SwiftUI.

Для приложений iOS вы добавляете интерфейс Live Text, добавляя объект взаимодействия в представление, содержащее изображение. Добавьте объект ImageAnalysisInteraction к взаимодействиям представления.

Найдите предметы и начните взаимодействие с изображением

ImageAnalyzer.Configuration используется для указания типов элементов изображения, которые мы хотим найти. В данном случае я имею в виду только элементы текстового типа. Инициализация объекта ImageAnalyzer.Configuration проста:

Поскольку мы хотим, чтобы наше приложение поддерживало Live Text и получало результаты обнаружения, как только будет представлено представление Live Text, нам нужно добавить приведенный выше код внутрь функции updateUIView. Более того, как указано в официальном документе Apple:

В листингах кода в этой статье используются асинхронные методы, которые вы вызываете из асинхронного метода или внутри структуры Task. Подробнее об асинхронных потоках см. в разделе Параллелизм.

Поэтому, прежде чем мы добавим код внутри функции updateUIView, нам нужно добавить ключевое слово Task.

Затем проанализируйте изображение, отправив analyze(_:configuration:) объекту ImageAnalyzer, передав изображение и конфигурацию. Чтобы повысить производительность, используйте один общий экземпляр анализатора во всем приложении.

Здесь мы проверяем, является ли изображение nil или нет. Если изображение существует, то мы обрабатываем изображение, используя analyzer. Analyzer — это объект ImageAnalyzer, который инициализируется в LiveTextInteraction:

let analyzer = ImageAnalyzer()

Для приложений iOS запустите интерфейс Live Text, задав для свойства analysis объекта ImageAnalysisInteraction результаты метода анализа. Например, установите свойство analysis в методе действия элемента управления, который запускает Live Text.

Теперь стандартное меню Live Text появляется, когда мы нажимаем и удерживаем элементы на изображении.

Настройте интерфейс, используя типы взаимодействия

Вы можете изменить поведение интерфейса, включив типы взаимодействия с элементами, найденными на изображении. Если вы установите для свойства preferredInteractionTypes взаимодействия или просмотра наложения значение automatic, пользователи смогут взаимодействовать со всеми типами элементов, которые анализатор находит на изображении. Здесь для текстовых элементов я меняю preferredInteractionTypes на textSelection.

Установив для свойства preferredInteractionTypes значение только textSelection, мы можем выделить текст на изображении, а затем выполнить базовое действие с текстом, например скопировать, перевести или поделиться текстом.

Теперь запустите этот проект и наслаждайтесь.

Исходный код

Вы можете найти исходный код на Github.

поддерживает меня

Если вы считаете, что эта статья полезна, вы можете поддержать меня, загрузив мое первое приложение для Mac под названием FilerApp в Mac App Store. FilerApp — это расширение Finder для вашего Mac, которое позволяет вам легко создавать файлы в поддерживаемых форматах в любом месте системы. Это бесплатно и полезно для многих людей. Надеюсь, вам понравится.