จดจำ ระบุภาษา และแปลข้อความด้วย 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 แอปจะใช้ API การรู้จำข้อความในอุปกรณ์ ML Kit เพื่อจดจำข้อความจากฟีดกล้องแบบเรียลไทม์ โดยจะใช้ ML Kit Language Identification API เพื่อระบุภาษาของข้อความที่จดจำได้ สุดท้าย แอปจะแปลข้อความนี้เป็นภาษาใดก็ได้จาก 59 ภาษาที่เลือกโดยใช้ ML Kit Translation API

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

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

• วิธีใช้ ML Kit SDK เพื่อเพิ่มความสามารถด้านแมชชีนเลิร์นนิงลงในแอป Android ได้อย่างง่ายดาย
• การจดจำข้อความ การระบุภาษา และ Translation API ของ ML Kit รวมถึงความสามารถของ API เหล่านี้
• วิธีใช้ไลบรารี CameraX กับ ML Kit API

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

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

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

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

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

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

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

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

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

• starter - โค้ดเริ่มต้นที่คุณนำไปต่อยอดใน Codelab นี้ได้

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

นําเข้าโปรเจ็กต์เริ่มต้นไปยัง Android Studio ในไฟล์ app/build.gradle ให้ตรวจสอบว่ามีไลบรารี 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() โปรดทราบว่าคุณต้องโทรหา 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