## Jawaban untuk Pertanyaan pada Demo
### Layout dan Widget yang Digunakan
**1. Fitur Utama**
- `main.dart` menggunakan widget `Scaffold` dengan body `Center` dengan child `Column` yang terdiri dari `Image`, `Container` yang berisi `Text`, dua `TextButton`, dan `SizedBox` untuk memberi jarak pada dua `TextButton` tersebut.
- `login.dart` menggunakan widget `Scaffold` dengan body `Container` dengan child `Container` yang memiliki child `Column` dengan children yang berupa `Image`, `SizedBox`, dan `Form` yang memiliki child `SingleChildScrollView`, dengan child `Column` yang berisi `Container` dengan child `TextFormField` untuk menerima input dan `OutlinedButton` untuk submit isi form. Di bawah `Form` tersebut, terdapat `SizedBox` untuk memberi jarak dengan `Container` berisi `RichText` yang berada di bawahnya.
- `user_dashboard.dart` menggunakan widget `Scaffold` dengan body `ListView` dengan children berupa `RichText` untuk menampilkan informasi nickname user yang sedang *log in*, `Container` yang berisi `Column` dengan children `Stack` untuk menampilkan gambar pada widget `ClipRRect` di belakang `Container` lainnya dengan child `Column` yang berisi dua widget `Text` yang dibungkus menggunakan `Center` dan sebuah widget `SizedBox` untuk memberi jarak. Di bawahnya, terdapat `Container` dengan child `Column` yang berisi `Text`, `SizedBox`, dan `Form`. Form tersebut berfungsi untuk menerima input *message* dari pengguna dan ditampilkan dalam bentuk `Row`, dengan children berupa `TextFormField` yang dibungkus dengan widget `Expanded` dengan flex 8, dan `IconButton` di sampingnya untuk mengirimkan *message* tersebut. Setelah itu, di bawah form tersebut, terdapat `Text` yang dibungkus dengan widget `Center` dan `Container` berisi `Column` yang menampilkan semua fitur-fitur yang ada dalam bentuk `Container` dengan child `InkWell` agar `Container` tersebut dapat ditekan untuk berpindah ke halaman fitur yang bersangkutan. Selain itu, digunakan juga `SizedBox` untuk memberi jarak pada `Container` tersebut.
- `admin_dashboard.dart` menggunakan widget `Scaffold` dengan body `ListView` yang dibungkus oleh `Center`. `ListView` tersebut memiliki children berupa widget `Align` yang memiliki child `Container` dengan isi widget `Text` dan widget-widget `Container` dengan child `InkWell` yang memiliki child widget `Center` yang berisi `Text` untuk menampilkan menu yang dapat dipilih oleh admin.
- *Drawer* admin dan file`drawer.dart` menggunakan widget `Drawer` dengan child `Column` yang memiliki children `UserAccountsDrawerHeader` dan widget-widget `ListTile` untuk navigasi ke halaman yang lain ataupun untuk *log out*.
- `profile.dart` menggunakan widget `Scaffold` dengan body `Flex` yang memiliki children `Expanded` yang berisi `ListView` dengan children `Container` untuk menampilkan `Text` yang berisi *title*, `Center` dengan child `CircleAvatar` untuk menampilkan foto profil, serta beberapa `SizedBox` dan `Container` yang berisi `Text` untuk menampilkan informasi terkait pengguna yang bersangkutan.
- `list_fundraising.dart`, `list_message.dart`, dan `list_user.dart` memiliki struktur halaman yang hampir sama. Ketiga halaman ini menggunakan widget `Scaffold` dengan body `Center` yang memiliki child `Column` dengan children berupa dua widget `Expanded`. Widget `Expanded` yang pertama berisi `Container` yang berisi `Text` untuk menunjukkan *title* halaman tersebut. Sementara itu, widget `Expanded` yang kedua berisi `FutureBuilder` untuk menampilkan data yang di-*fetch* dari *web service* PTS. Data tersebut masing-masing ditampilkan dalam suatu `Container` yang memiliki child `InkWell`. Berikut detail child `InkWell` pada `Container` untuk masing-masing halaman:
- `InkWell` untuk `list_fundraising.dart` memiliki child `Column` dengan children `Expanded` untuk menampilkan `Text` nama *donation* yang dibungkus dengan `Align`, `Expanded` untuk menampilkan `Text` nama pembuka *donation* yang dibungkus dengan `Align`, dan `Expanded` yang memiliki child `Row` untuk menampilkan widget `Text` (yang dibungkus `Expanded`) berisi jumlah dana yang dibutuhkan dan status donasi dalam satu baris.
- `InkWell` untuk `list_message.dart` memiliki child `Column` dengan children `Expanded` untuk menampilkan `Text` nama *message* yang dibungkus dengan `Align` dan `Expanded` yang memiliki child `Row` untuk menampilkan widget `Text` (yang dibungkus `Expanded`) berisi pengirim *message* dan waktu terkirim dalam satu baris.
- `InkWell` untuk `list_user.dart` memiliki child `Column` dengan children `Expanded` untuk menampilkan *username* dari pengguna yang dibungkus dengan `Align` dan `Expanded` yang memiliki child `Row` untuk menampilkan widget `Text` (yang dibungkus dengan `Expanded`) berisi *nickname*, ID, dan status pengguna tersebut dalam satu baris.
- `fundraising_detail.dart`, `message_detail.dart`, dan `user_detail.dart` memiliki struktur halaman yang hampir sama. Ketiga halaman ini menggunakan widget `Scaffold` dengan body `Center` yang memiliki child `ListView`. Children dari `ListView` tersebut disesuaikan dengan halaman detail yang dibuka. Akan tetapi, secara umum, isi dari `ListView` tersebut adalah `Container` yang berisi `Text` untuk menampilkan judul halaman, `Container` dengan child `Column` yang yang terdiri dari dua widget `Text` untuk menampilkan informasi, `Container` dengan child `Column` yang terdiri dari widget `Text` untuk menunjukkan judul informasi dan `LinearPercentIndicator` dari *library* `percent_indicator` untuk menampilkan informasi berapa persen dana yang terkumpul pada *page* `fundraising_detail.dart`, serta `Center` dengan child `CircleAvatar` untuk menampilkan foto profil pada *page* `user_detail.dart`.

**2. Donation**
- `donation_list.dart` menggunakan widget `Scaffold` dengan body widget `Center` dengan child berupa `Column` yang memiliki tiga `Expanded` sebagai children. `Expanded` pertama berisi judul halaman. `Expanded` kedua berisi `FutureBuilder` yang akan membangun suatu `ListView` dengan `ListView.builder` yang berisi suatu `Container` dengan `InkWell` untuk membuat `Container` tersebut bisa diklik. Setiap `InkWell` berisi suatu `Column` yang memiliki empat buah `Expanded`. Dua `Expanded` memiliki `Align` berisi `Text` sebagai child mereka (satu untuk keterangan nama donasi dan satu lagi untuk nama pembuka donasi) dan sisanya memiliki child `Row` dengan satu buah `Expanded` berisi `Text` sebagai children (satu untuk jumlah donasi yang dibutuhkan dan satu lagi untuk jumlah donasi yang sudah terkumpul). `Expanded` ketiga yang hanya tampil pada *user* yang terverifikasi berisi sebuah `Container` dengan child `Row` yang memiliki dua `TextButton` berisi `Text` sebagai children untuk tombol membuka donasi dan melihat donasi yang dibuka.
- `donation_detail.dart` menggunakan widget `Scaffold` dengan body widget `Center` dengan child berupa `ListView` yang memiliki sepuluh `Container` sebagai children. `Container` pertama memiliki satu child `Text` untuk judul halaman. `Container` kedua hingga kedelapan memiliki child `Column` dengan dua `Text` sebagai children. `Text` pertama untuk menampilkan keterangan data dan `Text` kedua untuk menampilkan datanya. Data yang ditampilkan adalah nama donasi, id donasi, pembuka donasi, deskripsi donasi, jumlah donasi yang dibutuhkan, jumlah donasi yang sudah terkumpul, dan jumlah donasi yang masih dibutuhkan. `Container` kesembilan berisi `Column` dengan children berupa `Text` untuk menampilkan keterangan dan `LinearPercentIndicator` sebagai sebuah indikator jumlah donasi yang sudah terkumpul. `Container` terakhir berisi sebuah `Column` dengan children berupa sebuah `Text` untuk menampilkan keterangan dan sebuah `Form` untuk melakukan donasi. `Form` tersebut memiliki `TextFormField` untuk mengisi jumlah donasi dan sebuah `TextButton` untuk melakukan submisi *form*.
- `opened_donation_list.dart` menggunakan widget `Scaffold` dengan body widget `Center` dengan child berupa `Column` yang memiliki dua`Expanded` sebagai children. `Expanded` pertama berisi judul halaman. `Expanded` kedua berisi `FutureBuilder` yang akan membangun suatu `ListView` dengan `ListView.builder` yang berisi suatu `Container` dengan child berupa suatu `Column` yang memiliki enam buah `Expanded`. Empat `Expanded` pertama yang secara berurutan digunakan untuk menampilkan data nama, deskripsi, jumlah yang dibutuhkan, dan jumlah yang sudah terkumpul dari suatu donasi memiliki child berupa `Align` yang memiliki child berupa `Text` untuk menampilkan data. `Expanded` kelima berisi sebuah `Text` berwarna yang menampilkan status verifikasi donasi tersebut. `Expanded` keenam memiliki child berupa `Align` dengan child berupa `TextButton` dengan child berupa `Text` yang digunakan untuk membuat suatu tombol untuk menutup donasi.
- `create_donation.dart` menggunakan widget `Scaffold` dengan body widget `Form` dengan child berupa `SingleChildScrollView` dengan child berupa `Container` dengan child berupa `Column`. `Column` tersebut memiliki children berupa tiga buah `Padding` sebagai *field* untuk *input user* dan satu buah `TextButton` untuk melakukan submisi *form*. `Padding` pertama berisi `TextFormField` sebagai isian untuk nama donasi. `Padding` kedua berisi `TextFormField` sebagai isian untuk deskripsi donasi. `Padding` ketiga berisi `TextFormField` sebagai isian untuk jumlah donasi yang dibutuhkan. `TextButton` memiliki sebuah child berupa `Text` sebagai keterangan `TextButton` tersebut.

**3. Blog**
- `blog_list.dart` menggunakan widget `Scaffold` dengan body widget menggunakan `FutureBuilder` yang akan membangun `ListView` yang digunakan untuk membuat *list* children dan menggunakan `ListView.builder` untuk membuat *children* secara rekursif tanpa menulis kode berulang kali.`SingleChildScrollView` untuk membuat layar *scrollable* sesuai dengan banyaknya data *blog* pada database. Objek blog akan dimasukkan ke dalam sebuah widget `card` yang menampilkan judul blog, tanggal dibuat blog, tombol upvote downvote yang menampilkan nilainya, konten blog secara singkat, dan sebuah button “Read More” yang ketika di klik akan membukan halaman detail dari blog. Tombol *upvote downvote* dan "Read More" ditempatkan di dalam widget `Row`. `Row` tersebut dan judul, tanggal, content dari dalam card tersimpan dalam widget `Container`. Tombol *upvote downvote* dan "Read More" menggunakan widget `InkWell` agar bisa memiliki fungsi `onTap()`. Page juga menggunakan widget import `ConvexAppBar` sebagai button navbar.
- `blog_details.dart` menggunakan widget `Scaffold` dengan body widget `SingleChildScrollView` yang memiliki child widget `Container` yang menyimpan widget `Column` yang menyimpan`Row` yang menyimpan judul dan *upvote downvote*. Tombol *upvote downvote* menggunakan widget `InkWell` agar bisa memiliki fungsi `onTap()`. Kemudian di kolom berikutnya berisikan content dari blog yang dituliskan oleh user yang disimpan di dalam widget `Flexible` agar bisa menyesuaikan sendiri dengan dimensi layar yang digunakan sehingga tidak terjadi overflow.
- `create_blog.dart` menggunakan widget `Scaffold` dengan body widget menggunakan widget `SingleChildScrollView` agar bisa scrollable apabila konten yang dituliskan pengguna panjang. Selain itu digunakan widget `Container` untuk menyimpan `Column` yang berisikan `TextFormField` yang akan digunakan sebagai tempat bagi pengguna untuk memasukkan input. Pada setiap `TextFormField` digunakan widget `InputDecoration` untuk memodifikasi *input field*-nya. Kemudian yang terakhir, digunakan widget `TextButton` sebagai *clickable* button yang digunakan untuk membuat *request post*. Page juga menggunakan widget import `ConvexAppBar` sebagai button navbar.
- `show_tag.dart` menggunakan widget `Scaffold` dengan body widget menggunakan `FutureBuilder` yang akan membangun `ListView` yang digunakan untuk membuat *list* children dan menggunakan `ListView.builder` untuk membuat `children` secara rekursif tanpa menulis kode berulang kali. Children dari listView tersebut ada `Container` yang menyimpan sebuah widget `Card` yang memiliki child `InkWell` agar ketika card dipencet maka akan diarahkan kepada *post* terkait dengan *tag* yang dicari oleh user. Page juga menggunakan widget import `ConvexAppBar` sebagai button navbar.
- `tag_page.dart` menggunakan widget yang sama persis dengan `blog_list.dart`.

**4. Foodsharing**
* `foodsharing_page.dart` menggunakan widget `Scaffold` dengan body widget `Center` dan child `Column` dengan *children* `Expanded`. Dalam `Expanded` tersebut terdapat child `Container` yang memiliki child `Column` yang berisikan *children* `Text` untuk welcoming text, `Expanded`, dan `Row` yang hanya akun muncul pada akun yang sudah terverifikasi. Pada `Expanded` berisikan `FutureBuilder` yang akan membangun `ListView` yang digunakan untuk membuat list *children* dan menggunakan `ListView.builder` dengan itemBuilder `GFCard` untuk menampilkan semua list food-sharing. Pada `GFCard` dimasukkan image dengan menggunakan `Image.network` menampilkan gambar dari website, lalu menggunakan `GFListTile` untuk menampilkan *author* dari post tersebut, lalu membungkus 4 buah`RichText` yang berfungsi untuk menampilkan *location, description, date,* dan *update date* dengan `Column`. Pada `Row` terdapat dua `TextButton` sebagai *children* dengan `Text` *Add Page* dan *See Own Post*.
* `add_foodsharing.dart` menggunakan widget `Scaffold` dengan body `Form` yang memiliki child `SingleChildScrollView` dengan child `Container` dan `Container` tersebut memiliki child `Column` dengan 4 buah `Padding` sebagai children. Tiga diantaranya digunakan untuk membungkus `TextFormField`, sisa 1 digunakan untuk `TextButton` dengan `Text`.
* `edit_foosharing.dart` menggunakan widget-widget yang sama dengan `add_foodsharing.dart`
* `own_post.dart` menggunakan widget-widget yang sama dengan `foodsharing_page` bedanya hanya pada `own_post.dart` tidak terdapat widget `Row`. Satu perbedaanya lagi adalah pada `own_post.dart` masing-masing `GFCard` memiliki `GFButtonBar` yang berisi dua `IconButton` sebagai *children* yaitu untuk fitur *delete* dan *edit*.

**5. CalorieTracker**
* `calorietracker_page.dart` menggunakan widget `Scaffold` dengan body widget yang menggunakan widget `Center` dengan children berupa `Expanded`. Dalam `Expanded` terdapat child `Container` yang memiliki child `Column` yang berisikan children `Text` untuk welcoming text, `ElevatedButton` untuk button informasi, `Padding` yang berisi child `TextButton` untuk button delete, serta `Expanded` yang berisikan `FutureBuilder` yang akan membangun `ListView` yang digunakan untuk membuat list children dan menggunakan `ListView.builder` dengan itemBuilder `Container` yang memiliki child berupa `ListTile` untuk menampilkan daftar kalori, dan yang terakhir `Container` dengan child `Row` untuk menyusun `TextButton` untuk button Add Calorie dan Reduce Calorie. Pada `ElevatedButton` untuk button informasi, jika ditekan maka akan muncul pop up yang dibuat dengan menggunakan `Dialog` dengan child `SizedBox` yang memiliki child `PageView`. `PageView` digunakan agar konten dapat ditampilkan dalam bentuk page yang discroll dengan arah vertikal. Pada `ListTile` yang menampilkan daftar kalori, terdapat 2 `iconButton` yaitu untuk edit dan delete. Jika `ListTile` ditekan maka akan muncul pop up yang dibuat dengan menggunakan `Dialog` dengan child `SizedBox` yang memiliki child `Column` dengan children `Padding` untuk membungkus text, `Icon`, `Richtext` untuk menampilkan detail informasi, serta sebuah `Container` dengan child `SingleChildScrollView` yang didalamnya terdapat child text untuk deskripsi, hal ini untuk mengantisipasi deskripsi panjang yang diinput oleh user agar tidak terjadi overflow.
* `addcalorie_page.dart` menggunakan widget `Scaffold` dengan body `Form` yang memiliki child `SingleChildScrollView` yang digunakan agar bisa di scroll jika input yang diberikan oleh user panjang. `SingleChildScrollView `memiliki child `Container`. Di dalam `Container` terdapat child `Column` yang berisikan 2 children `Padding` untuk membungkus `TextFormField`, 1 `SizedBox` dengan child `DropdownButtonFormField` dan 1 `Padding` untuk membungkus `TextButton` untuk button Add Calorie.
* `reducecalorie_page.dart` menggunakan widget `Scaffold` dengan body `Form` yang memiliki child `SingleChildScrollView` yang digunakan agar bisa di scroll jika input yang diberikan oleh user panjang. `SingleChildScrollView` memiliki child `Container`. Di dalam `Container` terdapat child `Column` yang berisikan 2 children `Padding` untuk membungkus TextFormField, dan `TextButton` untuk button Reduce Calorie.
* Untuk `edit_add.dart`, memanfaatkan widget-widget yang sama dengan yang ada pada `addcalorie_page.dart`. Sedangkan pada `edit_reduce.dart`, memanfaatkan widget-widget yang sama dengan yang ada pada `reducecalorie_page.dart`.

**6. Food Recipe**
* `recipe_page.dart` menggunakan widget `Scaffold` dengan body widget yang menggunakan widget `Center` dengan 2 buah widget `Expanded`. Widget `Expanded` pertama digunakan untuk menyimpan container dengan isi `BoxDecoration` dengan `ImageDecoration` serta `Text` untuk bagian judul halaman. Sedangkan `Expanded` kedua berisi future builder yang mengambil data resep makanan untuk ditampilkan dalam bentuk `ListView.builder`. Setelah itu juga terdapat widget `FloatingActionButton` untuk tombol navigasi ke page `add_recipe.dart`
* `add_recipe.dart` menggunakan widget `Scaffold` dengan body widget yang menggunakan widget `Column` yang berisi widget `Align` untuk judul page, `SizedBox` untuk jarak judul ke form, dan juga `Form`. Widget `Form` itu sendiri berisi 3 buah `TextFormField` untuk user menulis data yang akan diinput dan juga 1 buah `TextButton` yang berfungsi sebagai tombol submit form
* `recipe_details.dart` menggunakan widget `Scaffold` dengan body widget yang menggunakan widget `Center` yang berisikan 1 widget `Listview` untuk menampung data yang akan ditampilkan. Data berupa `Text` yang ditampilkan dalam `ListView` tersebut dikemas oleh sebuah widget `Column` yang berada di dalam widget `Container`.