Berikut adalah kode Dart untuk aplikasi Flutter yang menampilkan jadwal pelajaran dari Senin hingga Jumat, di mana setiap pelajaran menampilkan nama guru, waktu, dan tempat pembelajaran. Data ditampilkan satu layar per hari, dengan navigasi menggunakan gesture geser (swipe) atau melalui menu navigasi tab bar.
### **Langkah-Langkah:**
1. **Buat Proyek Flutter Baru**:
Jika belum memiliki proyek Flutter, buat terlebih dahulu dengan perintah:
```
flutter create jadwal_pelajaran
cd jadwal_pelajaran
```
2. **Ganti Kode `lib/main.dart`**:
Gantilah isi file `lib/main.dart` dengan kode berikut ini:
```dart
import 'package:flutter/material.dart';
void main() {
runApp(JadwalPelajaranApp());
}
class JadwalPelajaranApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Jadwal Pelajaran',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: JadwalPelajaranHome(),
);
}
}
class JadwalPelajaranHome extends StatefulWidget {
@override
_JadwalPelajaranHomeState createState() => _JadwalPelajaranHomeState();
}
class _JadwalPelajaranHomeState extends State<JadwalPelajaranHome> with SingleTickerProviderStateMixin {
TabController? _tabController;
@override
void initState() {
super.initState();
_tabController = TabController(length: 5, vsync: this);
}
@override
void dispose() {
_tabController?.dispose();
super.dispose();
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Jadwal Pelajaran'),
bottom: TabBar(
controller: _tabController,
tabs: [
Tab(text: 'Senin'),
Tab(text: 'Selasa'),
Tab(text: 'Rabu'),
Tab(text: 'Kamis'),
Tab(text: 'Jumat'),
],
),
),
body: TabBarView(
controller: _tabController,
children: [
HariWidget(hari: 'Senin', pelajaran: jadwalPelajaran['Senin']!),
HariWidget(hari: 'Selasa', pelajaran: jadwalPelajaran['Selasa']!),
HariWidget(hari: 'Rabu', pelajaran: jadwalPelajaran['Rabu']!),
HariWidget(hari: 'Kamis', pelajaran: jadwalPelajaran['Kamis']!),
HariWidget(hari: 'Jumat', pelajaran: jadwalPelajaran['Jumat']!),
],
),
);
}
}
class HariWidget extends StatelessWidget {
final String hari;
final List<Map<String, String>> pelajaran;
HariWidget({required this.hari, required this.pelajaran});
@override
Widget build(BuildContext context) {
return ListView.builder(
itemCount: pelajaran.length,
itemBuilder: (context, index) {
final item = pelajaran[index];
return Card(
margin: EdgeInsets.all(8.0),
child: ListTile(
title: Text('${item['mata_pelajaran']}'),
subtitle: Text('Guru: ${item['guru']}\nWaktu: ${item['waktu']}\nTempat: ${item['tempat']}'),
),
);
},
);
}
}
final Map<String, List<Map<String, String>>> jadwalPelajaran = {
'Senin': [
{'mata_pelajaran': 'Matematika', 'guru': 'Bu Sari', 'waktu': '08:00 - 09:30', 'tempat': 'Kelas 12A'},
{'mata_pelajaran': 'Bahasa Indonesia', 'guru': 'Pak Budi', 'waktu': '09:45 - 11:15', 'tempat': 'Kelas 12B'},
],
'Selasa': [
{'mata_pelajaran': 'Fisika', 'guru': 'Pak Joko', 'waktu': '08:00 - 09:30', 'tempat': 'Lab Fisika'},
{'mata_pelajaran': 'Kimia', 'guru': 'Bu Lestari', 'waktu': '09:45 - 11:15', 'tempat': 'Lab Kimia'},
],
'Rabu': [
{'mata_pelajaran': 'Biologi', 'guru': 'Pak Dedi', 'waktu': '08:00 - 09:30', 'tempat': 'Lab Biologi'},
{'mata_pelajaran': 'Bahasa Inggris', 'guru': 'Bu Rina', 'waktu': '09:45 - 11:15', 'tempat': 'Kelas 12C'},
],
'Kamis': [
{'mata_pelajaran': 'Sejarah', 'guru': 'Pak Anto', 'waktu': '08:00 - 09:30', 'tempat': 'Kelas 12D'},
{'mata_pelajaran': 'Geografi', 'guru': 'Bu Ani', 'waktu': '09:45 - 11:15', 'tempat': 'Kelas 12E'},
],
'Jumat': [
{'mata_pelajaran': 'Ekonomi', 'guru': 'Pak Agus', 'waktu': '08:00 - 09:30', 'tempat': 'Kelas 12F'},
{'mata_pelajaran': 'Sosiologi', 'guru': 'Bu Fitri', 'waktu': '09:45 - 11:15', 'tempat': 'Kelas 12G'},
],
};
```
### **Penjelasan Kode:**
1. **TabController** digunakan untuk membuat tab navigasi antar hari.
2. **TabBar** digunakan untuk menampilkan tab navigasi di bagian atas, dengan label hari.
3. **TabBarView** digunakan untuk menampilkan konten berbeda pada tiap tab.
4. **HariWidget** adalah widget yang menerima daftar pelajaran untuk setiap hari dan menampilkannya dalam bentuk kartu (card) dengan ListTile.
5. **jadwalPelajaran** adalah variabel `Map` yang berisi jadwal untuk setiap hari. Setiap harinya memiliki daftar pelajaran yang terdiri dari mata pelajaran, nama guru, waktu, dan tempat.
### **Fitur:**
- **Navigasi TabBar**: Pengguna dapat berpindah hari dengan mengetuk tab di bagian atas.
- **Swipe Gesture**: Pengguna dapat menggeser ke kiri atau kanan untuk melihat jadwal hari berikutnya atau sebelumnya.
Aplikasi ini akan menampilkan jadwal pelajaran harian yang dapat dinavigasi dengan mudah menggunakan tab atau gesture geser (swipe).
Tidak ada komentar:
Posting Komentar