1. Pengantar
Apa itu MediaPipe?
MediaPipe Solutions dapat Anda gunakan untuk menerapkan solusi machine learning (ML) ke aplikasi Anda. Solusi ini menyediakan framework untuk mengonfigurasi pipeline pemrosesan prebuilt yang memberikan output segera, menarik, dan bermanfaat bagi pengguna. Anda bahkan dapat menyesuaikan berbagai solusi ini dengan MediaPipe Model Maker untuk mengupdate model default.
Pembuatan Teks ke Gambar adalah salah satu dari beberapa tugas ML yang ditawarkan MediaPipe Solutions.
Dalam Codelab ini, Anda akan memulai dengan aplikasi Android yang sebagian besar tidak digunakan, lalu berlanjut melalui beberapa langkah hingga Anda dapat membuat gambar baru langsung di perangkat Android.
Yang akan Anda pelajari
- Cara menerapkan pembuatan teks ke gambar yang berjalan secara lokal di aplikasi Android dengan MediaPipe Tasks.
Yang Anda butuhkan
- Versi Android Studio terinstal (codelab ini ditulis dan diuji dengan Android Studio Giraffe).
- Perangkat Android dengan RAM minimal 8 GB.
- Pengetahuan dasar tentang pengembangan Android dan kemampuan untuk menjalankan skrip Python yang telah ditulis sebelumnya.
2. Menambahkan MediaPipe Tasks ke aplikasi Android
Mendownload aplikasi awal Android
Codelab ini akan dimulai dengan contoh siap pakai yang terdiri dari UI yang akan digunakan untuk pembuatan gambar versi dasar. Anda dapat menemukan aplikasi tersebut untuk memulai di repositori Contoh MediaPipe resmi di sini. Clone repo atau download file zip dengan mengklik Code > Download ZIP.
Mengimpor aplikasi ke Android Studio
- Buka Android Studio.
- Dari layar Welcome to Android Studio, pilih Open di pojok kanan atas.

- Buka tempat Anda meng-clone atau mendownload repositori, lalu buka direktori codelab/image_generation_basic/android/start.
- Pada tahap ini, aplikasi tidak boleh dikompilasi karena Anda belum menyertakan dependensi MediaPipe Tasks.
Anda akan memperbaiki aplikasi dan menjalankannya dengan membuka file build.gradle, lalu men-scroll ke bawah ke // Langkah 1 - Tambahkan dependensi. Dari sana, sertakan baris berikut, lalu tekan tombol Sync Now yang muncul di banner di bagian atas Android Studio.
// Step 1 - Add dependency
implementation 'com.google.mediapipe:tasks-vision-image-generator:latest.release'
Setelah sinkronisasi selesai, verifikasi bahwa semua aplikasi telah dibuka dan diinstal dengan benar dengan mengklik panah run berwarna hijau (
) di kanan atas Android Studio. Anda akan melihat aplikasi terbuka ke layar dengan dua tombol pilihan dan tombol berlabel INITIALIZE. Jika mengklik tombol tersebut, Anda akan segera diarahkan ke UI terpisah yang terdiri dari perintah teks dan opsi lainnya beserta tombol berlabel BUAT.

Sayangnya itu sejauh yang diperlukan aplikasi awal, jadi sekarang saatnya Anda mempelajari cara menyelesaikan aplikasi ini dan mulai membuat gambar baru di perangkat.
3. Menyiapkan Generator Gambar
Untuk contoh ini, sebagian besar pekerjaan pembuatan gambar akan terjadi di file ImageGenerationHelper.kt. Saat membuka file ini, Anda akan melihat variabel di bagian atas class yang disebut imageGenerator. Ini adalah objek Task yang akan melakukan bagian pekerjaan yang sulit di aplikasi pembuatan gambar Anda.
Tepat di bawah objek itu Anda akan melihat fungsi bernama initializationImageGenerator() dengan komentar berikut: // Langkah 2 - inisialisasi generator gambar. Seperti yang mungkin sudah Anda duga, di sinilah Anda akan melakukan inisialisasi objek ImageGenerator. Ganti isi fungsi tersebut dengan kode berikut untuk menetapkan jalur model pembuatan gambar dan menginisialisasi objek ImageGenerator:
// Step 2 - initialize the image generator
val options = ImageGeneratorOptions.builder()
.setImageGeneratorModelDirectory(modelPath)
.build()
imageGenerator = ImageGenerator.createFromOptions(context, options)
Di bawahnya Anda akan melihat fungsi lain bernama setInput(). Metode ini menerima tiga parameter: string prompt yang akan digunakan untuk menentukan gambar yang dihasilkan, jumlah iterasi yang harus dijalankan Tugas saat membuat gambar baru, dan nilai seed yang dapat digunakan untuk membuat gambar versi baru berdasarkan perintah yang sama saat menghasilkan gambar yang sama jika seed yang sama digunakan. Tujuan fungsi ini adalah menetapkan parameter awal ini untuk generator gambar saat Anda mencoba membuat gambar yang memang menampilkan langkah perantara.
Lanjutkan dan ganti isi setInput() (tempat Anda akan melihat komentar // Langkah 3 - terima input) dengan baris ini:
// Step 3 - accept inputs
imageGenerator.setInputs(prompt, iteration, seed)
Dua langkah berikutnya adalah tempat dilakukannya generasi. Fungsi generate() menerima input yang sama seperti setInput, tetapi membuat gambar sebagai panggilan satu kali yang tidak menampilkan gambar langkah perantara apa pun. Anda dapat mengganti isi fungsi ini (yang mencakup komentar // Langkah 4 - buat tanpa menampilkan iterasi) dengan kode berikut:
// Step 4 - generate without showing iterations
val result = imageGenerator.generate(prompt, iteration, seed)
val bitmap = BitmapExtractor.extract(result?.generatedImage())
return bitmap
Penting untuk diketahui bahwa tugas ini terjadi secara sinkron, sehingga Anda harus memanggil fungsi dari thread latar belakang. Anda akan mempelajarinya lebih lanjut nanti di codelab ini.
Langkah terakhir yang akan Anda ambil dalam file ini adalah mengisi fungsiexecute() (berlabel sebagai Langkah 5). Ini akan menerima parameter yang memberi tahu apakah gambar tersebut harus menampilkan gambar perantara atau tidak untuk satu langkah pembuatan yang akan dilakukan dengan fungsi ImageGenerator visual(). Ganti isi fungsi dengan kode ini:
// Step 5 - generate with iterations
val result = imageGenerator.execute(showResult)
if (result == null || result.generatedImage() == null) {
return Bitmap.createBitmap(512, 512, Bitmap.Config.ARGB_8888)
.apply {
val canvas = Canvas(this)
val paint = Paint()
paint.color = Color.WHITE
canvas.drawPaint(paint)
}
}
val bitmap =
BitmapExtractor.extract(result.generatedImage())
return bitmap
Itu saja untuk file helper. Di bagian berikutnya, Anda akan mengisi file ViewModel yang menangani logika untuk contoh ini.
4. Menyatukan Aplikasi
File MainViewModel akan menangani status UI dan logika lain yang terkait dengan aplikasi contoh ini. Silakan buka sekarang.
Di bagian atas file Anda akan melihat komentar // Langkah 6 - set model path. Di sinilah Anda akan memberi tahu aplikasi tempat menemukan file model yang diperlukan untuk pembuatan gambar. Untuk contoh ini, Anda akan menetapkan nilai ke /data/local/tmp/image_generator/bins/.
// Step 6 - set model path
private val MODEL_PATH = "/data/local/tmp/image_generator/bins/"
Dari sana, gulir ke bawah ke fungsi generateImage(). Di bagian bawah fungsi ini Anda akan melihat Langkah 7 dan Langkah 8, yang masing-masing akan digunakan untuk menghasilkan gambar dengan iterasi yang dikembalikan atau tidak sama sekali. Karena kedua operasi ini terjadi secara sinkron, Anda akan melihat bahwa kedua operasi ini digabungkan dalam coroutine. Anda dapat mulai dengan mengganti // Langkah 7 - Buat tanpa menampilkan iterasi dengan blok kode ini untuk memanggil generate() dari file ImageGenerationHelper, lalu update status UI.
// Step 7 - Generate without showing iterations
val result = helper?.generate(prompt, iteration, seed)
_uiState.update {
it.copy(outputBitmap = result)
}
Langkah 8 akan sedikit lebih rumit. Karena fungsi execution() hanya melakukan satu langkah, bukan semua langkah untuk pembuatan gambar, Anda harus memanggil setiap langkah satu per satu melalui sebuah loop. Anda juga perlu menentukan apakah langkah saat ini harus ditampilkan kepada pengguna. Terakhir, Anda akan memperbarui status UI jika iterasi saat ini harus ditampilkan. Anda dapat melakukan semua ini sekarang.
// Step 8 - Generate with showing iterations
helper?.setInput(prompt, iteration, seed)
for (step in 0 until iteration) {
isDisplayStep =
(displayIteration > 0 && ((step + 1) % displayIteration == 0))
val result = helper?.execute(isDisplayStep)
if (isDisplayStep) {
_uiState.update {
it.copy(
outputBitmap = result,
generatingMessage = "Generating... (${step + 1}/$iteration)",
)
}
}
}
Di tahap ini Anda seharusnya dapat menginstal aplikasi, melakukan inisialisasi generator gambar, lalu membuat gambar baru berdasarkan perintah teks
... kecuali sekarang aplikasi error saat Anda mencoba melakukan inisialisasi generator gambar. Alasannya adalah Anda perlu menyalin file model ke perangkat. Untuk mendapatkan informasi terbaru tentang model pihak ketiga yang dikenal, mengonversinya untuk tugas MediaPipe ini, dan menyalinnya ke perangkat Anda, Anda dapat meninjau bagian ini dalam dokumentasi resmi.
Selain menyalin file langsung ke perangkat pengembangan, Anda juga dapat menyiapkan Firebase Storage untuk mendownload file yang diperlukan langsung ke perangkat pengguna saat runtime.
5. Men-deploy dan menguji aplikasi
Setelah itu, Anda seharusnya memiliki aplikasi yang berfungsi dapat menerima perintah teks dan membuat gambar baru sepenuhnya di perangkat. Lanjutkan dan deploy aplikasi ke perangkat Android fisik untuk mengujinya, meskipun ingat bahwa Anda perlu mencobanya dengan perangkat dengan memori minimal 8 GB.
- Klik Run (
) di toolbar Android Studio untuk menjalankan aplikasi. - Pilih jenis langkah pembuatan (final atau dengan iterasi), lalu tekan tombol INITIALIZE.
- Di layar berikutnya, tetapkan properti apa pun yang Anda inginkan dan klik tombol BUAT untuk melihat apa yang akan dihasilkan oleh alat tersebut.

6. Selamat!
Anda berhasil! Dalam codelab ini, Anda telah mempelajari cara menambahkan pembuatan teks ke gambar di perangkat ke aplikasi Android.
Langkah berikutnya
Ada banyak hal yang dapat Anda lakukan dengan tugas pembuatan gambar, termasuk
- menggunakan image dasar untuk membuat struktur gambar yang dihasilkan melalui plugin, atau melatih bobot LoRA tambahan Anda sendiri melalui Vertex AI.
- Gunakan Firebase Storage untuk mengambil file model di perangkat Anda tanpa memerlukan penggunaan alat ADB.
Kami tak sabar melihat semua hal keren yang Anda buat dengan tugas eksperimental ini, dan nantikan lebih banyak lagi codelab dan konten dari tim MediaPipe.