1. Home
  2. Docs
  3. Kurikulum Flutter Mobile Apps
  4. Tugas Week 3
  5. Tugas-12-layouting telegram

Tugas-12-layouting telegram

Sebelum tugas mulai dikerjakan, berikut video briefing materi Component.

Pada tugas kali ini, Anda diminta untuk mulai membiasakan diri melakukan coding menggunakan sintaks-sintaks Flutter. Untuk itu, kali ini Anda bisa mengikuti sebuah video tutorial untuk dapat membangun tampilan/UI sederhana dari aplikasi Telegram. Sebelum mulai mengikuti tutorial tersebut, ada beberapa tahapan yang perlu dipersiapkan, antara lain:

1. Mempersiapkan folder

Dalam mengerjakan tugas ini, silahkan membuat folder “Tugas” terlebih dahulu di dalam folder proyek Flutter yang telah dibuat. Dan di dalam folder “Tugas” buatlah folder “Tugas12“. Dan di dalam folder “Tugas12“, Anda bisa membuat file Telegram.dart dan DrawerScreen.dart dan Models untuk dummy datanya. untuk lebih jelas nya ikuti video diatas.

2. Mendownload data yang diperlukan

pada tutorial ini ada beberapa file yaitu models untuk dummy datanya dan juga foto profile, untuk foto profile gunakan foto masing-masing di taruh di folder assets/img, lalu untuk file models dapat di download di link berikut ini : https://drive.google.com/drive/folders/1tf8h_AtzO6WqwNhi4yY0xNOPhNDaEVXd?usp=sharing.

Tutorial Membuat UI Aplikasi Telegram

Berikut tutorial membangun UI aplikasi mobile Telegram. Ikuti langkah-langkah yang digunakan di video tersebut dan pastikan code yang diikuti dapat dijalankan pada perangkat Android Anda.

Dan Bagi Teman-teman yang tidak bisa mengikuti video tutorial, sobat sanber dapat mengikuti coding berikut ini :

main.dart

Telegram.dart

DrawerScreen.dart

Model/Chart_Models.dart (Sudah ada tinggal download)

pubspec.yaml

uncoment assets ubah jadi asstes/img

assets/img

untuk foto silahkan menggunakan foto masing-masing peserta

Jika tutorial tersebut sudah diikuti sampai selesai, selanjutnya silahkan push hasil pekerjaan Anda ke Gitlab. Dan jangan lupa untuk mengumpulkan link commit hasil pekerjaan Anda ke sanbercode.com.