Tutorial Menampilkan Video Di Flutter Tutorial Flutter Indonesia
kucingtekno - Tutorial Flutter Indonesia kali ini akan membahas bagaimana menampilkan video di Flutter sekaligus tombol play dan pause. Dan pada tutorial flutter ini akan menjelaskan cara mudah menampilkan video di flutter dengan sederhana dan gampang dipahami
Mungkin di postingan sebelumnya teman-teman sudah membaca Tutorial Membuat Webview di Flutter - Tutorial Flutter Indonesia dengan mudah . Kali ini berbeda sedikit yaitu konten yang ditampilkan berupa video online alias video kita ambil dari URL.
Flutter Video App via oraculoti com
Pada tutorial ini silakan teman-teman menggunakan Visual Code atau Android Studio terserah bagaimana nyaman dan efektif bagi teman-teman. Namun disini saya akan menggunakan Android Studio dan menggunakan Emulator di Android Studio untuk menampilkan hasil aplikasi androidnya
Seperti yang sudah saya singgung di depan, aplikasi yang dihasilkan pada tutorial menampilkan video flutter ini adalah halaman utama dengan video yang diambil online dan ada tombol ( Floating Button ) dilengkapi aksi play dan pause untuk mengontrol video. Jika kalian ingin menambah gambar tulisan atau widget lainnya dipersilakan.
Berikut Cara Menampilkan Video di Flutter dengan mudah :
1. Tambahkan Dependenci Video Player -Flutter
Langsung saja silakan buat projek baru , beri nama terserah teman-teman dan simpan projeknya di folder yang dikehendaki. Kemudian buka pubspec.yaml lalu tambahkan plugin video player di bagian dependencies seperti dibawah ini :
dependencies:
flutter:
sdk: flutter
video_player:
2. Tambahkan Permission Internet di Manifest - Flutter
Buka file AndroidManifest.xml , file tersebut bisa ditemukan di /android/app/src/main/AndroidManifest.xml. Lalu tambahkan permission internet .
3. Buat dan Inisiasi VideoPlayerController - Flutter
Tambahkan kode berikut di main.dart
source code Inisiasi VideoPlayerController - Flutter
4. Menambahkan Fungsi Tampil Video - Flutter
Tambahkan dan sesuaikan seperti kode berikut :
source code Fungsi Tampil Video - Flutter
5. Menambahkan Fungi Kontrol Play Pause- Flutter
Tambahkan dan sesuaikan seperti kode berikut :
source code Fungi Kontrol Play Pause- Flutter
6. Source Code Tutorial Menampilkan Video di Flutter - Tutorial Flutter Indonesia ( main.dart )
Pasti kalian bingung dimana menempatkannya kan ? berikut kode lengkap main.dart silakan sesuaikan dan bisa ditambahkan fungsi-fungsi lain sesuai kreatifitas. Silakan ganti URL Video dengan link video kamu di https : // xxxx/ butterfly.mp4 - Running Aplikasi di Emulator
running aplikasi Menampilkan Video di FlutterItu adalah tampilan Video di Flutter jika sudah berhasil , video tersebut pertama akan di load terlebih dahulu pastikan menggunakan koneksi internet lalu kamu bisa mengontrol Play dan Pause dengan tombol di bawah
Artikel ini hanyalah simpanan cache dari url asal penulis yang berkebarangkalian sudah terlalu lama atau sudah dibuang :
https://www.kucingtekno.com/2020/04/tutorial-menampilkan-video-di-flutter.html