0% menganggap dokumen ini bermanfaat (0 suara)
4 tayangan15 halaman

slide mobile programming p3

Dokumen ini menjelaskan langkah-langkah untuk membuat dan menjalankan proyek mobile menggunakan VSCode dan perangkat Android, termasuk cara mengaktifkan mode developer dan USB debugging. Selain itu, dijelaskan juga cara menggunakan flutlab.io sebagai editor online untuk pengkodean Flutter, termasuk proses login dan pembuatan proyek baru. Pengguna dapat menjalankan proyek baik melalui perangkat Android maupun emulator web setelah mengikuti instruksi yang diberikan.

Diunggah oleh

Sarah
Hak Cipta
© © All Rights Reserved
Kami menangani hak cipta konten dengan serius. Jika Anda merasa konten ini milik Anda, ajukan klaim di sini.
Format Tersedia
Unduh sebagai PDF, TXT atau baca online di Scribd
0% menganggap dokumen ini bermanfaat (0 suara)
4 tayangan15 halaman

slide mobile programming p3

Dokumen ini menjelaskan langkah-langkah untuk membuat dan menjalankan proyek mobile menggunakan VSCode dan perangkat Android, termasuk cara mengaktifkan mode developer dan USB debugging. Selain itu, dijelaskan juga cara menggunakan flutlab.io sebagai editor online untuk pengkodean Flutter, termasuk proses login dan pembuatan proyek baru. Pengguna dapat menjalankan proyek baik melalui perangkat Android maupun emulator web setelah mengikuti instruksi yang diberikan.

Diunggah oleh

Sarah
Hak Cipta
© © All Rights Reserved
Kami menangani hak cipta konten dengan serius. Jika Anda merasa konten ini milik Anda, ajukan klaim di sini.
Format Tersedia
Unduh sebagai PDF, TXT atau baca online di Scribd
Anda di halaman 1/ 15

PERTEMUAN 3

MOBILE Programming I
Membuat dan Menjalankan Projek
Dengan VSCode dan Handphone Android
• Pastikan VSCode sudah terinstal

Tutorial instalasi lihat modul halaman 29.


Menjalankan aplikasi dengan Handphone
Android
Untuk menggunakan android device secara langsung,
pertama aktifkan dulu mode developer dengan cara
buka Setting kemudian pilih System kemudian pilih
About Phone, untuk masing-masing device mungkin
terdapat perbedaan untuk lokasi About Phone ada
pula yang berada pada Additional Setting
• Kemudian pilih About Phone • Kemudian ketuk Build number
beberapa kali, namun ini juga berbeda
untuk beberapa versi misalnya untuk
Xiaomi dengan mengetuk MIUI
Version beberapa kali
• Selanjutnya mengaktifkan USB Debugger • Kemudian aktifkan USB
dengan cara pilih Developer Option pada Debugging
System, Developer Option ini akan muncul
setelah mode Developer diaktifkan dengan
cara diatas
• Jika telah selesai, hubungkan Handphone android dengan laptop/komputer
dengan kabel data, untuk memeriksa apakah sudah terhubung dengan
Handphone, dapat dilihat pada VSCode bagian pojok kanan bawah akan
tertera nama device yang terhubung
• Atau jika pada Android Studio terletak pada toolbar bagian atas tengah

• Agar laptop bekerja lebih ringan dapat digunakan Text Editor VSCode dan menjalankan
projek langsung menggunakan Handphone Android. Untuk menjalankan projek melalui
VSCode dengan klik logo play pada bagian pojok kanan atas
Adapun tampilannya adalah sebagai
berikut
Membuat dan Menjalankan Projek
dengan flutlab.io dan Web Emulator
• Selain menggunakan Android Studio dan VS Code, untuk
melakukan pengkodingan flutter dapat pula menggunakan editor
online yaitu flutlab.io. Namun untuk menggunakan flutlab.io ini
memerlukan akses internet
• Silahkan buka laman flutlab.io kemudian klik Get Started maka
akan muncul laman dengan template awal code flutter
• Agar aplikasi yang dibuat dapat tersimpan, lakukan login dengan menekan
tombol dengan logo user pada pojok kanan atas, kemudian kita dapat login
dengan dua cara, yaitu login dengan google ataupun membuat akun tersendiri
pada flutlab.io

• Setelah login pada flutlab.io maka akan tampil halaman workspace


Membuat dan Menjalankan Projek di flutlab.io

• Klik tombol + New Project yang terdapat pada pojok kanan atas kemudian
pilih Stateless Hello World
Pada form tersebuat isikan dengan
data berikut:

Projek Name : latihan_flutter

Untuk bagian Package dapat


diabaikan dan akan mengambil
nama package default yaitu
com.example.latihan_flutter

Kemudian klik tombol CREATE


• Kemudian kita akan diarahkan ke halaman workspace dengan projek yang
telah dibuat sebelumnya. Untuk membuka projek, klik projek yang telah
dibuat, maka akan muncul code projek tersebut
• Untuk menjalankan projek, klik tombol (pastikan opsi yang terpilih
adalah web) yang terdapat di pojok kiri atas, tunggu hingga proses build
selesai.

• Setelah selesai, akan muncul tampilan seperti berikut


• Setelah melakukan perubahan pada kodingan, kita dapat
menyimpan pembaruan dengan shortcut CTRL + S

Anda mungkin juga menyukai