Assalamualaikum Wr. Wb
Teman teman kali ini kita akan membuat sebuah aplikasi CRUD sederhana dengan menggunakan SQFLite, sebelum masuk pada langkah-langkah dalam membuat lebih baik kita mengetahui apa itu SQFLite.
Jadi ,SQFLite merupakan salah satu jenis RDBMS yang memiliki ukuran pustaka yang relatif kecil, dituls dengan menggunakan bahasa C. SQFLite ini merupakakn proyek yang bersifat public domain.
Baiklah yuk kita lnjut di langkah-langkah membuat aplikasinya
1. Buat proyek baru
3. Atur main.dart seperti dibuat seperti dibawah ini
import 'package:tugas1_s5/create.dart';
import 'package:tugas1_s5/database_instance.dart';
import 'package:tugas1_s5/product_model.dart';
import 'package:tugas1_s5/update.dart';
import 'package:flutter/material.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({super.key});
@override
Widget build(BuildContext context) {
return MaterialApp(
debugShowCheckedModeBanner: false,
title: 'Flutter Demo',
home: const MyHomePage(title: 'Daftar Produk :)'),
);
}
}
class MyHomePage extends StatefulWidget {
const MyHomePage({super.key, required this.title});
final String title;
@override
State<MyHomePage> createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
DatabaseInstance? databaseInstance;
Future _refresh() async {
setState(() {});
}
Future initDatabase() async {
await databaseInstance!.database();
setState(() {});
}
@override
void initState() {
databaseInstance = DatabaseInstance();
initDatabase();
super.initState();
}
Future delete(id) async {
await databaseInstance!.delete(id);
setState(() {});
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
backgroundColor: Colors.blue,
title: Text(widget.title),
actions: [
IconButton(
onPressed: () {
Navigator.push(context, MaterialPageRoute(builder: (builder) {
return CreatedDb();
}));
},
icon: Icon(Icons.add))
],
),
body: RefreshIndicator(
onRefresh: _refresh,
child: databaseInstance != null
? FutureBuilder<List<ProductModel>>(
future: databaseInstance!.all(),
builder: (context, snapshot) {
if (snapshot.data!.length == 0) {
return Center(
child: Text(
'Data Masih Kosong',
style: TextStyle(
fontSize: 40, fontWeight: FontWeight.bold),
),
);
}
if (snapshot.hasData) {
return ListView.builder(
itemCount: snapshot.data!.length,
itemBuilder: (context, index) {
return ListTile(
title: Text(snapshot.data![index].name ?? ''),
subtitle:
Text(snapshot.data![index].category ?? ''),
leading: IconButton(
onPressed: () {
Navigator.push(context,
MaterialPageRoute(builder: (builder) {
return UpdateDb(
productModel: snapshot.data![index],
);
}));
},
icon: Icon(Icons.edit)),
trailing: IconButton(
onPressed: () =>
delete(snapshot.data![index].id!),
icon: Icon(Icons.delete)),
);
},
);
} else {
return Center(
child: CircularProgressIndicator(color: Colors.green),
);
}
},
)
: Center(
child: CircularProgressIndicator(color: Colors.green),
),
));
}
}
4. Selanjutnya buat sebuah database_instance. dart yang sebagi databasenya yaitu kita amengimplementasikan SQFLitenya
import 'dart:io';
import 'package:tugas1_s5/product_model.dart';
import 'package:sqflite/sqflite.dart';
import 'package:path_provider/path_provider.dart';
import 'package:path/path.dart';
class DatabaseInstance {
final String _databaseName = 'my_database.db';
final int _databaseVersion = 1;
// tabel
final String table = 'product';
final String id = 'id';
final String name = 'name';
final String category = 'category';
final String createdAt = 'created_at';
final String updatedAt = 'updated_at';
Database? _database;
Future<Database> database() async {
if (_database != null) return _database!;
_database = await _initDatabase();
return _database!;
}
Future _initDatabase() async {
Directory documentsDirectory = await getApplicationDocumentsDirectory();
String path = join(documentsDirectory.path, _databaseName);
return openDatabase(path, version: _databaseVersion, onCreate: _onCreate);
}
Future _onCreate(Database db, int version) async {
await db.execute(
'CREATE TABLE $table ($id INTEGER PRIMARY KEY, $name TEXT NULL, $category TEXT NULL, $createdAt TEXT NULL, $updatedAt TEXT NULL)');
}
Future<List<ProductModel>> all() async {
final data = await _database!.query(table);
List<ProductModel> result =
data.map((e) => ProductModel.fromJson(e)).toList();
print(result);
return result;
}
Future<int> insert(Map<String, dynamic> row) async {
final query = await _database!.insert(table, row);
return query;
}
Future<int> update(int idParams, Map<String, dynamic> row) async {
final query = await _database!
.update(table, row, where: 'id = ?', whereArgs: [idParams]);
return query;
}
Future delete(int idParams) async {
await _database!.delete(table, where: 'id = ?', whereArgs: [idParams]);
}
}
5. Lalu buat sebuah file dengan nama create.dart yang berfungsi untung mengisi datanya
import 'package:tugas1_s5/database_instance.dart';
import 'package:flutter/material.dart';
class CreatedDb extends StatefulWidget {
const CreatedDb({super.key});
@override
State<CreatedDb> createState() => _CreatedDbState();
}
class _CreatedDbState extends State<CreatedDb> {
DatabaseInstance databaseInstance = DatabaseInstance();
TextEditingController nameController = TextEditingController();
TextEditingController categoryController = TextEditingController();
@override
void initState() {
databaseInstance.database();
super.initState();
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
backgroundColor: Colors.blue,
title: Text('Halaman Create'),
),
body: Padding(
padding: const EdgeInsets.all(25),
child: Column(crossAxisAlignment: CrossAxisAlignment.start, children: [
SizedBox(
height: 20,
),
Text('Nama Produk'),
TextField(
controller: nameController,
),
SizedBox(
height: 20,
),
Text('Kategori'),
TextField(
controller: categoryController,
),
SizedBox(
height: 20,
),
ElevatedButton(
onPressed: () async {
await databaseInstance.insert({
'name': nameController.text,
'category': categoryController.text,
'created_at': DateTime.now().toString(),
'updated_at': DateTime.now().toString()
});
Navigator.pop(context);
setState(() {});
},
child: Text('SUBMIT'))
]),
),
);
}
}
6. Selanjutnya buat file update.dart dan untuk deletenya dia sudah berada dalam file main.dart yaa
import 'package:tugas1_s5/database_instance.dart';
import 'package:tugas1_s5/product_model.dart';
import 'package:flutter/material.dart';
class UpdateDb extends StatefulWidget {
final ProductModel? productModel;
const UpdateDb({super.key, this.productModel});
@override
State<UpdateDb> createState() => _UpdateDbState();
}
class _UpdateDbState extends State<UpdateDb> {
DatabaseInstance databaseInstance = DatabaseInstance();
TextEditingController nameController = TextEditingController();
TextEditingController categoryController = TextEditingController();
@override
void initState() {
databaseInstance.database();
nameController.text = widget.productModel!.name ?? '';
categoryController.text = widget.productModel!.category ?? '';
super.initState();
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
backgroundColor: Colors.blue,
title: Text('Halaman Update'),
),
body: Padding(
padding: const EdgeInsets.all(25),
child: Column(crossAxisAlignment: CrossAxisAlignment.start, children: [
SizedBox(
height: 20,
),
Text('Nama Produk'),
TextField(
controller: nameController,
),
SizedBox(
height: 20,
),
Text('Kategori'),
TextField(
controller: categoryController,
),
SizedBox(
height: 20,
),
ElevatedButton(
onPressed: () async {
await databaseInstance.update(widget.productModel!.id!, {
'name': nameController.text,
'category': categoryController.text,
'updated_at': DateTime.now().toString()
});
Navigator.pop(context);
setState(() {});
},
child: Text('SUBMIT'))
]),
),
);
}
}
Dibawah ini hasilnya :
Baiklah sekian aplikasi sederhana CRUD menggunakan SQFLite, semoga bisa membantu dan semoga bisa menambha pengetahuan anda.
Sekian Assalamualaikum Wr. Wb :)
Komentar
Posting Komentar