จดจำ ระบุภาษา และแปลข้อความด้วย ML Kit และ CameraX: Android

1. บทนำ

ML Kit เป็น SDK สำหรับอุปกรณ์เคลื่อนที่ที่นำความเชี่ยวชาญด้านแมชชีนเลิร์นนิงของ Google มาสู่ Android และแอป Android ในแพ็กเกจที่ทรงพลังแต่ใช้งานง่าย ไม่ว่าคุณจะเพิ่งเริ่มใช้หรือมีประสบการณ์ด้านแมชชีนเลิร์นนิงอยู่แล้ว ก็สามารถใช้ฟังก์ชันที่คุณต้องการได้ง่ายๆ ด้วยโค้ดเพียงไม่กี่บรรทัด คุณไม่จำเป็นต้องมีความรู้เชิงลึกเกี่ยวกับโครงข่ายประสาทหรือการเพิ่มประสิทธิภาพโมเดลเพื่อเริ่มต้นใช้งาน

หลักการทำงาน

ML Kit ช่วยให้คุณใช้เทคนิค ML ในแอปได้อย่างง่ายดายด้วยการรวมเทคโนโลยี ML ของ Google เช่น Mobile Vision และ TensorFlow Lite ไว้ใน SDK เดียว ไม่ว่าคุณจะต้องการความสามารถแบบเรียลไทม์ของโมเดลในอุปกรณ์ของ Mobile Vision หรือความยืดหยุ่นของโมเดล TensorFlow Lite ที่กำหนดเอง ML Kit ก็ช่วยให้คุณทำได้ด้วยโค้ดเพียงไม่กี่บรรทัด

Codelab นี้จะแนะนำขั้นตอนง่ายๆ ในการเพิ่มการจดจำข้อความ การระบุภาษา และการแปลจากฟีดกล้องแบบเรียลไทม์ลงในแอป Android ที่มีอยู่ นอกจากนี้ Codelab นี้ยังจะเน้นแนวทางปฏิบัติแนะนำเกี่ยวกับการใช้ CameraX กับ ML Kit API ด้วย

สิ่งที่คุณจะสร้าง

ใน Codelab นี้ คุณจะได้สร้างแอป Android ด้วย ML Kit แอปจะใช้ Text Recognition ของ ML Kit ในอุปกรณ์ API เพื่อจดจำข้อความจากฟีดกล้องแบบเรียลไทม์ โดยจะใช้ ML Kit Language Identification API เพื่อระบุภาษาของข้อความที่รับรู้ สุดท้าย แอปจะแปลข้อความนี้เป็นภาษาใดก็ได้จาก 59 ภาษาโดยใช้ Translation API ของ ML Kit

ในท้ายที่สุด คุณควรเห็นสิ่งที่คล้ายกับรูปภาพด้านล่าง

สิ่งที่คุณจะได้เรียนรู้

• วิธีใช้ ML Kit SDK เพื่อเพิ่มความสามารถด้านแมชชีนเลิร์นนิงลงในแอป Android ได้อย่างง่ายดาย
• ML Kit Text Recognition, Language Identification, Translation API และความสามารถของ API เหล่านี้
• วิธีใช้ไลบรารี CameraX กับ ML Kit API

สิ่งที่คุณต้องมี

• Android Studio เวอร์ชันล่าสุด (v4.0 ขึ้นไป)
• อุปกรณ์ Android จริง
• โค้ดตัวอย่าง
• ความรู้พื้นฐานเกี่ยวกับการพัฒนาแอป Android ใน Kotlin

Codelab นี้มุ่งเน้นที่ ML Kit เราได้จัดเตรียมและติดตั้งใช้งานแนวคิดและบล็อกโค้ดที่ไม่เกี่ยวข้องให้คุณแล้ว

2. การเริ่มตั้งค่า

ดาวน์โหลดโค้ด

คลิกลิงก์ต่อไปนี้เพื่อดาวน์โหลดโค้ดทั้งหมดสำหรับ Codelab นี้

ดาวน์โหลดซอร์สโค้ด

แตกไฟล์ ZIP ที่ดาวน์โหลด การดำเนินการนี้จะแตกโฟลเดอร์รูท (mlkit-android) พร้อมทรัพยากรทั้งหมดที่คุณต้องการ สำหรับโค้ดแล็บนี้ คุณจะต้องใช้เฉพาะทรัพยากรในไดเรกทอรีย่อย translate

ไดเรกทอรีย่อย translate ในที่เก็บ mlkit-android มีไดเรกทอรีต่อไปนี้

• เริ่มต้น - โค้ดเริ่มต้นที่คุณจะใช้ต่อใน Codelab นี้

3. นำเข้าโปรเจ็กต์และยืนยันทรัพยากร Dependency ของ ML Kit และ CameraX

นำเข้าโปรเจ็กต์เริ่มต้นไปยัง Android Studio ในไฟล์ app/build.gradle ให้ตรวจสอบว่ามีทรัพยากร Dependency ของ ML Kit และ CameraX ที่จำเป็น

// CameraX dependencies
def camerax_version = "1.0.0-beta05"
implementation "androidx.camera:camera-core:${camerax_version}"
implementation "androidx.camera:camera-camera2:${camerax_version}"
implementation "androidx.camera:camera-lifecycle:${camerax_version}"
implementation "androidx.camera:camera-view:1.0.0-alpha12"

// ML Kit dependencies
implementation 'com.google.android.gms:play-services-mlkit-text-recognition:16.0.0'
implementation 'com.google.mlkit:language-id:16.0.0'
implementation 'com.google.mlkit:translate:16.0.0'

4. เรียกใช้แอปเริ่มต้น

ตอนนี้คุณได้นำเข้าโปรเจ็กต์ไปยัง Android Studio และตรวจสอบการขึ้นต่อกันของ ML Kit แล้ว คุณก็พร้อมที่จะเรียกใช้แอปเป็นครั้งแรก คลิกเรียกใช้ ( ) ในแถบเครื่องมือของ Android Studio

แอปควรจะเปิดขึ้นในอุปกรณ์ของคุณ และคุณสามารถเล็งกล้องไปที่ข้อความต่างๆ เพื่อดูฟีดสดได้ แต่ระบบยังไม่ได้ติดตั้งใช้งานฟังก์ชันการจดจำข้อความ

5. เพิ่มการจดจำข้อความ

ในขั้นตอนนี้ เราจะเพิ่มฟังก์ชันการทำงานลงในแอปเพื่อจดจำข้อความจากกล้องวิดีโอ

สร้างอินสแตนซ์ของเครื่องตรวจจับข้อความ ML Kit

แทนที่ TODO ที่ด้านบนของ TextAnalyzer.kt เพื่อสร้างอินสแตนซ์ TextRecognition ซึ่งเป็นวิธีรับแฮนเดิลไปยังตัวจดจำข้อความเพื่อใช้ในขั้นตอนต่อๆ ไป นอกจากนี้ เรายังต้องเพิ่มเครื่องตรวจจับเป็นเครื่องสังเกตวงจรของออบเจ็กต์เพื่อปิดเครื่องตรวจจับอย่างถูกต้องเมื่อไม่จำเป็นต้องใช้แล้ว

TextAnalyzer.kt

private val detector = TextRecognition.getClient(TextRecognizerOptions.DEFAULT_OPTIONS)

init {
   lifecycle.addObserver(detector)
}

เรียกใช้การจดจำข้อความในรูปภาพที่ป้อน (สร้างด้วยบัฟเฟอร์จากกล้อง)

ไลบรารี CameraX มีสตรีมรูปภาพจากกล้องที่พร้อมสำหรับการวิเคราะห์รูปภาพ แทนที่recognizeText()เมธอดในคลาส TextAnalyzer เพื่อใช้การจดจำข้อความของ ML Kit ในแต่ละเฟรมรูปภาพ

TextAnalyzer.kt

private fun recognizeText(
   image: InputImage
): Task<Text> {
   // Pass image to an ML Kit Vision API
   return detector.process(image)
       .addOnSuccessListener { text ->
           // Task completed successfully
           result.value = text.text
       }
       .addOnFailureListener { exception ->
           // Task failed with an exception
           Log.e(TAG, "Text recognition error", exception)
           val message = getErrorMessage(exception)
           message?.let {
               Toast.makeText(context, message, Toast.LENGTH_SHORT).show()
           }
       }
}

บรรทัดต่อไปนี้แสดงวิธีเรียกใช้เมธอดข้างต้นเพื่อเริ่มการจดจำข้อความ เพิ่มบรรทัดต่อไปนี้ที่ส่วนท้ายของ analyze() method โปรดทราบว่าคุณต้องเรียกใช้ imageProxy.close เมื่อการวิเคราะห์รูปภาพเสร็จสมบูรณ์แล้ว ไม่เช่นนั้นฟีดกล้องสดจะไม่สามารถประมวลผลรูปภาพเพิ่มเติมเพื่อการวิเคราะห์ได้

TextAnalyzer.kt

recognizeText(InputImage.fromBitmap(croppedBitmap, 0)).addOnCompleteListener {
   imageProxy.close()
}

เรียกใช้แอปในอุปกรณ์

ตอนนี้คลิกเรียกใช้ ( ) ในแถบเครื่องมือ Android Studio เมื่อแอปโหลดแล้ว แอปควรเริ่มจดจำข้อความจากกล้องแบบเรียลไทม์ เล็งกล้องไปที่ข้อความเพื่อยืนยัน หากแอปไม่รู้จักข้อความใดๆ ให้ลอง "รีเซ็ต" การตรวจหาโดยหันกล้องไปยังพื้นที่ว่างก่อนที่จะหันกล้องไปยังข้อความ

6. เพิ่มการระบุภาษา

สร้างอินสแตนซ์ของตัวระบุภาษา ML Kit

MainViewModel.kt อยู่ในโฟลเดอร์หลัก ไปที่ไฟล์ แล้วเพิ่มช่องต่อไปนี้ลงใน MainViewModel.kt วิธีนี้จะช่วยให้คุณได้รับแฮนเดิลไปยังตัวระบุภาษาเพื่อใช้ในขั้นตอนถัดไป

MainViewModel.kt

private val languageIdentifier = LanguageIdentification.getClient(TextRecognizerOptions.DEFAULT_OPTIONS)

นอกจากนี้ คุณยังต้องตรวจสอบว่าไคลเอ็นต์ปิดอย่างถูกต้องเมื่อไม่จำเป็นต้องใช้อีกต่อไป โดยการลบล้างเมธอด onCleared() ของ ViewModel

MainViewModel.kt

override fun onCleared() {
   languageIdentifier.close()
   translators.evictAll()
}

เรียกใช้การระบุภาษาในอุปกรณ์กับข้อความที่ตรวจพบ

ใช้ตัวระบุภาษาของ ML Kit เพื่อรับภาษาของข้อความที่ตรวจพบจากรูปภาพ

หมายเหตุ: ระบบจะจัดเก็บข้อความที่ตรวจพบไว้ในออบเจ็กต์ที่ชื่อ sourceText นี่คือออบเจ็กต์ LiveData ที่กำหนดเองซึ่งจะแจ้งเตือนผู้สังเกตการณ์ก็ต่อเมื่อค่าใหม่ไม่เปลี่ยนแปลงเป็นระยะเวลาหนึ่ง เราใช้ฟังก์ชันนี้ที่นี่เพื่อเรียกใช้ฟังก์ชันการระบุภาษาเฉพาะในกรณีที่ข้อความที่ตรวจพบมีความเสถียรเป็นเวลา 50 มิลลิวินาทีเพื่อลดการกะพริบ ดูข้อมูลเกี่ยวกับวิธีใช้งานได้ที่SmoothedMutableLiveData คลาส

แทนที่ TODO ในคำจำกัดความของฟิลด์ sourceLang ใน MainViewModel.kt ด้วยโค้ดต่อไปนี้ ข้อมูลโค้ดนี้เรียกใช้เมธอดการระบุภาษาและกำหนดผลลัพธ์หากไม่ได้กำหนดเป็น "und" ภาษาที่ไม่ได้กำหนดหมายความว่า API ระบุภาษาตามรายการภาษาที่รองรับไม่ได้

MainViewModel.kt

val sourceLang = Transformations.switchMap(sourceText) { text ->
   val result = MutableLiveData<Language>()
   languageIdentifier.identifyLanguage(text)
       .addOnSuccessListener { languageCode ->
           if (languageCode != "und")
               result.value = Language(languageCode)
       }
   result
}

เรียกใช้แอปในอุปกรณ์

ตอนนี้คลิกเรียกใช้ ( ) ในแถบเครื่องมือ Android Studio เมื่อแอปโหลดแล้ว แอปควรเริ่มจดจำข้อความจากกล้องและระบุภาษาของข้อความแบบเรียลไทม์ เล็งกล้องไปที่ข้อความเพื่อยืนยัน

7. เพิ่มคำแปล

แทนที่ฟังก์ชัน translate() ใน MainViewModel.kt ด้วยโค้ดต่อไปนี้ ฟังก์ชันนี้จะใช้ค่าภาษาต้นฉบับ ค่าภาษาเป้าหมาย และข้อความต้นฉบับเพื่อทำการแปล โปรดทราบว่าหากยังไม่ได้ดาวน์โหลดโมเดลภาษาเป้าหมายที่เลือกไว้ลงในอุปกรณ์ เราจะเรียกใช้ downloadModelIfNeeded() เพื่อดำเนินการดังกล่าว แล้วจึงแปล

MainViewModel.kt

private fun translate(): Task<String> {
   val text = sourceText.value
   val source = sourceLang.value
   val target = targetLang.value
   if (modelDownloading.value != false || translating.value != false) {
       return Tasks.forCanceled()
   }
   if (source == null || target == null || text == null || text.isEmpty()) {
       return Tasks.forResult("")
   }
   val sourceLangCode = TranslateLanguage.fromLanguageTag(source.code)
   val targetLangCode = TranslateLanguage.fromLanguageTag(target.code)
   if (sourceLangCode == null || targetLangCode == null) {
       return Tasks.forCanceled()
   }
   val options = TranslatorOptions.Builder()
       .setSourceLanguage(sourceLangCode)
       .setTargetLanguage(targetLangCode)
       .build()
   val translator = translators[options]
   modelDownloading.setValue(true)

   // Register watchdog to unblock long running downloads
   Handler().postDelayed({ modelDownloading.setValue(false) }, 15000)
   modelDownloadTask = translator.downloadModelIfNeeded().addOnCompleteListener {
       modelDownloading.setValue(false)
   }
   translating.value = true
   return modelDownloadTask.onSuccessTask {
       translator.translate(text)
   }.addOnCompleteListener {
       translating.value = false
   }
}

เรียกใช้แอปในโปรแกรมจำลอง

ตอนนี้คลิกเรียกใช้ ( ) ในแถบเครื่องมือ Android Studio เมื่อแอปโหลดแล้ว แอปควรมีลักษณะเหมือนภาพเคลื่อนไหวด้านล่าง ซึ่งแสดงผลการจดจำข้อความและภาษาที่ระบุ รวมถึงข้อความที่แปลเป็นภาษาที่เลือก คุณเลือกได้จาก 59 ภาษา

8. ยินดีด้วย

ขอแสดงความยินดี คุณเพิ่งเพิ่มการจดจำข้อความบนอุปกรณ์ การระบุภาษา และการแปลลงในแอปโดยใช้ ML Kit ตอนนี้คุณสามารถจดจำข้อความและภาษาจากฟีดกล้องสด แล้วแปลข้อความนี้เป็นภาษาที่คุณเลือกได้แบบเรียลไทม์

สิ่งที่เราได้พูดถึง

• วิธีเพิ่ม ML Kit ลงในแอป Android
• วิธีใช้การจดจำข้อความในอุปกรณ์ใน ML Kit เพื่อจดจำข้อความในรูปภาพ
• วิธีใช้การระบุภาษาในอุปกรณ์ใน ML Kit เพื่อระบุภาษาของข้อความ
• วิธีใช้การแปลบนอุปกรณ์ใน ML Kit เพื่อแปลข้อความเป็นภาษาต่างๆ 59 ภาษาแบบไดนามิก
• วิธีใช้ CameraX ร่วมกับ ML Kit API

ขั้นตอนถัดไป

• ใช้ ML Kit และ CameraX ในแอป Android ของคุณเอง

ดูข้อมูลเพิ่มเติม

• https://developers.google.com/docs/ml-kit
• https://developer.android.com/training/camerax