حزمة تعلُّم الآلة لميزة التعرّف على النص وميزات الوجه: iOS

1. مقدمة

‫ML Kit هي حزمة تطوير برامج (SDK) للأجهزة الجوّالة تتيح للمطوّرين الاستفادة من خبرة Google في مجال تعلُّم الآلة في تطبيقات Android وiOS، وذلك من خلال حزمة فعّالة وسهلة الاستخدام. سواء كنت مبتدئًا أو خبيرًا في مجال تعلُّم الآلة، يمكنك بسهولة تنفيذ الوظائف التي تحتاج إليها ببضعة أسطر من الرموز البرمجية. لست بحاجة إلى معرفة تفصيلية بالشبكات العصبية أو تحسين النماذج للبدء.

كيف تعمل هذه الميزة؟

تسهّل حزمة تعلّم الآلة تطبيق تقنيات تعلُّم الآلة في تطبيقاتك من خلال الجمع بين تكنولوجيات تعلُّم الآلة من Google، مثل Mobile Vision وTensorFlow Lite، في حزمة تطوير البرامج (SDK) واحدة. سواء كنت بحاجة إلى إمكانات الوقت الفعلي التي توفّرها نماذج Mobile Vision على الجهاز فقط أو مرونة نماذج تصنيف الصور المخصّصة في TensorFlow Lite، تتيح لك حزمة تعلّم الآلة تنفيذ ذلك ببضع أسطر من الرموز البرمجية.

سيرشدك هذا الدرس التطبيقي حول الترميز إلى كيفية إنشاء تطبيق iOS خاص بك يمكنه رصد النص وملامح الوجه تلقائيًا في صورة.

ما ستنشئه

في هذا الدرس التطبيقي حول الترميز، ستنشئ تطبيق iOS باستخدام حزمة تعلُّم الآلة. سيتم إجراء ما يلي في تطبيقك:

  • استخدام واجهة برمجة التطبيقات "التعرّف على النص" في حزمة تعلّم الآلة لاكتشاف النص في الصور
  • استخدام واجهة برمجة التطبيقات "التعرّف على الوجوه" في حزمة تعلّم الآلة لتحديد ملامح الوجه في الصور

صورة لغريس هوبر توضّح واجهة برمجة التطبيقات Face Recognition API في ML Kitصورة لافتة على العشب تعرض واجهة برمجة التطبيقات للتعرّف على النص

ما ستتعلمه

  • كيفية استخدام حزمة تعلّم الآلة (SDK) لإضافة إمكانات متقدّمة في تعلُّم الآلة بسهولة، مثل التعرّف على النصوص ورصد ملامح الوجه، إلى أي تطبيق iOS

المتطلبات

  • إصدار حديث من Xcode (الإصدار 12.4 أو إصدار أحدث)
  • محاكي iOS أو جهاز iOS فعلي يعمل بنظام التشغيل iOS 10.0 أو الإصدارات الأحدث
  • تتوافق "حزمة تعلُّم الآلة" مع بنيتَي 64 بت التاليتَين فقط: x86_64 وarm64
  • الرمز النموذجي
  • معرفة أساسية بتطوير تطبيقات iOS باستخدام Swift
  • فهم أساسي لنماذج تعلُّم الآلة

يركّز هذا الدرس التطبيقي حول الترميز على حزمة تعلّم الآلة. يتم تجاهل المفاهيم ومجموعات الرموز غير ذات الصلة، ويتم توفيرها لك لنسخها ولصقها ببساطة.

2. الإعداد

تنزيل الرمز

انقر على الرابط التالي لتنزيل كل الرموز البرمجية لهذا الدرس التطبيقي حول الترميز:

فكّ ضغط ملف ZIP الذي تم تنزيله. سيؤدي ذلك إلى إنشاء مجلد جذر (mlkit-ios-codelab) يحتوي على جميع الموارد التي ستحتاج إليها. في هذا الدرس التطبيقي، لن تحتاج إلا إلى الموارد الموجودة في الدليل الفرعي vision.

يحتوي الدليل الفرعي vision في مستودع mlkit-ios-codelab على دليلَين:

  • android_studio_folder.pngstarter: الرمز الأوّلي الذي ستستند إليه في هذا الدرس التطبيقي حول الترميز.
  • android_studio_folder.pngfinal: رمز مكتمل لنموذج التطبيق النهائي.

إضافة التبعيات الخاصة بحزمة تعلُّم الآلة باستخدام CocoaPods

يتم استخدام CocoaPods لإضافة تبعيات حزمة تعلّم الآلة إلى تطبيقك. إذا لم يكن CocoaPods مثبَّتًا على جهازك، يمكنك الاطّلاع على تعليمات التثبيت هنا. بعد التثبيت، افتح Podfile في المحرّر المفضّل لديك وأضِف حزمة تعلّم الآلة كعناصر تابعة:

Podfile

platform :ios, '10.0'
use_frameworks!

pod 'GoogleMLKit/FaceDetection'
pod 'GoogleMLKit/TextRecognition'

target 'MLKit-codelab' do
end

تثبيت حِزم Cocoa Pods الخاصة بحزمة تعلُّم الآلة

للتأكّد من توفّر جميع العناصر التابعة لتطبيقك، عليك استخدام سطر الأوامر لتثبيت حِزم Cocoa Pods الخاصة بحزمة تعلُّم الآلة.

سطر الأوامر

# Make sure you are in the root of your app
pod install
xed .

3- تشغيل التطبيق النموذجي

أنت الآن جاهز لتشغيل التطبيق للمرة الأولى. انقر على 98205811bbed9d74.pngتشغيل في Xcode لتجميع التطبيق وتشغيله على محاكي iOS.

من المفترض أن يتم تشغيل التطبيق على المحاكي. في هذه المرحلة، من المفترض أن يظهر لك تخطيط أساسي يتضمّن أداة اختيار تتيح لك الاختيار بين صورتَين. في القسم التالي، ستضيف ميزة التعرّف على النص إلى تطبيقك لتحديد النص في الصور.

4. إضافة ميزة التعرّف على النص على الجهاز فقط

في هذه الخطوة، سنضيف وظيفة إلى تطبيقك للتعرّف على النص في الصور.

استيراد وحدة MLVision

تأكَّد من توفّر عمليات الاستيراد التالية في صف ViewController.

ViewController.swift

import MLKit

إنشاء VisionTextRecognizer

أضِف السمات الكسولة التالية إلى فئة ViewController.

ViewController.swift

private lazy var textRecognizer = TextRecognizer.textRecognizer()

إعداد ميزة التعرّف على النص في صورة وتشغيلها على الجهاز فقط

أضِف ما يلي إلى طريقة runTextRecognition للفئة ViewController:

ViewController.swift

func runTextRecognition(with image: UIImage) {
  let visionImage = VisionImage(image: image)
  textRecognizer.process(visionImage) { features, error in
    self.processResult(from: features, error: error)
  }
}

يضبط الرمز البرمجي أعلاه أداة رصد التعرّف على النص ويستدعي الدالة processResult(from:, error:) مع الردّ.

معالجة الردّ على طلب التعرّف على النص

أضِف الرمز التالي إلى processResult في الفئة ViewController لتحليل النتائج وعرضها في تطبيقك.

ViewController.swift

 func processResult(from text: Text?, error: Error?) {
    removeDetectionAnnotations()
    guard error == nil, let text = text else {
      let errorString = error?.localizedDescription ?? Constants.detectionNoResultsMessage
      print("Text recognizer failed with error: \(errorString)")
      return
    }

    let transform = self.transformMatrix()

    // Blocks.
    for block in text.blocks {
      drawFrame(block.frame, in: .purple, transform: transform)

      // Lines.
      for line in block.lines {
        drawFrame(line.frame, in: .orange, transform: transform)

        // Elements.
        for element in line.elements {
          drawFrame(element.frame, in: .green, transform: transform)

          let transformedRect = element.frame.applying(transform)
          let label = UILabel(frame: transformedRect)
          label.text = element.text
          label.adjustsFontSizeToFitWidth = true
          self.annotationOverlayView.addSubview(label)
        }
      }
    }
  }

تشغيل التطبيق على المحاكي

انقر الآن على 98205811bbed9d74.pngتشغيل في Xcode. بعد تحميل التطبيق، تأكَّد من اختيار Image 1 في أداة الاختيار وانقر على الزر Find Text.

من المفترض أن يبدو تطبيقك الآن مثل الصورة أدناه، حيث يعرض نتائج التعرّف على النص والمربّعات المحيطة مركَّبة فوق الصورة الأصلية.

7269fd8fcb4dc793.png

الصورة: Kai Schreiber / Wikimedia Commons / CC BY-SA 2.0

تهانينا، لقد أضفت للتو ميزة التعرّف على النصوص على الجهاز فقط إلى تطبيقك باستخدام حزمة تعلّم الآلة. تُعدّ ميزة التعرّف على النصوص على الجهاز فقط رائعة في العديد من حالات الاستخدام، فهي تعمل حتى عندما لا يتوفّر اتصال بالإنترنت في تطبيقك، كما أنّها سريعة بما يكفي لاستخدامها على الصور الثابتة بالإضافة إلى لقطات الفيديو المباشر.

5- إضافة ميزة رصد ملامح الوجه على الجهاز فقط

في هذه الخطوة، سنضيف وظيفة إلى تطبيقك لرصد ملامح الوجوه في الصور.

إنشاء FaceDetector

أضِف السمات الكسولة التالية إلى فئة ViewController.

ViewController.swift

private lazy var faceDetectorOption: FaceDetectorOptions = {
  let option = FaceDetectorOptions()
  option.contourMode = .all
  option.performanceMode = .fast
  return option
}()
private lazy var faceDetector = FaceDetector.faceDetector(options: faceDetectorOption)

إعداد ميزة "التعرّف على محيط الوجه على الجهاز فقط" وتشغيلها على صورة

أضِف ما يلي إلى طريقة runFaceContourDetection للفئة ViewController:

ViewController.swift

  func runFaceContourDetection(with image: UIImage) {
    let visionImage = VisionImage(image: image)
    faceDetector.process(visionImage) { features, error in
      self.processResult(from: features, error: error)
    }
  }

يضبط الرمز البرمجي أعلاه أداة رصد التعرّف على النص ويستدعي الدالة processResult(from:, error:) مع الردّ.

معالجة استجابة أداة رصد الوجوه

أضِف الرمز التالي إلى processResult في الفئة ViewController لتحليل النتائج وعرضها في تطبيقك.

ViewController.swift

  func processResult(from faces: [Face]?, error: Error?) {
    removeDetectionAnnotations()
    guard let faces = faces else {
      return
    }

    for feature in faces {
      let transform = self.transformMatrix()
      let transformedRect = feature.frame.applying(transform)
      UIUtilities.addRectangle(
        transformedRect,
        to: self.annotationOverlayView,
        color: UIColor.green
      )
      self.addContours(forFace: feature, transform: transform)
    }
  }

أخيرًا، أضِف طريقة المساعد addContours في الفئة ViewController لرسم نقاط الشكل.

ViewController.swift

 private func addContours(forFace face: Face, transform: CGAffineTransform) {
    // Face
    if let faceContour = face.contour(ofType: .face) {
      for point in faceContour.points {
        drawPoint(point, in: .blue, transform: transform)
      }
    }

    // Eyebrows
    if let topLeftEyebrowContour = face.contour(ofType: .leftEyebrowTop) {
      for point in topLeftEyebrowContour.points {
        drawPoint(point, in: .orange, transform: transform)
      }
    }
    if let bottomLeftEyebrowContour = face.contour(ofType: .leftEyebrowBottom) {
      for point in bottomLeftEyebrowContour.points {
        drawPoint(point, in: .orange, transform: transform)
      }
    }
    if let topRightEyebrowContour = face.contour(ofType: .rightEyebrowTop) {
      for point in topRightEyebrowContour.points {
        drawPoint(point, in: .orange, transform: transform)
      }
    }
    if let bottomRightEyebrowContour = face.contour(ofType: .rightEyebrowBottom) {
      for point in bottomRightEyebrowContour.points {
        drawPoint(point, in: .orange, transform: transform)
      }
    }

    // Eyes
    if let leftEyeContour = face.contour(ofType: .leftEye) {
      for point in leftEyeContour.points {
        drawPoint(point, in: .cyan, transform: transform)
      }
    }
    if let rightEyeContour = face.contour(ofType: .rightEye) {
      for point in rightEyeContour.points {
        drawPoint(point, in: .cyan, transform: transform)
      }
    }

    // Lips
    if let topUpperLipContour = face.contour(ofType: .upperLipTop) {
      for point in topUpperLipContour.points {
        drawPoint(point, in: .red, transform: transform)
      }
    }
    if let bottomUpperLipContour = face.contour(ofType: .upperLipBottom) {
      for point in bottomUpperLipContour.points {
        drawPoint(point, in: .red, transform: transform)
      }
    }
    if let topLowerLipContour = face.contour(ofType: .lowerLipTop) {
      for point in topLowerLipContour.points {
        drawPoint(point, in: .red, transform: transform)
      }
    }
    if let bottomLowerLipContour = face.contour(ofType: .lowerLipBottom) {
      for point in bottomLowerLipContour.points {
        drawPoint(point, in: .red, transform: transform)
      }
    }

    // Nose
    if let noseBridgeContour = face.contour(ofType: .noseBridge) {
      for point in noseBridgeContour.points {
        drawPoint(point, in: .yellow, transform: transform)
      }
    }
    if let noseBottomContour = face.contour(ofType: .noseBottom) {
      for point in noseBottomContour.points {
        drawPoint(point, in: .yellow, transform: transform)
      }
    }
  }

تشغيل التطبيق على المحاكي

انقر الآن على 98205811bbed9d74.pngتشغيل في Xcode. بعد تحميل التطبيق، تأكَّد من اختيار Image 2 في أداة الاختيار وانقر على الزر Find Face Contour. من المفترض أن يظهر تطبيقك الآن كما هو موضّح في الصورة أدناه، حيث يعرض ملامح وجه غريس هوبر كنقاط متراكبة على الصورة الأصلية.

a5169b50dafbcb2f.png

تهانينا، لقد أضفت للتو ميزة "رصد محيط الوجه" على الجهاز فقط إلى تطبيقك باستخدام حزمة تعلّم الآلة. تُعدّ ميزة "رصد محيط الوجه" في حزمة تعلّم الآلة رائعة للعديد من حالات الاستخدام لأنّها تعمل حتى عندما لا يتوفّر اتصال بالإنترنت في تطبيقك، كما أنّها سريعة بما يكفي لاستخدامها في الصور الثابتة بالإضافة إلى لقطات الفيديو المباشر.

6. تهانينا!

استخدَمت ML Kit لإضافة إمكانات متقدّمة لتعلُّم الآلة إلى تطبيقك بسهولة.

المواضيع التي تناولناها

  • كيفية إضافة حزمة تعلّم الآلة إلى تطبيق iOS
  • كيفية استخدام ميزة "التعرّف على النص" على الجهاز فقط في حزمة تعلّم الآلة للعثور على النص في الصور
  • كيفية استخدام ميزة "التعرّف على الوجوه" على الجهاز فقط في حزمة تعلّم الآلة لتحديد ملامح الوجه في الصور

الخطوات التالية

  • استخدام حزمة تعلّم الآلة في تطبيق iOS الخاص بك

مزيد من المعلومات

  • https://g.co/mlkit