Flutter: Google ML Kit Part 2

Edanur Hamurcu
4 min readJun 3, 2024

--

Merhabalar,

Daha önce Flutter ve Google ML Kit ile başlatmış olduğum serimizin ikincisi ile karşınızdayım. İlk seri de Google ML Kit paketinin Text Recognition(Metin Tanıma) ve Digital Ink Recognition(Dijital Mürekkep Tanıma) özelliklerini deneyimlemiştik. Serinin ilk yazısına 👉🏻 buradan ulaşabilirsiniz.

Bu seride ise, günlük hayatımızda sıkça karşılaştığımız arka plan değiştirme ve filtre uygulamalarının temelini oluşturan Selfie Segmentation (Arka Planı Ayırma) özelliğini ele alacağız. Sosyal medya filtrelerinden video konferans arka planlarına kadar geniş bir yelpazede kullanılan bu teknolojiyi basit bir örnekle açıklayacağım ve bu teknolojiyi daha anlaşılabilir ve erişilebilir kılmak adına bu örneği Github’a yükleyeceğim.

Selfie Segmentation( Arka Planı Ayırma) Nedir?

Selfie segmentation teknolojisi, hayatımızda üç farklı şekilde karşımıza çıkar:

  1. Arka Plan Değiştirme veya Bulanıklaştırma: Arka planını beğenmediğiniz fotoğrafların bu teknoloji ile arka planını değiştirebilir veya bulanıklaştırarak profesyonel görünümler elde edebilirsiniz.
  2. Eğlenceli Filtreler ve Efektler: Sosyal medya uygulamalarında sıkça gördüğünüz yüz ve vücut filtreleri ile kendinizi farklı sahnelerde veya kostümler içinde görebilirsiniz.
  3. Video Konferans ve Canlı Yayınlar: Arka planı otomatik olarak temizleyerek veya değiştirerek daha profesyonel görünümler oluşturabilirsiniz.

Şimdi biraz teknik detaylara girelim:

ML Kit’in selfie segmentation özelliği, bir resimdeki kullanıcıyı arka plandan ayırmamıza olanak tanır. Nasıl mı? İşte adım adım:

  1. Görüntü İşleme: Öncelikle, ayırma işleminden önce alınan görüntü boyutlandırma ve normalizasyon işlemleri ile uygun formatta hazırlanır.
  2. Modelin Kullanımı: Daha sonra, ML Kit paketinde hazır olarak gelen önceden eğitilmiş model, konvolüsyonel sinir ağları (CNN) gibi derin öğrenme tekniklerini kullanarak görüntüdeki insan figürünü belirler. Bu noktada model, her bir pikselin insan figürü mü yoksa arka plan mı olduğunu belirleyen bir maske (binary mask) oluşturur.
  3. Son İşlem ve Maskeleme: Elde edilen maske, orijinal görüntü ile birleştirilir. Bu maske, insan figürünün bulunduğu bölgeleri 1 (beyaz), arka planı ise 0 (siyah) olarak işaretler. Böylece, bu maske kullanılarak arka plan değiştirilebilir veya bulanıklaştırılabilir.

Bu teknoloji sayesinde, hepimizin zaman zaman ihtiyaç duyduğu fotoğraflardaki arka planı kaldırma işlemi oldukça kolaylaşıyor. Hem de günlük hayatımızda pek çok farklı alanda kullanabileceğimiz şekilde!

Uygulama Kısmına Geçelim !

Teorik bilgileri öğrendiğimize göre, şimdi sıra uygulama kısmında. Selfie segmentation teknolojisini Flutter ile nasıl geliştirebileceğimize bir göz atalım. Bu bölümde adım adım kod yazımını, gerekli ayarları ve püf noktalarını inceleyeceğiz. Hadi başlayalım!

Öncelikle diğer seriye göz atmayanlar için ilk olarak pubspec.yamldosyasına dosyasına google_ml_kitpaketini ekleyerek birden fazla özelliği tek bir paket üzerinden kullanabileceğiniz gibi google_mlkit_selfie_segmentation paketini ekleyerek sadece selfie segmentation özelliğini de kullanabilirsiniz.

Bunlara ek olarak pubspec.yaml dosyasına ayrıca resim yükleme ve çözümleme işlemleri için imageve image_pickerpaketlerini ekliyoruz.

dependencies:
flutter:
sdk: flutter

cupertino_icons: ^1.0.2
google_ml_kit: ^0.16.3
image: ^4.1.7
image_picker: ^1.0.7

Sonraki adımda _SelfieSegState adında bir State sınıfı oluşturuyoruz. Bu sınıf da resmin yüklenip yüklenmediğini, segmentasyon işleminin başlatılıp başlatılmadığını belirten birkaç durum değişkeni tanımlıyoruz.

initState metodu, widget ilk oluşturulduğunda çağrılır. Bu metodda ise _selfieSegmenter nesnesi oluşturuyoruz ve _isSegmenting durumu false olarak ayarlanır.

class SelfieSeg extends StatefulWidget {
const SelfieSeg({super.key});

@override
_SelfieSegState createState() => _SelfieSegState();
}

class _SelfieSegState extends State<SelfieSeg> {
File? _imageFile;
bool _isImageLoaded = false;
SelfieSegmenter? _selfieSegmenter; // SelfieSegmenter nesnesi
bool? _isSegmenting; // Segmentasyon işlemi başlatıldı mı
Uint8List? _segmentationResult; // Segmentasyon sonucu

@override
void initState() {
super.initState();
// SelfieSegmenter nesnesi oluşturuluyor.Segmentasyon işlemi başlatılmamış durumda
_selfieSegmenter =
SelfieSegmenter(mode: SegmenterMode.stream, enableRawSizeMask: true);
_isSegmenting = false;
}

// Fotoğraf seçme
Future<void> _pickImage() async {
final picker = ImagePicker();
final pickedFile = await picker.pickImage(source: ImageSource.gallery);

if (pickedFile != null) {
setState(() {
_imageFile = File(pickedFile.path);
_isImageLoaded = true;
_segmentationResult = null;
});
}
}

Daha sonra ise _pickImage metodu ile resim seçme işlemi gerçekleştirir. Bu metod, kullanıcının galerisinden bir resim seçmesine izin verir. Seçilen resim _imageFile değişkeninde saklanır ve _isImageLoaded durumu true olarak ayarlanır. Ayrıca, _segmentationResult null olarak ayarlanır, çünkü yeni bir resim seçildiğinde önceki segmentasyon sonucunun geçersiz olacağı varsayılır.

// Segmentasyon işlemi
Future<void> _segmentImage() async {
if (_imageFile == null || _selfieSegmenter == null) {
return;
}
setState(() {
_isSegmenting = true; // Segmentasyon işlemi başlatılıyor
});

final inputImage = InputImage.fromFile(_imageFile!);

try {
final segmentationMask = await _selfieSegmenter?.processImage(inputImage); // Segmentasyon işlemi yapılıyor
if (segmentationMask == null) {
print("Segmentation mask is null");
return;
}

final resultImage =
await _createSegmentationResultImage(segmentationMask); // Segmentasyon sonucu

setState(() {
_segmentationResult = resultImage; // Segmentasyon sonucu atanıyor
});
} catch (e) {
print("Error during segmentation: $e");
} finally {
setState(() {
_isSegmenting = false; // Segmentasyon işlemi tamamlandı
});
}
}

Seçilen resmi segmente etmek için asenkron bir fonksiyon tanımlıyoruz. Bu fonksiyonun amacı, resmin segmentasyonunu gerçekleştirmektir.

 final segmentationMask = await _selfieSegmenter?.processImage(inputImage);

Segmentasyon işlemi, _selfieSegmenter adlı bir nesne üzerinde gerçekleştirilir. _selfieSegmenter nesnesi, bir SelfieSegmenter örneğidir ve bir resmin segmentasyonunu yapmak için kullanılır.

processImage metodu, _selfieSegmenter nesnesinin bir metodudur. Bu metod, bir InputImage nesnesini parametre olarak alır ve resmin segmentasyonunu gerçekleştirir. Sonuç olarak, bir SegmentationMask nesnesi döndürür. SegmentationMask nesnesi, resmin segmentasyon sonucunu temsil eder ve hangi kısımların hangi sınıflara veya özelliklere ait olduğunu belirtir.

Segmentasyon işlemi tamamlandıktan sonra, elde edilen SegmentationMask nesnesi, resmin hangi bölgelerinin hangi sınıflara veya özelliklere ait olduğunu belirtir. Bu segmentasyon sonucunu kullanarak çeşitli görsel efektler uygulanabilir, nesne tanıma veya pozlandırma gibi görsel analiz işlemleri gerçekleştirilebilir veya arka plan değiştirme gibi uygulamalar için kullanılabilir.

Flutter ve Google ML Kit API’lerini deneyimlemeye yönelik bu yazımın ikinci serisinin sonuna geldik. Bir sonraki yazımda değinmemi istediğiniz bir ml kit özelliği veya geri bildiriminiz varsa, lütfen benimle paylaşmaktan çekinmeyin.

Buraya kadar okuduğunuz ve vakit ayırdığınız için teşekkür ederim. Bu projenin tamamına ve kaynak kodlarına GitHub üzerinden erişebilirsiniz.

İlgili GitHub linki 👈🏻

--

--

Edanur Hamurcu
Edanur Hamurcu

Written by Edanur Hamurcu

Flutter Developer - Software Engineer

No responses yet