จดจําข้อความในรูปภาพด้วย ML Kit บน iOS

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

คุณใช้ ML Kit เพื่อจดจําข้อความในรูปภาพหรือวิดีโอได้ เช่น ข้อความของป้ายถนน ลักษณะหลักของฟีเจอร์นี้คือ

API การจดจําข้อความ
คำอธิบายจดจําข้อความภาษาละตินในรูปภาพหรือวิดีโอ
ชื่อ SDKGoogleMLKit/TextRecognition (version 2.2.0)
การใช้งานเนื้อหาจะลิงก์กับแอปของคุณแบบคงที่เมื่อสร้างบิลด์
ผลกระทบต่อขนาดแอปประมาณ 20 MB
ประสิทธิภาพเรียลไทม์บนอุปกรณ์ส่วนใหญ่
  • ลองใช้แอปตัวอย่างเพื่อดูตัวอย่างการใช้งาน API นี้
  • ลองใช้โค้ดด้วยตนเองด้วย codelab

ก่อนเริ่มต้น

  1. รวมพ็อด ML Kit ต่อไปนี้ใน Podfile
    pod 'GoogleMLKit/TextRecognition','2.2.0'
    
  2. หลังจากติดตั้งหรืออัปเดตพ็อดของโปรเจ็กต์แล้ว ให้เปิดโปรเจ็กต์ Xcode โดยใช้ .xcworkspace ML Kit ใช้ได้ใน Xcode เวอร์ชัน 12.4 ขึ้นไป

1. สร้างอินสแตนซ์ TextRecognizer

สร้างอินสแตนซ์ของ TextRecognizer โดยการเรียกใช้ +textRecognizer

Swift

let textRecognizer = TextRecognizer.textRecognizer()
      

Objective-C

MLKTextRecognizer *textRecognizer = [MLKTextRecognizer textRecognizer];
      

2. เตรียมรูปภาพอินพุต

ส่งรูปภาพเป็น UIImage หรือ CMSampleBufferRef ไปยังเมธอด process(_:completion:) ของ TextRecognizer&#39

สร้างออบเจ็กต์ VisionImage โดยใช้ UIImage หรือ CMSampleBuffer

หากคุณใช้ UIImage ให้ทําตามขั้นตอนต่อไปนี้

  • สร้างออบเจ็กต์ VisionImage ที่มี UIImage ตรวจสอบว่าได้ระบุ .orientation ที่ถูกต้อง

    Swift

    let image = VisionImage(image: UIImage)
    visionImage.orientation = image.imageOrientation

    Objective-C

    MLKVisionImage *visionImage = [[MLKVisionImage alloc] initWithImage:image];
    visionImage.orientation = image.imageOrientation;

หากคุณใช้ CMSampleBuffer ให้ทําตามขั้นตอนต่อไปนี้

  • ระบุการวางแนวของข้อมูลรูปภาพที่มีอยู่ใน CMSampleBuffer

    วิธีดูการวางแนวรูปภาพ

    Swift

    func imageOrientation(
      deviceOrientation: UIDeviceOrientation,
      cameraPosition: AVCaptureDevice.Position
    ) -> UIImage.Orientation {
      switch deviceOrientation {
      case .portrait:
        return cameraPosition == .front ? .leftMirrored : .right
      case .landscapeLeft:
        return cameraPosition == .front ? .downMirrored : .up
      case .portraitUpsideDown:
        return cameraPosition == .front ? .rightMirrored : .left
      case .landscapeRight:
        return cameraPosition == .front ? .upMirrored : .down
      case .faceDown, .faceUp, .unknown:
        return .up
      }
    }
          

    Objective-C

    - (UIImageOrientation)
      imageOrientationFromDeviceOrientation:(UIDeviceOrientation)deviceOrientation
                             cameraPosition:(AVCaptureDevicePosition)cameraPosition {
      switch (deviceOrientation) {
        case UIDeviceOrientationPortrait:
          return cameraPosition == AVCaptureDevicePositionFront ? UIImageOrientationLeftMirrored
                                                                : UIImageOrientationRight;
    
        case UIDeviceOrientationLandscapeLeft:
          return cameraPosition == AVCaptureDevicePositionFront ? UIImageOrientationDownMirrored
                                                                : UIImageOrientationUp;
        case UIDeviceOrientationPortraitUpsideDown:
          return cameraPosition == AVCaptureDevicePositionFront ? UIImageOrientationRightMirrored
                                                                : UIImageOrientationLeft;
        case UIDeviceOrientationLandscapeRight:
          return cameraPosition == AVCaptureDevicePositionFront ? UIImageOrientationUpMirrored
                                                                : UIImageOrientationDown;
        case UIDeviceOrientationUnknown:
        case UIDeviceOrientationFaceUp:
        case UIDeviceOrientationFaceDown:
          return UIImageOrientationUp;
      }
    }
          
  • สร้างออบเจ็กต์ VisionImage โดยใช้ออบเจ็กต์และการวางแนว CMSampleBuffer ดังต่อไปนี้

    Swift

    let image = VisionImage(buffer: sampleBuffer)
    image.orientation = imageOrientation(
      deviceOrientation: UIDevice.current.orientation,
      cameraPosition: cameraPosition)

    Objective-C

     MLKVisionImage *image = [[MLKVisionImage alloc] initWithBuffer:sampleBuffer];
     image.orientation =
       [self imageOrientationFromDeviceOrientation:UIDevice.currentDevice.orientation
                                    cameraPosition:cameraPosition];

3. ประมวลผลรูปภาพ

แล้วส่งรูปภาพไปยังเมธอด process(_:completion:) ดังนี้

Swift

textRecognizer.process(visionImage) { result, error in
  guard error == nil, let result = result else {
    // Error handling
    return
  }
  // Recognized text
}

Objective-C

[textRecognizer processImage:image
                  completion:^(MLKText *_Nullable result,
                               NSError *_Nullable error) {
  if (error != nil || result == nil) {
    // Error handling
    return;
  }
  // Recognized text
}];

4. ดึงข้อความจากบล็อกข้อความที่รู้จัก

หากการจดจําข้อความสําเร็จ ระบบจะแสดงออบเจ็กต์ Text ออบเจ็กต์ Text มีข้อความฉบับเต็มที่จดจําในรูปภาพและออบเจ็กต์ TextBlock จํานวน 0 รายการหรือมากกว่า

TextBlock แต่ละรายการแสดงถึงบล็อกข้อความสี่เหลี่ยมผืนผ้าซึ่งมีออบเจ็กต์ TextLine 0 รายการหรือมากกว่า ออบเจ็กต์ TextLine แต่ละรายการจะมีออบเจ็กต์ TextElement อย่างน้อย 0 รายการ ซึ่งแสดงถึงคําและเอนทิตีที่คล้ายกับคํา เช่น วันที่และตัวเลข

สําหรับออบเจ็กต์ TextBlock, TextLine และ TextElement แต่ละรายการ คุณจะรับรู้ข้อความในภูมิภาคและพิกัดขอบเขตของภูมิภาคได้

เช่น

Swift

let resultText = result.text
for block in result.blocks {
    let blockText = block.text
    let blockLanguages = block.recognizedLanguages
    let blockCornerPoints = block.cornerPoints
    let blockFrame = block.frame
    for line in block.lines {
        let lineText = line.text
        let lineLanguages = line.recognizedLanguages
        let lineCornerPoints = line.cornerPoints
        let lineFrame = line.frame
        for element in line.elements {
            let elementText = element.text
            let elementCornerPoints = element.cornerPoints
            let elementFrame = element.frame
        }
    }
}

Objective-C

NSString *resultText = result.text;
for (MLKTextBlock *block in result.blocks) {
  NSString *blockText = block.text;
  NSArray<MLKTextRecognizedLanguage *> *blockLanguages = block.recognizedLanguages;
  NSArray<NSValue *> *blockCornerPoints = block.cornerPoints;
  CGRect blockFrame = block.frame;
  for (MLKTextLine *line in block.lines) {
    NSString *lineText = line.text;
    NSArray<MLKTextRecognizedLanguage *> *lineLanguages = line.recognizedLanguages;
    NSArray<NSValue *> *lineCornerPoints = line.cornerPoints;
    CGRect lineFrame = line.frame;
    for (MLKTextElement *element in line.elements) {
      NSString *elementText = element.text;
      NSArray<NSValue *> *elementCornerPoints = element.cornerPoints;
      CGRect elementFrame = element.frame;
    }
  }
}

หลักเกณฑ์ของรูปภาพที่ป้อน

  • เพื่อให้ ML Kit จดจําข้อความได้อย่างถูกต้อง รูปภาพอินพุตต้องมีข้อความที่แสดงด้วยข้อมูลพิกเซลที่เพียงพอ ตามหลักการแล้ว แต่ละอักขระควรมีขนาดอย่างน้อย 16x16 พิกเซล โดยทั่วไปประโยชน์ที่อักขระจะใหญ่กว่าคือ 24x24 พิกเซลจะไม่มีประโยชน์

    เช่น รูปภาพขนาด 640x480 อาจเหมาะสําหรับการสแกนนามบัตรที่ใช้เต็มความกว้างของรูปภาพ อาจต้องมีรูปภาพขนาด 720x1280 พิกเซลเพื่อสแกนเอกสารที่พิมพ์บนกระดาษขนาดตัวอักษร

  • การโฟกัสรูปภาพที่ไม่ดีอาจส่งผลต่อความแม่นยําในการจดจําข้อความ หากยังไม่ได้รับผลลัพธ์ที่ยอมรับได้ ให้ลองขอให้ผู้ใช้จับภาพอีกครั้ง

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

เคล็ดลับในการปรับปรุงประสิทธิภาพ

  • สําหรับการประมวลผลเฟรมวิดีโอ ให้ใช้ API แบบซิงโครนัสของตัวตรวจจับ results(in:) เรียกใช้เมธอดนี้จากฟังก์ชัน AVCaptureVideoDataOutputSampleBufferDelegate's captureOutput(_, didOutput:from:) เพื่อรับผลลัพธ์จากเฟรมวิดีโอพร้อมกัน เก็บ AVCaptureVideoDataOutput's alwaysDiscardsLateVideoFrames เป็น true เพื่อควบคุมการโทรไปยังตัวตรวจจับ หาก กรอบวิดีโอใหม่พร้อมใช้งานขณะที่ตัวตรวจจับกําลังทํางาน ระบบจะวางกรอบดังกล่าวไว้
  • หากใช้เอาต์พุตของตัวตรวจจับเพื่อวางซ้อนกราฟิกบนรูปภาพอินพุต ให้ดูผลลัพธ์จาก ML Kit ก่อน แล้วแสดงผลรูปภาพและวางซ้อนภายในขั้นตอนเดียว วิธีนี้จะช่วยให้คุณแสดงผลในพื้นที่แสดงผลได้เพียงครั้งเดียวสําหรับเฟรมอินพุตที่ได้รับการประมวลผลแต่ละรายการ ดูตัวอย่างของ update Previewโฆษณาซ้อนทับViewWithLastFrame ได้ในตัวอย่างการเริ่มต้นใช้งาน ML Kit อย่างรวดเร็ว
  • ลองจับภาพที่ความละเอียดต่ําลง อย่างไรก็ตาม โปรดคํานึงถึงข้อกําหนดด้านขนาดรูปภาพของ API นี้ด้วย