在Android应用中使用Firebase ML套件-设备上的文本识别
谷歌IO 2018,谷歌宣布了Firebase ML Kit,这基本上是一个神奇的包,为那些不是ML专家的移动开发人员在他们的移动应用程序中添加ML magic。
目前它处于测试阶段,可以用于以下用例:
- 文本识别
- 人脸检测
- 条码扫描
- 图像标签
- 地标识别
本教程中的内容
在本教程中,我们将使用Firebase ML Kit构建一个Android应用程序。你的应用将会:
- 利用ML Kit文本识别API检测图像中的文本
- 当设备具有互联网连接时,使用ML Kit云文本识别API扩展文本识别功能(例如非拉丁字母)
本教程扩展了Google Codelab,以在我们的Android应用程序中使用Wonderkiln Camerkit添加图像捕捉功能,以识别捕获的图像中的文本。
为了方便起见,我们将从创建一个新项目开始从头开始完成整个过程。
建立一个基本的项目
在Android Studio中创建一个新项目。我已经命名了我的FirebaseMLKit-Android 。
选择首选的最小SDK和Empty Activity Template,其余的默认选项并继续完成。
设置CameraKit
CameraKit for Android是一款非常易于使用的实用程序,可用于臭名昭着的Android Camera和Camera2 API。
- 在您的build.gradle(Module:app)文件中,依赖项下,添加此行 implementation ‘com.wonderkiln:camerakit:0.13.1 然后Sync now
- 在您的activity_main.xml添加下面的代码中,将一个CameraKit CameraView添加到布局以及一个按钮。
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<com.wonderkiln.camerakit.CameraView
android:id="@+id/camView"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<Button
android:id="@+id/cameraBtn"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:text="@string/recognize" />
</FrameLayout>
- 现在我们有了我们的用户界面,让我们添加一些逻辑。在你TextRecognizerActivity.kt中
public override fun onResume() {
super.onResume()
camView.start()
}
public override fun onPause() {
camView.stop()
super.onPause()
}
- 现在我们在onCreate()中添加了CameraKitEventListener,它将允许我们侦听CamView事件
camView.addCameraKitListener(object : CameraKitEventListener {
override fun onEvent(cameraKitEvent: CameraKitEvent) {
}
override fun onError(cameraKitError: CameraKitError) {
}
override fun onImage(cameraKitImage: CameraKitImage) {
var bitmap = cameraKitImage.bitmap
bitmap = Bitmap.createScaledBitmap(bitmap, camView.width, camView.height, false)
camView.stop()
runTextRecognition(bitmap)
}
override fun onVideo(cameraKitVideo: CameraKitVideo) {
}
})
在onImage方法下,我们将捕获的图像存储在位图中。
- 现在我们在按钮单击中添加Button click listener onCreate(),cameraView将捕获图像。
cameraBtn.setOnClickListener {
graphic_overlay_.clear()
camView.start()
camView.captureImage()
}
所以我们几乎完成了相机设置。
设置Firebase ML Kit-
- 在您的build.gradle(Module:app)文件中,依赖项下添加这两行
implementation 'com.google.firebase:firebase-core:15.0.2'
implementation 'com.google.firebase:firebase-ml-vision:15.0.0'
- apply plugin: ‘com.google.gms.google-services’在文件dependencies{...}底部的部分之后添加此项。
- 在你的build.gradle(Project: FirebaseMLKit)文件中,添加依赖项classpath ‘com.google.gms:google-services:3.2.0’
搭配Firebase控制台
- 到Firebase控制台
- 选择Create New Project,并命名您的项目。
- 从你的新项目的总览屏幕,点击添加Firebase到你的Android应用程序。
- 输入项目的包名并注册应用程序。you will find yours in app levelbuild.gradle file
applicationId "com.cogitator.firebasemlkit"
下载该google-services.json文件并将其添加到文件app夹的级别。现在应用程序文件夹下的项目视图将如下所示。现在同步。
设置Graphic Overlay utils
这部分仅供您的应用程序在捕获的图像上绘制图形,以便按以下方式显示识别的文本。
- 现在,只需创建两个新的Kotlin空文件GraphicOverlay和TextGraphic。
- 获取GraphicOverlay.kt(https://gist.github.com/AnkitDroidGit/540c6ad6c02b6495547febcc963c9792)和TextGraphic.kt(https://gist.github.com/AnkitDroidGit/8bb86c8dbe78a897077738b4c94cce10)的代码
添加文本识别逻辑 -
在您的activity_text_recog.xml中添加此代码在FrameLayout下 -
<com.cogitator.firebasemlkit.textRecognizer.GraphicOverlay
android:id="@+id/graphic_overlay_"
android:layout_width="match_parent"
android:layout_height="match_parent" />
完整的XML文件应该这样
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<com.wonderkiln.camerakit.CameraView
android:id="@+id/camView"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<com.cogitator.firebasemlkit.textRecognizer.GraphicOverlay
android:id="@+id/graphic_overlay_"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<Button
android:id="@+id/cameraBtn"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:text="@string/recognize" />
<ImageView
android:id="@+id/imgCamera"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</FrameLayout>
将com.cogitator.firebasemlkit替换为您的软件包名称。
将以下内容添加runTextRecognition到您的TextRecognizerActivity.kt类中:
private fun processTextRecognitionResult(texts: FirebaseVisionText) {
val blocks = texts.blocks
if (blocks.size == 0) {
Log.d("TAG", "No text found")
return
}
graphic_overlay_.clear()
for (i in blocks.indices) {
val lines = blocks.get(i).lines
for (j in lines.indices) {
val elements = lines[j].elements
for (k in elements.indices) {
val textGraphic = TextGraphic(graphic_overlay_, elements[k])
graphic_overlay_.add(textGraphic)
}
}
}
}
停止cameraview后,在camerakit的onImage方法下调用方法runTextRecognition。
override fun onImage(cameraKitImage: CameraKitImage) {
var bitmap = cameraKitImage.bitmap
bitmap = Bitmap.createScaledBitmap(bitmap, camView.width, camView.height, false)
camView.stop()
runTextRecognition(bitmap)
}
现在清除GraphicOverlay并在拍摄图像之前按下按钮后再次启动cameraView。这将启动相机进行另一个图像捕捉。
cameraBtn.setOnClickListener {
graphic_overlay_.clear()
camView.start()
camView.captureImage()
}