LAPORAN PRAKTIKUM PERTEMUAN KE – 14

“ CRUD ANDROID MENGGUNAKAN FLUTTER “

Disusun untuk memenuhi tugas pada mata kuliah:

Pemograman Berorientasi Objek

Dosen pengampu:
Supria,M.Kom

Ditulis oleh:
6103230001 – Fitria Nur Rahmah

Program Studi DIII Teknik Informatika

Jurursan Teknik Informatika
Politeknik Negeri Bengkalis

[2024]
 A. Kegiatan Praktikum
a. Persiapan Proyek Flutter
1. Buat proyek Flutter baru dengan perintah:
flutter create flutter_application_crud_file2
2. Buka proyek menggunakan editor kode pilihan Anda (VS Code atau Android Studio).
3. Tambahkan dependency untuk pengelolaan state jika diperlukan, seperti provider atau
setState bawaan Flutter.

b. Struktur Aplikasi
1. Buat folder baru di dalam proyek:
• models: untuk kelas data.
• screens: untuk file antarmuka pengguna.
• outils: untuk pengelolaan file .txt.
2. Buat file baru untuk manajemen CRUD:
• models/mhs.dart
• utils/file_helper.dart
• screens/home_screen.dart
• main.dart (biasanya sudah ada secara default)

C. Implementasi CRUD
1. Membuat Model Data
Buat file models/mhs.dart:
class Mhs {
String nim;
String nama;
String alamat;
String noHp;
Mhs(
{required this.nim,
required this.nama,
required this.alamat,
required this.noHp});
Map<String, dynamic> toJson() => {
'nim': nim,
'nama': nama,
 'alamat': alamat,
'noHp': noHp,
};
factory Mhs.fromJson(Map<String, dynamic> json) {
return Mhs(
nim: json['nim'],
nama: json['nama'],

alamat: json['alamat'],
noHp: json['noHp'],
);
}
}

Dokumetasi

2. Mengelola File
Buat file utils/file_helper.dart:
import 'package:flutter/material.dart';
import 'package:flutter_application_1_crud/models/mhs.dart';
import 'package:flutter_application_1_crud/utils/file_helper.dart';
class HomeScreen extends StatefulWidget {
@override
_HomeScreenState createState() => _HomeScreenState();
}
class _HomeScreenState extends State<HomeScreen> {
final _fileHelper = FileHelper('data.txt');
List<Mhs> persons = [];
@override
void initState() {
super.initState();
_loadPersons();
}

Future<void> _loadPersons() async {

final data = await _fileHelper.readFile();
setState(() {
persons = data.map((e) => Mhs.fromJson(e)).toList();
});
}
Future<void> _addPerson(
String nim, String nama, String alamat, String noHp) async {
final newPerson = Mhs(nim: nim, nama: nama, alamat: alamat, noHp: noHp);
setState(() {
persons.add(newPerson);
});
await _fileHelper.writeFile(persons.map((e) => e.toJson()).toList());
}
Future<void> _deletePerson(String nim) async {
setState(() {
persons.removeWhere((person) => person.nim == nim);
});
await _fileHelper.writeFile(persons.map((e) => e.toJson()).toList());
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('CRUD Flutter with File'),
),
body: ListView.builder(
itemCount: persons.length,
itemBuilder: (context, index) {
final person = persons[index];
return ListTile(
title: Text(person.nama),
subtitle: Text(
'NIM: ${person.nim}\nAlamat: ${person.alamat}\nNo HP: ${person.noHp}'),

trailing: IconButton(
icon: Icon(Icons.delete),
onPressed: () => _deletePerson(person.nim),
),
);
},
),
floatingActionButton: FloatingActionButton(
child: Icon(Icons.add),
onPressed: () {
showDialog(
context: context,
builder: (context) {
final nimController = TextEditingController();
final namaController = TextEditingController();
final alamatController = TextEditingController();
final noHpController = TextEditingController();
return AlertDialog(
title: Text('Add Person'),
content: Column(
mainAxisSize: MainAxisSize.min,
children: [
TextField(
controller: nimController,
decoration: InputDecoration(hintText: 'Enter NIM'),
),
TextField(
controller: namaController,
decoration: InputDecoration(hintText: 'Enter Nama'),
),
TextField(
controller: alamatController,
decoration: InputDecoration(hintText: 'Enter Alamat'),
),
TextField(
controller: noHpController,

decoration: InputDecoration(hintText: 'Enter No HP'),

),
],
),
actions: [
TextButton(
onPressed: () {
Navigator.of(context).pop();
},
child: Text('Cancel'),
),
TextButton(
onPressed: () {
_addPerson(
nimController.text,
namaController.text,
alamatController.text,
noHpController.text,
);
Navigator.of(context).pop();
},
child: Text('Add'),
),
],
);
},
);
},
),
);
}
}

Dokumentasi
3. Membuat Antarmuka Pengguna
Buat file screens/home_screen.dart:
import 'dart:io';
import 'dart:convert';
class FileHelper {
final String filePath;
FileHelper(this.filePath);
Future<File> _getFile() async {
return File(filePath);
}
Future<List<Map<String, dynamic>>> readFile() async {
try {
final file = await _getFile();
String contents = await file.readAsString();
return List<Map<String, dynamic>>.from(json.decode(contents));
} catch (e) {
return [];
}
}
Future<void> writeFile(List<Map<String, dynamic>> data) async {
final file = await _getFile();
await file.writeAsString(json.encode(data));
}

Dokumetasi
4. Menambahkan Fungsi Main
Rubah atau Tambahkan file main.dart:
import 'package:flutter/material.dart';
import 'package:flutter_application_1_crud/screens/home_screen.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'CRUD Flutter with File',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: HomeScreen(),
);
}
}

Dokumentasi
D. Menjalankan Aplikasi
1. Jalankan aplikasi menggunakan perintah:
flutter run
2. Tambahkan, lihat, dan hapus data untuk memastikan fitur CRUD berfungsi.
 B. Tugas Praktikum:
1. Tambahkan item email untuk menyimpan data email.

Menambahkan Email
a. Pada models/mhs.dart:
class Mhs {
String nim;
String nama;
String alamat;
String noHp;
String email; // Tambahkan kolom email

Mhs({required this.nim, required this.nama, required this.alamat, required

this.noHp, required this.email}); // Tambahkan email sebagai parameter

Map<String, dynamic> toJson() => {

'nim': nim,
'nama': nama,
'alamat': alamat,
'noHp': noHp,
'email': email, // Sertakan email dalam serialisasi
};

factory Mhs.fromJson(Map<String, dynamic> json) {

return Mhs(
nim: json['nim'],
nama: json['nama'],
alamat: json['alamat'],
noHp: json['noHp'],
email: json['email'], // Parsing email dari JSON
);
}
}
 b. utils/file_helper.dart:
import 'package:flutter/material.dart';
import 'package:flutter_application_1_crud/models/mhs.dart';
import 'package:flutter_application_1_crud/utils/file_helper.dart';

class HomeScreen extends StatefulWidget {

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

class _HomeScreenState extends State<HomeScreen> {

final _fileHelper = FileHelper('data.txt');
List<Mhs> persons = [];

@override
void initState() {
super.initState();
_loadPersons();
}

Future<void> _loadPersons() async {

final data = await _fileHelper.readFile();
setState(() {
persons = data.map((e) => Mhs.fromJson(e)).toList();
});
}
 Future<void> _addPerson(
String nim, String nama, String alamat, String noHp, String email) async
{
final newPerson = Mhs(
nim: nim, nama: nama, alamat: alamat, noHp: noHp, email: email);
setState(() {
persons.add(newPerson);
});
await _fileHelper.writeFile(persons.map((e) => e.toJson()).toList());
}

Future<void> _deletePerson(String nim) async {

setState(() {
persons.removeWhere((person) => person.nim == nim);
});
await _fileHelper.writeFile(persons.map((e) => e.toJson()).toList());
}

@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('CRUD Flutter with File'),
),
body: ListView.builder(
itemCount: persons.length,
itemBuilder: (context, index) {
final person = persons[index];
return ListTile(
title: Text(person.nama),
subtitle: Text(
'NIM: ${person.nim}\nAlamat: ${person.alamat}\nNo HP:
${person.noHp}\nEmail: ${person.email}'),
trailing: IconButton(
icon: Icon(Icons.delete),
onPressed: () => _deletePerson(person.nim),
),
);
},
),
floatingActionButton: FloatingActionButton(
child: Icon(Icons.add),
onPressed: () {
showDialog(
context: context,
builder: (context) {
final nimController = TextEditingController();
final namaController = TextEditingController();
final alamatController = TextEditingController();
final noHpController = TextEditingController();
final emailController = TextEditingController();
return AlertDialog(
title: Text('Add Person'),
content: Column(
mainAxisSize: MainAxisSize.min,
children: [
TextField(
controller: nimController,
decoration: InputDecoration(hintText: 'Enter NIM'),
),
TextField(
controller: namaController,
decoration: InputDecoration(hintText: 'Enter Nama'),
),
TextField(
controller: alamatController,
decoration: InputDecoration(hintText: 'Enter Alamat'),
),
TextField(
controller: noHpController,
decoration: InputDecoration(hintText: 'Enter No HP'),
),
TextField(
controller: emailController,
decoration: InputDecoration(hintText: 'Enter Email'),
),
],
),
actions: [
TextButton(
onPressed: () {
Navigator.of(context).pop();
},
child: Text('Cancel'),
),
TextButton(
onPressed: () {
_addPerson(
nimController.text,
 namaController.text,
alamatController.text,
noHpController.text,
emailController.text);
Navigator.of(context).pop();
},
child: Text('Add'),
),
],
);
},
);
},
),
);
}
}

Hasil akhirnya
 2. Tambahkan fitur untuk mengedit item yang sudah ada.
Menambahkan dan mengubah di bagian screens/home_screen.dart:

import 'package:flutter/material.dart';
import 'package:flutter_application_1_crud/models/mhs.dart';
import 'package:flutter_application_1_crud/utils/file_helper.dart';

class HomeScreen extends StatefulWidget {

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

class _HomeScreenState extends State<HomeScreen> {

final _fileHelper = FileHelper('data.txt');
List<Mhs> persons = [];

@override
void initState() {
super.initState();
_loadPersons();
}

Future<void> _loadPersons() async {

final data = await _fileHelper.readFile();
setState(() {
persons = data.map((e) => Mhs.fromJson(e)).toList();
});
}

Future<void> _addPersonDialog() async {

final nimController = TextEditingController();
final namaController = TextEditingController();
final alamatController = TextEditingController();
final noHpController = TextEditingController();
final emailController = TextEditingController();

showDialog(
context: context,
builder: (context) {
return AlertDialog(
title: Text('Add Person'),
content: Column(
mainAxisSize: MainAxisSize.min,
children: [
TextField(
controller: nimController,
decoration: InputDecoration(hintText: 'Enter NIM'),
),
TextField(
controller: namaController,
decoration: InputDecoration(hintText: 'Enter Nama'),
),
TextField(
controller: alamatController,
decoration: InputDecoration(hintText: 'Enter Alamat'),
),
TextField(
controller: noHpController,
decoration: InputDecoration(hintText: 'Enter No HP'),
),
TextField(
controller: emailController,
decoration: InputDecoration(hintText: 'Enter Email'),
),
],
),
actions: [
TextButton(
onPressed: () {
Navigator.of(context).pop();
},
child: Text('Cancel'),
),
TextButton(
onPressed: () {
_addPerson(
nimController.text,
namaController.text,
 alamatController.text,
noHpController.text,
emailController.text,
);
Navigator.of(context).pop();
},
child: Text('Add'),
),
],
);
},
);
}

Future<void> _addPerson(
String nim, String nama, String alamat, String noHp, String email) async
{
final newPerson = Mhs(
nim: nim, nama: nama, alamat: alamat, noHp: noHp, email: email);
setState(() {
persons.add(newPerson);
});
await _fileHelper.writeFile(persons.map((e) => e.toJson()).toList());
}

Future<void> _editPersonDialog(Mhs person) async {

final nimController = TextEditingController(text: person.nim);
final namaController = TextEditingController(text: person.nama);
final alamatController = TextEditingController(text: person.alamat);
final noHpController = TextEditingController(text: person.noHp);
final emailController = TextEditingController(text: person.email);

showDialog(
context: context,
builder: (context) {
return AlertDialog(
title: Text('Edit Person'),
content: Column(
mainAxisSize: MainAxisSize.min,
children: [
TextField(
controller: nimController,
decoration: InputDecoration(hintText: 'Enter NIM'),
),
TextField(
 controller: namaController,
decoration: InputDecoration(hintText: 'Enter Nama'),
),
TextField(
controller: alamatController,
decoration: InputDecoration(hintText: 'Enter Alamat'),
),
TextField(
controller: noHpController,
decoration: InputDecoration(hintText: 'Enter No HP'),
),
TextField(
controller: emailController,
decoration: InputDecoration(hintText: 'Enter Email'),
),
],
),
actions: [
TextButton(
onPressed: () {
Navigator.of(context).pop();
},
child: Text('Cancel'),
),
TextButton(
onPressed: () {
_editPerson(
person.nim,
nimController.text,
namaController.text,
alamatController.text,
noHpController.text,
emailController.text,
);
Navigator.of(context).pop();
},
child: Text('Save'),
),
],
);
},
);
}
 Future<void> _editPerson(String oldNim, String nim, String nama, String
alamat,
String noHp, String email) async {
setState(() {
final index = persons.indexWhere((person) => person.nim == oldNim);
if (index != -1) {
persons[index] = Mhs(
nim: nim,
nama: nama,
alamat: alamat,
noHp: noHp,
email: email,
);
}
});
await _fileHelper.writeFile(persons.map((e) => e.toJson()).toList());
}

Future<void> _deletePerson(String nim) async {

setState(() {
persons.removeWhere((person) => person.nim == nim);
});
await _fileHelper.writeFile(persons.map((e) => e.toJson()).toList());
}

@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('CRUD Flutter with File'),
),
body: ListView.builder(
itemCount: persons.length,
itemBuilder: (context, index) {
final person = persons[index];
return ListTile(
title: Text(person.nama),
subtitle: Text(
'NIM: ${person.nim}\nAlamat: ${person.alamat}\nNo HP:
${person.noHp}\nEmail: ${person.email}'),
trailing: Row(
mainAxisSize: MainAxisSize.min,
children: [
IconButton(
icon: Icon(Icons.edit),
 onPressed: () => _editPersonDialog(person),
),
IconButton(
icon: Icon(Icons.delete),
onPressed: () => _deletePerson(person.nim),
),
],
),
);
},
),
floatingActionButton: FloatingActionButton(
child: Icon(Icons.add),
onPressed: _addPersonDialog,
),
);
}
}

Dokumentsi
Hasil akhirnya
a. Before

b. after
 3. Jelaskan apa saja materi PBO yang digunakan dalam membuat aplikasi ini.

Penjelasan Konsep Pemrograman Berorientasi Objek (PBO)

1. Kelas (Class)

• Class adalah kerangka atau blueprint untuk membuat objek. Kelas mendefinisikan atribut
(properti) dan metode (fungsi) yang dimiliki oleh objek.
• Pada aplikasi ini, beberapa kelas digunakan untuk memodelkan data dan fungsionalitas:
➢ Kelas Mhs digunakan untuk merepresentasikan data mahasiswa. Atributnya
meliputi:
▪ nim: Nomor Induk Mahasiswa.
▪ nama: Nama mahasiswa.
▪ alamat: Alamat mahasiswa.
▪ noHp: Nomor HP mahasiswa.
▪ email: Email mahasiswa (ditambahkan pada versi yang dimodifikasi).
➢ Kelas FileHelper digunakan untuk mengelola operasi file, seperti membaca dan
menulis data ke dalam file data.txt.

2. Objek (Object)

• Object adalah instansiasi (realisasi) dari sebuah kelas. Setiap objek memiliki nilai unik
untuk atribut yang didefinisikan dalam kelas.
• Contoh:
➢ Objek mahasiswa dibuat dari kelas Mhs:

dart
Copy code
final newPerson = Mhs(nim: nim, nama: nama, alamat: alamat, noHp:
noHp, email: email);

➢ Objek newPerson ini memiliki data spesifik, seperti NIM dan email.

3. Konstruktor (Constructor)
 • Konstruktor adalah metode khusus dalam kelas yang dipanggil saat objek dibuat.
Tujuannya untuk menginisialisasi atribut kelas.
• Pada kelas Mhs, konstruktor memastikan setiap objek yang dibuat memiliki nilai untuk
semua atributnya:

Mhs({
required this.nim,
required this.nama,
required this.alamat,
required this.noHp,
required this.email
});

➢ Parameter required memastikan nilai harus diberikan ketika objek dibuat.

4. Enkapsulasi (Encapsulation)

• Enkapsulasi adalah proses membatasi akses langsung ke atribut atau metode tertentu
dalam kelas. Akses ini biasanya dikendalikan melalui metode khusus.
• Contoh:
➢ Pada kelas FileHelper, metode _getFile() bersifat privat (hanya digunakan di
dalam kelas):

Future<File> _getFile() async {

return File(filePath);
}

Hal ini memastikan pengguna kelas tidak dapat mengakses detail implementasi,
tetapi cukup menggunakan metode publik seperti readFile() dan writeFile().

5. Pewarisan (Inheritance)

• Inheritance adalah konsep di mana suatu kelas dapat mewarisi atribut dan metode dari
kelas lain.
• Dalam aplikasi ini:
➢ Kelas HomeScreen mewarisi dari StatefulWidget, sehingga dapat menggunakan
fitur widget dengan state yang dinamis.
➢ _HomeScreenState mewarisi dari State<HomeScreen>, sehingga dapat
mengakses metode bawaan seperti setState() untuk memperbarui UI.

6. Polimorfisme (Polymorphism)

• Polimorfisme memungkinkan metode yang sama untuk memiliki implementasi yang

berbeda, bergantung pada kelasnya.
• Contoh dalam aplikasi ini adalah metode build():
➢ Kelas _HomeScreenState mengoverride metode build() dari kelas induknya
(State):
 @override
Widget build(BuildContext context) {
...
}

Implementasi metode ini menampilkan UI yang sesuai untuk layar aplikasi.

7. Abstraksi (Abstraction)

• Abstraksi adalah konsep menyembunyikan detail implementasi dan hanya memberikan

akses pada fungsionalitas penting.
• Contoh:
➢ Penggunaan kelas FileHelper menyembunyikan detail implementasi membaca
dan menulis file. Pengguna hanya perlu memanggil metode readFile() atau
writeFile() tanpa tahu bagaimana file diakses secara teknis.

Kesimpulan

Aplikasi CRUD Android menggunakan Flutter ini sangat memanfaatkan konsep PBO untuk
menciptakan kode yang terstruktur, modular, dan mudah dipelihara. Beberapa materi yang
digunakan meliputi:

1. Kelas dan Objek untuk memodelkan data mahasiswa dan fungsionalitas aplikasi.
2. Konstruktor untuk memastikan setiap objek diinisialisasi dengan benar.
3. Enkapsulasi untuk membatasi akses langsung ke atribut dan menyembunyikan detail
implementasi.
4. Inheritance untuk menggunakan kembali fitur bawaan dari Flutter.
5. Polimorfisme untuk memungkinkan metode memiliki implementasi yang berbeda sesuai
kebutuhan.
6. Abstraksi untuk menyederhanakan akses terhadap fitur kompleks.

Penerapan konsep-konsep ini membuat aplikasi lebih fleksibel dan scalable. Dengan cara ini,
aplikasi dapat dengan mudah dimodifikasi, seperti menambahkan kolom baru (email) atau
menambah fitur baru (edit data).