Sela Repository Project Flutter

 Berikut contoh dasar kode program Flutter untuk aplikasi To-Do List dengan fitur CRUD (Create, Read, Update, Delete) menggunakan SQLite. Kita akan gunakan `sqflite` dan `path_provider`.


---


### **Langkah 1: Tambahkan Dependency di `pubspec.yaml`**


```yaml

dependencies:

  flutter:

    sdk: flutter

  sqflite: ^2.3.0

  path_provider: ^2.0.15

```


---


### **Langkah 2: Buat Model Todo**


```dart

// models/todo.dart

class Todo {

  int? id;

  String title;

  String description;


  Todo({this.id, required this.title, required this.description});


  Map<String, dynamic> toMap() {

    return {

      'id': id,

      'title': title,

      'description': description,

    };

  }


  factory Todo.fromMap(Map<String, dynamic> map) {

    return Todo(

      id: map['id'],

      title: map['title'],

      description: map['description'],

    );

  }

}

```


---


### **Langkah 3: Buat Helper SQLite**


```dart

// db/database_helper.dart

import 'package:sqflite/sqflite.dart';

import 'package:path/path.dart';

import '../models/todo.dart';


class DatabaseHelper {

  static final DatabaseHelper _instance = DatabaseHelper._();

  static Database? _database;


  DatabaseHelper._();


  factory DatabaseHelper() => _instance;


  Future<Database> get database async {

    return _database ??= await _initDb();

  }


  Future<Database> _initDb() async {

    final dbPath = await getDatabasesPath();

    final path = join(dbPath, 'todo.db');


    return await openDatabase(path, version: 1, onCreate: _onCreate);

  }


  Future _onCreate(Database db, int version) async {

    await db.execute('''

      CREATE TABLE todos(

        id INTEGER PRIMARY KEY AUTOINCREMENT,

        title TEXT,

        description TEXT

      )

    ''');

  }


  Future<int> insertTodo(Todo todo) async {

    final db = await database;

    return await db.insert('todos', todo.toMap());

  }


  Future<List<Todo>> getTodos() async {

    final db = await database;

    final maps = await db.query('todos');

    return List.generate(maps.length, (i) => Todo.fromMap(maps[i]));

  }


  Future<int> updateTodo(Todo todo) async {

    final db = await database;

    return await db.update(

      'todos',

      todo.toMap(),

      where: 'id = ?',

      whereArgs: [todo.id],

    );

  }


  Future<int> deleteTodo(int id) async {

    final db = await database;

    return await db.delete('todos', where: 'id = ?', whereArgs: [id]);

  }

}

```


---


### **Langkah 4: Buat UI Sederhana di `main.dart`**


```dart

// main.dart

import 'package:flutter/material.dart';

import 'db/database_helper.dart';

import 'models/todo.dart';


void main() {

  runApp(MyApp());

}


class MyApp extends StatelessWidget {

  @override

  Widget build(BuildContext context) {

    return MaterialApp(

      title: 'To-Do List',

      home: TodoListPage(),

    );

  }

}


class TodoListPage extends StatefulWidget {

  @override

  _TodoListPageState createState() => _TodoListPageState();

}


class _TodoListPageState extends State<TodoListPage> {

  final dbHelper = DatabaseHelper();

  List<Todo> todos = [];


  final titleController = TextEditingController();

  final descController = TextEditingController();


  void refreshTodos() async {

    final data = await dbHelper.getTodos();

    setState(() {

      todos = data;

    });

  }


  void addOrUpdateTodo([Todo? todo]) async {

    if (todo == null) {

      await dbHelper.insertTodo(Todo(

        title: titleController.text,

        description: descController.text,

      ));

    } else {

      await dbHelper.updateTodo(Todo(

        id: todo.id,

        title: titleController.text,

        description: descController.text,

      ));

    }


    titleController.clear();

    descController.clear();

    Navigator.of(context).pop();

    refreshTodos();

  }


  void showForm([Todo? todo]) {

    if (todo != null) {

      titleController.text = todo.title;

      descController.text = todo.description;

    } else {

      titleController.clear();

      descController.clear();

    }


    showDialog(

      context: context,

      builder: (_) => AlertDialog(

        title: Text(todo == null ? 'Tambah To-Do' : 'Edit To-Do'),

        content: Column(

          mainAxisSize: MainAxisSize.min,

          children: [

            TextField(controller: titleController, decoration: InputDecoration(labelText: 'Judul')),

            TextField(controller: descController, decoration: InputDecoration(labelText: 'Deskripsi')),

          ],

        ),

        actions: [

          TextButton(onPressed: () => Navigator.of(context).pop(), child: Text('Batal')),

          ElevatedButton(onPressed: () => addOrUpdateTodo(todo), child: Text('Simpan')),

        ],

      ),

    );

  }


  void deleteTodo(int id) async {

    await dbHelper.deleteTodo(id);

    refreshTodos();

  }


  @override

  void initState() {

    super.initState();

    refreshTodos();

  }


  @override

  Widget build(BuildContext context) {

    return Scaffold(

      appBar: AppBar(title: Text('To-Do List')),

      body: ListView.builder(

        itemCount: todos.length,

        itemBuilder: (_, i) {

          final todo = todos[i];

          return ListTile(

            title: Text(todo.title),

            subtitle: Text(todo.description),

            trailing: Row(

              mainAxisSize: MainAxisSize.min,

              children: [

                IconButton(icon: Icon(Icons.edit), onPressed: () => showForm(todo)),

                IconButton(icon: Icon(Icons.delete), onPressed: () => deleteTodo(todo.id!)),

              ],

            ),

          );

        },

      ),

      floatingActionButton: FloatingActionButton(

        onPressed: () => showForm(),

        child: Icon(Icons.add),

      ),

    );

  }

}

```


---


Kalau kamu butuh versi yang diatur lebih rapi per folder (`screens`, `widgets`, dll.) atau mau ditambahkan fitur seperti pencarian, status selesai, filter, dan lain-lain, tinggal bilang aja ya!

Komentar

Postingan populer dari blog ini

Membuat Aplikasi Absensi dengan Flutter & MockAPI

πŸ’‘ Ingin Web Kamu Lebih Interaktif? Tambahkan Map, Rute, & WhatsApp Sekali Klik!

Aplikasi Kantin Sekolah Digital: Mini Project Flutter untuk Transaksi Makanan di Sekolah