tugass jadwal pelajaran sandi

📱 Aplikasi Jadwal Pelajaran Flutter dengan CRUD & UI Modern

Pada artikel ini, saya akan membagikan cara membuat aplikasi jadwal pelajaran menggunakan Flutter yang sudah dilengkapi fitur CRUD (Create, Read, Update, Delete) serta menggunakan database SQLite.


📦 Dependency

dependencies:
  flutter:
    sdk: flutter
  sqflite: ^2.3.0
  path: ^1.8.3
  

🧠 Model Schedule

class Schedule {
  int? id;
  String subject;
  String day;
  String time;
  String teacher;

Schedule({
this.id,
required this.subject,
required this.day,
required this.time,
required this.teacher,
});

Map toMap() {
return {
'id': id,
'subject': subject,
'day': day,
'time': time,
'teacher': teacher,
};
}

factory Schedule.fromMap(Map map) {
return Schedule(
id: map['id'],
subject: map['subject'],
day: map['day'],
time: map['time'],
teacher: map['teacher'],
);
}
} 

💾 Database Helper

import 'package:sqflite/sqflite.dart';
import 'package:path/path.dart';
import 'schedule.dart';

class DBHelper {
static Database? _db;

Future get db async {
if (_db != null) return _db!;
_db = await initDB();
return _db!;
}

initDB() async {
String path = join(await getDatabasesPath(), 'schedule.db');
return await openDatabase(
path,
version: 1,
onCreate: (db, version) async {
await db.execute('''
CREATE TABLE schedule(
id INTEGER PRIMARY KEY AUTOINCREMENT,
subject TEXT,
day TEXT,
time TEXT,
teacher TEXT
)
''');
},
);
}

Future insert(Schedule s) async {
final dbClient = await db;
return await dbClient.insert('schedule', s.toMap());
}

Future> getAll() async {
final dbClient = await db;
final res = await dbClient.query('schedule');
return res.map((e) => Schedule.fromMap(e)).toList();
}

Future update(Schedule s) async {
final dbClient = await db;
return await dbClient.update(
'schedule',
s.toMap(),
where: 'id=?',
whereArgs: [s.id],
);
}

Future delete(int id) async {
final dbClient = await db;
return await dbClient.delete(
'schedule',
where: 'id=?',
whereArgs: [id],
);
}
} 

🎨 UI Flutter (Main App)

import 'package:flutter/material.dart';
import 'db_helper.dart';
import 'schedule.dart';

void main() {
runApp(MyApp());
}

class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
debugShowCheckedModeBanner: false,
title: 'Jadwal Pelajaran',
theme: ThemeData(
primaryColor: Colors.blue,
),
home: HomePage(),
);
}
}

class HomePage extends StatefulWidget {
@override
_HomePageState createState() => _HomePageState();
}

class _HomePageState extends State {
DBHelper db = DBHelper();
List list = [];

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

refresh() async {
list = await db.getAll();
setState(() {});
}

showForm({Schedule? s}) {
TextEditingController subject = TextEditingController(text: s?.subject);
TextEditingController day = TextEditingController(text: s?.day);
TextEditingController time = TextEditingController(text: s?.time);
TextEditingController teacher = TextEditingController(text: s?.teacher);

```
showModalBottomSheet(
  context: context,
  isScrollControlled: true,
  builder: (_) => Padding(
    padding: EdgeInsets.all(20),
    child: Column(
      mainAxisSize: MainAxisSize.min,
      children: [
        TextField(controller: subject, decoration: InputDecoration(labelText: "Mata Pelajaran")),
        TextField(controller: day, decoration: InputDecoration(labelText: "Hari")),
        TextField(controller: time, decoration: InputDecoration(labelText: "Jam")),
        TextField(controller: teacher, decoration: InputDecoration(labelText: "Guru")),
        SizedBox(height: 20),
        ElevatedButton(
          onPressed: () async {
            if (s == null) {
              await db.insert(Schedule(
                subject: subject.text,
                day: day.text,
                time: time.text,
                teacher: teacher.text,
              ));
            } else {
              await db.update(Schedule(
                id: s.id,
                subject: subject.text,
                day: day.text,
                time: time.text,
                teacher: teacher.text,
              ));
            }
            Navigator.pop(context);
            refresh();
          },
          child: Text("Simpan"),
        )
      ],
    ),
  ),
);
```

}

@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text("Jadwal Pelajaran"),
),
body: ListView.builder(
itemCount: list.length,
itemBuilder: (_, i) {
final s = list[i];
return Card(
child: ListTile(
title: Text(s.subject),
subtitle: Text("${s.day} - ${s.time}"),
trailing: Row(
mainAxisSize: MainAxisSize.min,
children: [
IconButton(
icon: Icon(Icons.edit),
onPressed: () => showForm(s: s),
),
IconButton(
icon: Icon(Icons.delete),
onPressed: () async {
await db.delete(s.id!);
refresh();
},
),
],
),
),
);
},
),
floatingActionButton: FloatingActionButton(
child: Icon(Icons.add),
onPressed: () => showForm(),
),
);
}
} 

📝 Penutup

Dengan adanya source code di atas, kamu bisa langsung membuat aplikasi jadwal pelajaran berbasis Flutter dengan fitur lengkap dan tampilan modern.

Semoga bermanfaat 🙌 Jangan lupa share!

Komentar

Postingan populer dari blog ini

code dart flutter layout responsif dan navigasi