مشروع لتطبيق التعرف على النصوص من داخل الصوره في فلاتر

مشروع لتطبيق التعرف على النصوص من داخل الصوره في فلاتر

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

أصبح إطار عمل Google Flutter شائعًا بشكل متزايد ، ويتم تطوير المزيد والمزيد من التطبيقات باستخدام Flutter اليوم. تعد قدرة Flutter عبر الأنظمة الأساسية هي ميزتها الرئيسية. يدعم كل من الويب وأنظمة التشغيل iOS / Android تطبيقك. بالإضافة إلى ذلك ، نظرًا لأن Flutter هو إطار عمل مفتوح المصدر ، يمكن لأي مطور تحسين وظائفه على GitHub.

سنقوم بإدراج أفضل التطبيقات مفتوحة المصدر التي تم إنشاؤها باستخدام Flutter اليوم. قد يمنحك بعض الأفكار حول كيفية تطور تطبيقك المستند إلى Flutter إذا تم استخدام خدمات تطوير تطبيقات الأجهزة المحمولة المناسبة. سنبدأ بتطبيقات Flutter المجانية والمفتوحة المصدر بحيث يمكنك استخدامها على الفور.

Add packages to dependencies

dependencies:

  google_ml_kit: ^0.11.0

  image_picker: ^0.8.4+4

How to RecognizedText from image in Flutter

في البداية عليك بتثبيت المكتبة السابقه لديك في ملفات المشروع وهيا تدعم الnull safety لان معظم المشاريع التي قد تراها على اليوتيوب لا تدعم الnull safety ولهذا قدمنا لكم شرح جديد بعد تثبيت المكتبة عليك بإنشاء مجموعة متغيرات مثل xfile و string يظهر النص الذي سوف يكون في الصورة و bool وتكون حالة اختبار اذا كان الModel قام بالتعرف على النص من الصورة ام لا , وبناء على القيمة سيتم اظهار الصورة والنص الذي تم الحصول عليه من الصورة كما هو موضح بالصورة الخاصه بالمقاله .

Ui.dart

import 'package:flutter/material.dart';
import 'package:google_ml_kit/google_ml_kit.dart';
import 'package:image_picker/image_picker.dart';

class DetectText extends StatefulWidget {
  const DetectText({Key? key}) : super(key: key);

  @override
  State<DetectText> createState() => _DetectTextState();
}

class _DetectTextState extends State<DetectText> {
  XFile? file;
  String text = '';
  bool textScan = false;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Detect Text'),
      ),
      body: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        crossAxisAlignment: CrossAxisAlignment.center,
        children: [
          if (textScan) const CircularProgressIndicator(),
          if (!textScan && file == null)
            Container(
              height: 220,
              width: 220,
              color: Colors.grey,
            ),
          if (file != null)
            Stack(
              alignment: Alignment.topRight,
              children: [
                Image.file(
                  File(file!.path),
                  height: 300,
                  width: 300,
                  fit: BoxFit.cover,
                ),
               Padding(padding: const EdgeInsets.all(8.0), child:CircleAvatar(
                   backgroundColor: Colors.white,
                   child: IconButton(onPressed: () {
                     file = null;
                     text = '' ;
                      setState(() {});
                   }, icon: Icon(Icons.delete),color: Colors.blue)),),
              ],
            ),
          SizedBox(height: 20),
          Row(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              SizedBox(
                height: 50,
                width: 100,
                child: OutlinedButton(
                  style: OutlinedButton.styleFrom(
                    primary: Colors.blue,
                  ),
                  onPressed: () {
                    getImage(ImageSource.camera);
                  },
                  child: const Icon(
                    Icons.photo_camera,
                    size: 24,
                  ),
                ),
              ),
              SizedBox(width: 20),
              SizedBox(
                height: 50,
                width: 100,
                child: OutlinedButton(
                  style: OutlinedButton.styleFrom(
                    primary: Colors.blue,
                  ),
                  onPressed: () {
                    getImage(ImageSource.gallery);
                  },
                  child: Icon(
                    Icons.image,
                    size: 24,
                  ),
                ),
              ),
              SizedBox(height: 20),
            ],
          ),
          Padding(
            padding: EdgeInsets.all(12),
            child: SelectableText(
              text,
              style: TextStyle(fontSize: 18),
            ),
          )
        ],
      ),
    );
  }

  void getImage(ImageSource source) async {
    try {
      final pickImage = await ImagePicker().pickImage(source: source);
      if (pickImage != null) {
        setState(() {
          textScan = true;
          file = pickImage;
        });
        getRecognisedText(pickImage);
      }
    } catch (e) {
      setState(() {
        textScan = false;
        file = null;
        text = 'Error';
      });
    }
  }

  void getRecognisedText(XFile image) async {
    final inputImage = InputImage.fromFilePath(image.path);

    final textDetector = GoogleMlKit.vision.textRecognizer();
    RecognizedText recognisedText = await textDetector.processImage(inputImage);
    await textDetector.close();
    text = "";
    for (TextBlock block in recognisedText.blocks) {
      for (TextLine line in block.lines) {
        text = text + line.text + "\n";
      }
    }
    textScan = false;
    setState(() {});
  }
}

android sdk manager تحميل flutter developers applications create app android android studio mac