Эта страница переведена с помощью Cloud Translation API.

Обнаруживайте объекты на изображениях для визуального поиска товаров с помощью ML Kit: Android

1. Прежде чем начать

Вы видели демонстрацию Google Lens, где можно навести камеру телефона на объект и узнать, где его можно купить онлайн? Если вы хотите узнать, как добавить аналогичную функцию в свое приложение, то этот практический урок для вас. Он является частью учебного курса, который научит вас создавать функцию поиска по изображению товара в мобильном приложении.

В этом практическом занятии вы изучите первый шаг к созданию функции поиска товаров по изображениям: как обнаруживать объекты на изображениях и позволять пользователю выбирать объекты для поиска. Для создания этой функции вы будете использовать ML Kit Object Detection and Tracking .

Остальную информацию, включая создание бэкэнда для поиска товаров с помощью Vision API Product Search , вы можете найти в учебном пособии .

Что вы построите

В этом практическом задании вы создадите Android-приложение с использованием ML Kit. Ваше приложение будет использовать API обнаружения и отслеживания объектов ML Kit для обнаружения объектов на заданном изображении. Затем пользователь выберет объект, который он хочет найти в нашей базе данных товаров.
В итоге вы должны увидеть что-то похожее на изображение справа.

Что вы узнаете

Как интегрировать SDK ML Kit в ваше Android-приложение
API для обнаружения и отслеживания объектов ML Kit

Что вам понадобится

Последняя версия Android Studio (v4.1.2+)
Эмулятор Android Studio или физическое устройство Android.
Пример кода
Базовые знания разработки под Android на Kotlin.

Данная практическая работа посвящена ML Kit. Другие концепции и блоки кода не рассматриваются и предоставлены для простого копирования и вставки.

2. Настройка

Скачать код

Чтобы скачать весь код для этого практического занятия, перейдите по следующей ссылке:

Распакуйте загруженный zip-файл. В результате будет распакована корневая папка ( odml-pathways-main ) со всеми необходимыми ресурсами. Для этого практического занятия вам понадобятся только исходные файлы из подкаталога product-search/codelab1/android .

Подкаталог object-detection в репозитории mlkit-android содержит два каталога:

Стартовый код — исходный код, на основе которого вы будете строить дальнейшую работу в рамках этого практического занятия.
Завершенный код — код готового демонстрационного приложения.

3. Добавьте в проект API для обнаружения и отслеживания объектов из ML Kit.

Импортируйте приложение в Android Studio.

Для начала импортируйте стартовое приложение в Android Studio.

Зайдите в Android Studio, выберите «Импорт проекта» (Gradle, Eclipse ADT и т. д.) и выберите папку starter из исходного кода, который вы скачали ранее.

Добавьте зависимости для ML Kit Object Detection and Tracking.

Зависимости ML Kit позволяют интегрировать SDK ML Kit ODT в ваше приложение.

Перейдите к файлу app/build.gradle вашего проекта и убедитесь, что зависимость уже присутствует:

build.gradle

dependencies {
  // ...
  implementation 'com.google.mlkit:object-detection:16.2.4'
}

Синхронизируйте свой проект с файлами Gradle.

Чтобы убедиться, что все зависимости доступны вашему приложению, на этом этапе следует синхронизировать проект с файлами Gradle.

Выберите «Синхронизировать проект с файлами Gradle» ( ) с панели инструментов Android Studio.

(Если эта кнопка неактивна, убедитесь, что вы импортируете только файл starter/app/build.gradle, а не весь репозиторий.)

4. Запустите стартовое приложение.

Теперь, когда вы импортировали проект в Android Studio и добавили зависимости для ML Kit Object Detection and Tracking, вы готовы запустить приложение в первый раз.

Подключите ваше Android-устройство через USB к хосту или запустите эмулятор Android Studio и нажмите «Запустить» ( ) на панели инструментов Android Studio.

Запустите и изучите приложение.

Приложение должно запуститься на вашем устройстве Android. Оно содержит некоторый шаблонный код, позволяющий сделать снимок или выбрать предустановленное изображение и передать его в конвейер обнаружения и отслеживания объектов, который вы создадите в этом практическом занятии. Прежде чем писать код, немного изучите приложение:

Во-первых, есть кнопка ( ) внизу к

Запустите приложение камеры, встроенное в ваше устройство/эмулятор.
сделать снимок прямо в приложении камеры
получить захваченное изображение в стартовом приложении
отобразить изображение

Попробуйте кнопку « Сделать фото ». Следуйте инструкциям, чтобы сделать снимок, подтвердите его и посмотрите, как он отображается в стартовом приложении .

Во-вторых, есть 3 предустановленных изображения на выбор. Вы можете использовать эти изображения позже для тестирования кода обнаружения объектов, если запускаете приложение на эмуляторе Android.

Выберите изображение из 3 предустановленных вариантов.
Убедитесь, что изображение отображается в увеличенном виде.

5. Добавить функцию обнаружения объектов на устройстве.

На этом шаге вы добавите в стартовое приложение функциональность для обнаружения объектов на изображениях. Как вы видели на предыдущем шаге, стартовое приложение содержит шаблонный код для съемки фотографий с помощью приложения камеры на устройстве. В приложении также есть 3 предустановленных изображения, на которых вы можете попробовать обнаружение объектов, если запускаете практическое занятие на эмуляторе Android.

Когда вы выбираете изображение, будь то из предустановленных изображений или делая снимок с помощью приложения камеры, стандартный код декодирует это изображение в экземпляр Bitmap , отображает его на экране и вызывает метод runObjectDetection с этим изображением.

На этом шаге вы добавите код в метод runObjectDetection для обнаружения объектов!

Настройте и запустите функцию обнаружения объектов на изображении непосредственно на устройстве.

Для настройки ML Kit ODT достаточно всего 3 простых шагов и 3 API.

Подготовка изображения: InputImage
Создайте объект детектора: ObjectDetection.getClient(options)
Соедините два объекта выше: process(image)

Это достигается внутри функции ** runObjectDetection(bitmap: Bitmap) ** в файле MainActivity.kt .

/**
 * ML Kit Object Detection Function
 */
private fun runObjectDetection(bitmap: Bitmap) {
}

В данный момент функция пуста. Переходите к следующим шагам по интеграции ML Kit ODT! В процессе работы Android Studio предложит вам добавить необходимые импорты.

com.google.mlkit.vision.common.InputImage
com.google.mlkit.vision.objects.ObjectDetection
com.google.mlkit.vision.objects.defaults.ObjectDetectorOptions

Шаг 1: Создайте объект InputImage

ML Kit предоставляет простой API для создания InputImage из Bitmap . Затем вы можете передать InputImage в API ML Kit.

// Step 1: create ML Kit's InputImage object
val image = InputImage.fromBitmap(bitmap, 0)

Добавьте приведенный выше код в начало runObjectDetection(bitmap:Bitmap) .

Шаг 2: Создайте экземпляр детектора.

ML Kit использует шаблон проектирования Builder : вы передаете конфигурацию в Builder, а затем получаете от него детектор . Есть 3 варианта настройки (выделенный жирным шрифтом используется в Codelab):

Режим работы детектора ( одиночное изображение или поток )
Режим обнаружения (обнаружение одного или нескольких объектов )
Режим классификации ( включен или выключен )

Данная практическая работа посвящена обнаружению и классификации нескольких объектов на одном изображении. Давайте приступим:

// Step 2: acquire detector object
val options = ObjectDetectorOptions.Builder()
   .setDetectorMode(ObjectDetectorOptions.SINGLE_IMAGE_MODE)
   .enableMultipleObjects()
   .enableClassification()
   .build()
val objectDetector = ObjectDetection.getClient(options)

Шаг 3: Подайте изображение(я) на детектор.

Обнаружение и классификация объектов осуществляется асинхронным способом:

Вы отправляете изображение детектору (через process() ).
детектор довольно усердно на нем работает
Детектор отправляет вам результат через функцию обратного вызова.

Следующий код делает именно это ( скопируйте его и добавьте к существующему коду внутри функции fun runObjectDetection(bitmap:Bitmap)):

// Step 3: feed given image to detector and setup callback
objectDetector.process(image)
   .addOnSuccessListener {
       // Task completed successfully
        debugPrint(it)
   }
   .addOnFailureListener {
       // Task failed with an exception
       Log.e(TAG, it.message.toString())
   }

После завершения работы детектор сообщит вам следующее:

Общее количество обнаруженных объектов
Каждый обнаруженный объект описывается с помощью

trackingId : целое число, используемое для отслеживания объекта между кадрами (в данном практическом задании не используется).
boundingBox : ограничивающая рамка объекта
labels: список меток для обнаруженного объекта (только если включена классификация)
index (Получить индекс этой метки)
text (Получите текст этой метки, включая "Модные товары", "Продукты питания", "Товары для дома", "Место", "Растение")
confidence (число с плавающей запятой от 0,0 до 1,0, где 1,0 означает 100%)

Вы, вероятно, заметили, что код выводит обнаруженные результаты в Logcat с помощью debugPrint() . Добавьте его в класс MainActivity :

private fun debugPrint(detectedObjects: List<DetectedObject>) {
   detectedObjects.forEachIndexed { index, detectedObject ->
       val box = detectedObject.boundingBox

       Log.d(TAG, "Detected object: $index")
       Log.d(TAG, " trackingId: ${detectedObject.trackingId}")
       Log.d(TAG, " boundingBox: (${box.left}, ${box.top}) - (${box.right},${box.bottom})")
       detectedObject.labels.forEach {
           Log.d(TAG, " categories: ${it.text}")
           Log.d(TAG, " confidence: ${it.confidence}")
       }
   }
}

Теперь вы готовы принимать изображения для обнаружения!

Запустите практическое задание, нажав кнопку «Запустить» ( ) на панели инструментов Android Studio. Попробуйте выбрать предустановленное изображение или сделать снимок, а затем посмотрите на окно logcat. ) внутри IDE. Вы должны увидеть что-то подобное:

D/MLKit Object Detection: Detected object: 0
D/MLKit Object Detection:  trackingId: null
D/MLKit Object Detection:  boundingBox: (481, 2021) - (2426,3376)
D/MLKit Object Detection:  categories: Fashion good
D/MLKit Object Detection:  confidence: 0.90234375
D/MLKit Object Detection: Detected object: 1
D/MLKit Object Detection:  trackingId: null
D/MLKit Object Detection:  boundingBox: (2639, 2633) - (3058,3577)
D/MLKit Object Detection: Detected object: 2
D/MLKit Object Detection:  trackingId: null
D/MLKit Object Detection:  boundingBox: (3, 1816) - (615,2597)
D/MLKit Object Detection:  categories: Home good
D/MLKit Object Detection:  confidence: 0.75390625

Это означает, что детектор зафиксировал 3 объекта:

Категории включают в себя модные товары и товары для дома .
Для второго элемента категория не найдена, поскольку это неизвестный класс.
отсутствует trackingId (поскольку это режим обнаружения одного изображения).
положение внутри прямоугольника boundingBox (например, (481, 2021) – (2426, 3376))
Детектор с достаточной уверенностью определяет, что первый товар — это модный предмет (90%) ( это платье ).

Технически, это всё, что вам нужно для работы функции обнаружения объектов ML Kit — у вас всё это есть на данный момент! Поздравляем !

Да, что касается пользовательского интерфейса, вы всё ещё находитесь на том же этапе, с которого начали, но вы можете использовать полученные результаты в интерфейсе, например, для создания ограничивающей рамки, чтобы улучшить пользовательский опыт. Следующий шаг — визуализация полученных результатов!

6. Постобработка результатов обнаружения

На предыдущих этапах вы выводили результат обнаружения в logcat : это просто и быстро.

В этом разделе вы воспользуетесь результатом, представленным на изображении:

Нарисуйте ограничивающую рамку на изображении.
Нарисуйте название категории и уровень достоверности внутри ограничивающей рамки.

Разберитесь в инструментах визуализации.

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

class ImageClickableView — это класс представления изображения, предоставляющий ряд удобных инструментов для визуализации и взаимодействия с результатом обнаружения.
fun drawDetectionResults(results: List<DetectedObject>) Этот метод рисует белые круги в центре каждого обнаруженного объекта.
fun setOnObjectClickListener(listener: ((objectImage: Bitmap) -> Unit)) Это функция обратного вызова для получения обрезанного изображения, содержащего только тот объект, на который нажал пользователь. В следующем практическом занятии вы отправите это обрезанное изображение в бэкэнд поиска изображений, чтобы получить визуально похожий результат. В этом практическом занятии вы пока не будете использовать этот метод.

Показать результаты обнаружения с помощью ML Kit

Используйте средства визуализации, чтобы отобразить результат обнаружения объектов с помощью ML Kit поверх входного изображения.

Перейдите к месту вызова функции debugPrint() и добавьте следующий фрагмент кода ниже:

runOnUiThread {
    viewBinding.ivPreview.drawDetectionResults(it)
}

Запустите его

Теперь нажмите « Выполнить » ( ) на панели инструментов Android Studio.

После загрузки приложения нажмите кнопку со значком камеры, наведите камеру на объект, сделайте снимок, подтвердите снимок (в приложении «Камера») или просто выберите любое из предустановленных изображений. Вы должны увидеть результат обнаружения; нажмите кнопку еще раз или выберите другое изображение, чтобы повторить несколько раз, и оцените возможности новейшего ML Kit ODT!

7. Поздравляем!

Вы использовали ML Kit для добавления в свое приложение функций обнаружения объектов:

3 шага с 3 API
Создать входное изображение
Создать детектор
Отправить изображение на детектор

Это всё, что вам нужно, чтобы запустить его!

Что мы рассмотрели

Как добавить функцию обнаружения и отслеживания объектов ML Kit в ваше Android-приложение
Как использовать встроенную функцию обнаружения и отслеживания объектов в ML Kit для распознавания объектов на изображениях

Следующие шаги

Попробуйте выполнить это практическое задание , чтобы узнать, как отправить обнаруженный объект в бэкэнд поиска товаров и отобразить результаты поиска.
Изучите возможности ML Kit ODT, используя больше изображений и видео в реальном времени, чтобы оценить точность и производительность обнаружения и классификации.
Ознакомьтесь с программой обучения «Расширьте свои знания в области обнаружения объектов», чтобы узнать, как обучить собственную модель.
Ознакомьтесь с рекомендациями Material Design по обнаружению объектов в режиме реального времени и на статических изображениях.
Примените ML Kit ODT в своем собственном приложении для Android.

Узнать больше

https://developers.google.com/ml-kit/vision/object-detection