0% menganggap dokumen ini bermanfaat (0 suara)
12 tayangan2 halaman

Rangkuman Mobile Programming Flutter Updated

Diunggah oleh

Muhammad Thorik
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)
12 tayangan2 halaman

Rangkuman Mobile Programming Flutter Updated

Diunggah oleh

Muhammad Thorik
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/ 2

1.

Introduction to Mobile Programming (P1):


- Platform dan Bahasa Pemrograman: Pengenalan tentang platform mobile utama, seperti Android
(menggunakan Java dan Kotlin) dan iOS (Swift dan Objective-C). Ada juga kerangka kerja multiplatform seperti
React Native dan Xamarin.
- Arsitektur Aplikasi: Model Client-Server dan arsitektur MVC (Model-View-Controller) banyak digunakan
dalam pengembangan aplikasi mobile. MVC memisahkan data, tampilan, dan logika kontrol.
- Tren Teknologi: Teknologi seperti AI, IoT, AR/VR, dan 5G memperkuat aplikasi mobile saat ini, meningkatkan
produktivitas, efisiensi, dan jangkauan pengguna.
- Diskusi: Mahasiswa diajak untuk mengeksplorasi aplikasi yang mereka gunakan serta
ketertarikan mereka dalam menciptakan aplikasi mobile sendiri.
2. Flutter (P2 - P3):
- Dasar Flutter: Flutter adalah kerangka kerja yang menggunakan bahasa Dart untuk membangun aplikasi mobile.
Aplikasi dibangun dengan memanfaatkan "widget" sebagai komponen utama UI. - Instalasi dan Pengaturan: Panduan
untuk menginstal SDK Flutter, mengatur lingkungan pengembangan dengan Android Studio atau VS Code, serta
penggunaan emulator atau perangkat fisik untuk pengujian.
- Jenis Widget: Flutter memiliki dua jenis widget, yaitu StatelessWidget untuk tampilan statis dan StatefulWidget
untuk tampilan yang dapat berubah sesuai interaksi pengguna.
- Siklus Hidup Widget: Flutter mengelola siklus hidup dari widget yang mencakup pembuatan,pembaruan, dan
penghancuran widget.
- Diskusi: Diskusi kelompok untuk memilih kasus final project yang akan dikerjakan, termasuk perencanaan
konsep aplikasinya.
Ringkasan ini memberikan gambaran mengenai pengantar pemrograman mobile dan dasar-dasar Flutter sebagai platform
pengembangan aplikasi mobile.
1. Konsep Widget pada Flutter:
- Flutter memiliki dua jenis widget utama: StatelessWidget dan StatefulWidget. StatelessWidget tidak memiliki
status yang berubah, sedangkan StatefulWidget dapat berubah seiring berjalannya
waktu melalui fungsi setState.
- Elemen-elemen widget ini membentuk struktur pohon (widget tree dan element tree) yang memungkinkan
pemrosesan UI secara hierarkis.
2. Navigator untuk Navigasi Layar:
- Navigator digunakan untuk berpindah antara halaman di aplikasi. Terdapat tiga jenis navigasiutama:
Push (menambahkan halaman baru di atas halaman yang ada), Pop (menutup halaman saat ini dan kembali ke
halaman sebelumnya), dan Replacement (mengganti halaman saat ini tanpa menambahkannya
ke dalam tumpukan).
- Navigator dapat dikombinasikan dengan Bottom Navigation Bar atau Drawer untukmempermudah navigasi.
3. Desain dan Dekorasi:
- BoxDecoration memungkinkan kustomisasi tampilan, seperti menambahkan border, bayangan,dan lainnya.
InputDecoration digunakan pada TextField atau TextFormField untuk menambahkan gaya, label, ikon, dan umpan
balik pengguna.
4. Bottom Navigation Bar dan Floating Action Button (FAB):
- Bottom Navigation Bar memungkinkan navigasi antar halaman utama. FAB adalah tombol yangmelayang di
layar untuk tindakan utama dan sering diletakkan di sudut kanan bawah.
- FAB perlu digunakan dengan hati-hati agar tidak mengganggu pengguna dengan terlalu banyaktombol di
layar.
5. Tab Bar, Drawer, dan ListView:
- TabBar dan TabBarView membantu navigasi antar halaman dengan cara menggeser layar kekiri atau kanan.
Drawer menyediakan menu navigasi yang muncul dari sisi layar, sedangkan ListView memungkinkan pembuatan
daftar yang dapat digulir.

Berikut adalah contoh sederhana dari StatelessWidget dan StatefulWidget di Flutter.

Contoh StatelessWidget
StatelessWidget tidak memiliki status yang bisa berubah. Cocok untuk tampilan statis yang tidak bergantung pada
interaksi pengguna.
import 'package:flutter/material.dart';

class MyStatelessWidget extends StatelessWidget {


@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: Text('Stateless Widget Example')),
body: Center(
child: Text('Hello, Stateless Widget!'),
),
);
}
}
void main() => runApp(MaterialApp(home: MyStatelessWidget()));
```

Penjelasan:
- Widget ini hanya menampilkan teks "Hello, Stateless Widget!" tanpa bisa berubah atau berinteraksi.
- Digunakan sebagai halaman sederhana yang tidak perlu mengelola status atau variabel dinamis.

Contoh StatefulWidget
StatefulWidget memiliki status yang bisa berubah, sering kali menggunakan `setState` untuk memperbarui UI.

```dart
import 'package:flutter/material.dart';

void main() => runApp(MaterialApp(home: CounterApp()));

class CounterApp extends StatefulWidget {


@override
_CounterAppState createState() => _CounterAppState();
}

class _CounterAppState extends State<CounterApp> {


int _counter = 0;

@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: Text('Stateful Widget Example')),
body: Center(
child: Text('Pressed: $_counter times', style: TextStyle(fontSize: 24)),
),
floatingActionButton: FloatingActionButton(
onPressed: () => setState(() => _counter++),
child: Icon(Icons.add),
),
);
}
}
```

Penjelasan:
- Fungsi `setState` sekarang menggunakan lambda untuk langsung menambah `_counter`.
- Hanya teks utama yang ditampilkan, tanpa kolom tambahan.

Anda mungkin juga menyukai