Pular para o conteúdo principal

Flutter SQFLite Tutorial e CRUD Exemplos

Tutorial e exemplos de Flutter SQFlite

Como trabalhar com base de dados SQLite em flutter.

O que é Flutter?

Flutter é o aplicativo móvel SDK do Google para criar interfaces nativas de alta qualidade em iOS e Android em tempo recorde.

Flutter trabalha com código existente, é usado por desenvolvedores e organizações ao redor do mundo, e é gratuito e de código aberto.

Aqui estão as três principais características do Flutter:

**1. Desenvolvimento rápido***.

Flutter pode dar vida a sua aplicação em milissegundos através de Reload quente.

Você pode utilizar um rico conjunto de widgets totalmente personalizáveis para construir interfaces nativas em minutos.

2. UI Expressivo e Flexível

A flutter permite que você envie rapidamente recursos com foco em experiências de usuários finais nativos.

A arquitetura em camadas permite total customização, o que resulta em uma renderização incrivelmente rápida e projetos expressivos e flexíveis.

**3. Desempenho nativo***

Os widgets da Flutter incorporam todas as diferenças críticas de plataforma, tais como rolagem, navegação, ícones e fontes para fornecer desempenho nativo completo tanto no iOS quanto no Android.

O que é SQFlite?

SQflite é um plug-in para flutter. Ele nos permite armazenar, recuperar e manipular nossos bancos de dados SQLite via código de flutter. SQflite suporta ambas as plataformas Android e iOS.

Aqui estão algumas das características do SQFlite:

  1. SQFlite fornece tanto para transações de banco de dados quanto para lotes.
  2. SQlite possui gerenciamento de versão automática embutido.
  3. SQFlite fornece métodos fáceis de usar para inserção, consulta, atualização e exclusão de dados do banco de dados.
  4. Estas operações CRUD são realizadas em segundo plano tanto no iOS como no Android. Isto libera a IU para permanecer responsiva.

Como instalar o SQFlite

A instalação do SQFlite é tão fácil quanto qualquer outro pacote de flutter. Está hospedado em Dart Package Repository e pode ser adicionado como uma dependência.

Para fazer isso:

1. Vá para seu arquivo pubspec.yaml:

e adicione-a como uma dependência:

dependencies:
sqflite: ^0.12.1

Você pode verificar a versão mais recente aqui.

**2. Faça o download***.

O Android Studio fornecerá a você um botão de "pegar o pacote" que o buscará e acrescentará ao seu projeto enquanto você estiver online.

Se você estiver utilizando o código Visual Studio, então fazer uma alteração no arquivo pubspec.yaml' fará com que o comando flutter packages get' seja automaticamente invocado.

Caso contrário, se você não estiver utilizando as IDEs acima, então você pode instalá-lo a partir da linha de comando

$ flutter packages get

**3. Importação para o seu projeto***.

Vá até seu código de dardo onde você quer usá-lo e importe-o na parte superior de seu arquivo.

import 'package:sqflite/sqflite.dart';

Banco de Dados SQFLite Quick Flutter HowTo Snippets

1. Como obter o Database Path

        // Check if we have an existing copy first
var databasesPath = await getDatabasesPath();
String path = join(databasesPath, "demo_asset_example.db");

2. Como abrir um banco de dados

        // try opening (will work if it exists)
Database db;
try {
db = await openDatabase(path, readOnly: true);
} catch (e) {
print("Error $e");
}

Você pode colocar em uma aula de ajuda:

class Helper {
final String path;
Helper(this.path);
Database _db;
final _lock = Lock();

Future<Database> getDb() async {
if (_db == null) {
await _lock.synchronized(() async {
// Check again once entering the synchronized block
if (_db == null) {
_db = await openDatabase(path);
}
});
}
return _db;
}

Ou:

  Future<Database> get db async {
if (_db != null) return _db;
_db = await initDb();
return _db;
}

onde initDb() é um método personalizado para nos obter o caminho e abri-lo como:

  initDb() async {
io.Directory documentsDirectory = await getApplicationDocumentsDirectory();
String path = join(documentsDirectory.path, "test.db");
var theDb = await openDatabase(path, version: 1, onCreate: _onCreate);
return theDb;
}

3. Como criar uma tabela de banco de dados

Vamos ver como podemos criar uma tabela de banco de dados com S

      var db = await openDatabase(path);
await db.execute("CREATE TABLE IF NOT EXISTS Test(id INTEGER PRIMARY KEY)");

ou:

  void _onCreate(Database db, int version) async {
// When creating the db, create the table
await db.execute(
"CREATE TABLE Employee(id INTEGER PRIMARY KEY, firstname TEXT, lastname TEXT, mobileno TEXT,emailId TEXT )");
print("Created tables");
}

O db é o objeto base de dados. Invocamos o método "execute()execute() e passamos em nossa declaração de sql bruto para nos criar a tabela.

4. Como inserir em uma tabela de banco de dados

      await db.insert("Test", {"id": 1});

ou:

  Future<int> insertTodo(Todo todo) async {
Database db = await this.db;
var result = await db.insert(tblTodo, todo.toMap());
return result;
}

ou digamos que eu quero inserir uma Pessoa com suas propriedades no Banco de Dados, e depois devolver a pessoa inserida:

  Future insertPerson(Person person) async {
person.id = await _db.insert("people", person.toMap());
return person;
}

ou

  Future insertPerson(Person person) async {
person.id = await _db.insert("people", person.toMap());
return person;
}

5. Como Consultar ou Selecionar da Tabela SQLite

      await db.query("Test")

Digamos que quero devolver uma seleção e devolver uma lista de pessoas do banco de dados:

    Future fetchEveryone() async {
List results = await _db.query("people", columns: Person.columns);
List people = new List();
results.forEach((map) {
people.add(Person.fromMap(map));
});
return people;
}

Ou digamos que queremos consultar uma lista de nosso banco de dados SQlite em flutter e povoar uma Lista. Também podemos utilizar uma consulta em bruto utilizando o método "rawQuery". Você passa para ela a declaração SQL a ser executada.

  Future<List<Employee>> getEmployees() async {
var dbClient = await db;
List<Map> list = await dbClient.rawQuery('SELECT * FROM Employee');
List<Employee> employees = new List();
for (int i = 0; i < list.length; i++) {
employees.add(new Employee(list[i]["firstname"], list[i]["lastname"], list[i]["mobileno"], list[i]["emailid"]));
}
print(employees.length);
return employees;
}

Ou outro exemplo:

  Future<List> getTodos() async {
Database db = await this.db;
var result = await db.rawQuery("SELECT * FROM $tblTodo ORDER BY $colPriority ASC");
return result;
}

Digamos que eu quero verificar se um usuário está logado:

  Future<bool> isLoggedIn() async {
var dbClient = await db;
var res = await dbClient.query("User");
return res.length > 0 ? true : false;
}

7 . Como contar o número de itens no SQLite

  Future<int> getCount() async {
Database db = await this.db;
var result = Sqflite.firstIntValue(
await db.rawQuery("SELECT COUNT (*) FROM $tblTodo")
);
return result;
}

7. Como atualizar dados no banco de dados SQLite usando o SQFLite

  Future<int> updateTodo(Todo todo) async {
var db = await this.db;
var result = await db.update(tblTodo, todo.toMap(),
where: "$colId = ?", whereArgs: [todo.id]);
return result;
}

7. Como excluir do banco de dados SQLite usando SQFLite

  Future<int> deleteTodo(int id) async {
int result;
var db = await this.db;
result = await db.rawDelete('DELETE FROM $tblTodo WHERE $colId = $id');
return result;
}

Ou:

  Future<int> deleteUsers() async {
var dbClient = await db;
int res = await dbClient.delete("User");
return res;
}

6. Como fechar o banco de dados

      await db.close();

Ou:

  Future close() async {
await _db.close();
}

Exemplos completos

Vejamos agora alguns exemplos completos envolvendo a Flutter SQFlite.

(a). Flutter SQFLite - INSERT,SELECT,SHOW

Este é um simples Tutorial de Exemplo de Dart Flutter demonstrando como realizar CRUD básico: Inserir, Selecionar e Mostrar dados em uma aplicação de flutter. Estaremos utilizando o plugin SQLite SQFLite. Isto porque nosso banco de dados é o SQLite

Projeto Exemplo Completo

Aqui está o código fonte completo.

(a). pubspec.yaml

Nossas dependências:

dependencies:
flutter:
sdk: flutter

cupertino_icons: ^0.1.2
path_provider: '>=0.3.0'
sqflite: any

dev_dependencies:
flutter_test:
sdk: flutter

(b). dardo.de funcionário

Uma classe de dardos para representar um único funcionário com nome, sobrenome, número de celular e e-mail como propriedades. Estes imóveis serão recebidos através do construtor:

class Employee {
String firstName;
String lastName;
String mobileNo;
String emailId;

Employee(this.firstName, this.lastName, this.mobileNo, this.emailId);
Employee.fromMap(Map map) {
firstName = map[firstName];
lastName = map[lastName];
mobileNo = map[mobileNo];
emailId = map[emailId];
}
}

(c). dbhelper.dart

Uma classe DBHelper para ajudar com a implementação de operações de base de dados em bruto:

import 'dart:async';
import 'dart:io' as io;
import 'package:path/path.dart';
import 'package:sqflite/sqflite.dart';
import 'package:path_provider/path_provider.dart';
import 'package:flutter_crud/model/employee.dart';

class DBHelper {
static Database _db;

Future<Database> get db async {
if (_db != null) return _db;
_db = await initDb();
return _db;
}

initDb() async {
io.Directory documentsDirectory = await getApplicationDocumentsDirectory();
String path = join(documentsDirectory.path, "test.db");
var theDb = await openDatabase(path, version: 1, onCreate: _onCreate);
return theDb;
}

void _onCreate(Database db, int version) async {
// When creating the db, create the table
await db.execute(
"CREATE TABLE Employee(id INTEGER PRIMARY KEY, firstname TEXT, lastname TEXT, mobileno TEXT,emailId TEXT )");
print("Created tables");
}

void saveEmployee(Employee employee) async {
var dbClient = await db;
await dbClient.transaction((txn) async {
return await txn.rawInsert(
'INSERT INTO Employee(firstname, lastname, mobileno, emailid ) VALUES(' +
''' +
employee.firstName +
''' +
',' +
''' +
employee.lastName +
''' +
',' +
''' +
employee.mobileNo +
''' +
',' +
''' +
employee.emailId +
''' +
')');
});
}

Future<List<Employee>> getEmployees() async {
var dbClient = await db;
List<Map> list = await dbClient.rawQuery('SELECT * FROM Employee');
List<Employee> employees = new List();
for (int i = 0; i < list.length; i++) {
employees.add(new Employee(list[i]["firstname"], list[i]["lastname"], list[i]["mobileno"], list[i]["emailid"]));
}
print(employees.length);
return employees;
}
}

(d). emloyeelist.dart

Neste arquivo, uma lista de funcionários será obtida de forma assíncrona e apresentada em uma visualização de lista:

import 'package:flutter/material.dart';
import 'package:flutter_crud/model/employee.dart';
import 'dart:async';
import 'package:flutter_crud/database/dbhelper.dart';

Future<List<Employee>> fetchEmployeesFromDatabase() async {
var dbHelper = DBHelper();
Future<List<Employee>> employees = dbHelper.getEmployees();
return employees;
}

class MyEmployeeList extends StatefulWidget {

MyEmployeeListPageState createState() => new MyEmployeeListPageState();
}

class MyEmployeeListPageState extends State<MyEmployeeList> {

Widget build(BuildContext context) {
return new Scaffold(
appBar: new AppBar(
title: new Text('Employee List'),
),
body: new Container(
padding: new EdgeInsets.all(16.0),
child: new FutureBuilder<List<Employee>>(
future: fetchEmployeesFromDatabase(),
builder: (context, snapshot) {
if (snapshot.hasData) {
return new ListView.builder(
itemCount: snapshot.data.length,
itemBuilder: (context, index) {
return new Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
new Text(snapshot.data[index].firstName,
style: new TextStyle(
fontWeight: FontWeight.bold, fontSize: 18.0)),
new Text(snapshot.data[index].lastName,
style: new TextStyle(
fontWeight: FontWeight.bold, fontSize: 14.0)),
new Divider()
]);
});
} else if (snapshot.hasError) {
return new Text("${snapshot.error}");
}
return new Container(alignment: AlignmentDirectional.center,child: new CircularProgressIndicator(),);
},
),
),
);
}
}

(e). main.dart

A classe principal, onde definimos nosso método principal, o ponto de entrada para nossa aplicação de dardos:

import 'package:flutter/material.dart';
import 'package:flutter_crud/database/dbhelper.dart';
import 'package:flutter_crud/model/employee.dart';
import 'package:flutter_crud/employeelist.dart';

void main() => runApp(new MyApp());

class MyApp extends StatelessWidget {
// This widget is the root of your application.

Widget build(BuildContext context) {
return new MaterialApp(
title: 'SQFLite DataBase Demo',
theme: new ThemeData(
primarySwatch: Colors.blue,
),
home: new MyHomePage(title: 'Flutter Demo Home Page'),
);
}
}

class MyHomePage extends StatefulWidget {
MyHomePage({Key key, this.title}) : super(key: key);
final String title;


_MyHomePageState createState() => new _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {

Employee employee = new Employee("", "", "", "");

String firstname;
String lastname;
String emailId;
String mobileno;
final scaffoldKey = new GlobalKey<ScaffoldState>();
final formKey = new GlobalKey<FormState>();


Widget build(BuildContext context) {
return new Scaffold(
key: scaffoldKey,
appBar: new AppBar(
title: new Text('Saving Employee'),
actions: <Widget>[
new IconButton(
icon: const Icon(Icons.view_list),
tooltip: 'Next choice',
onPressed: () {
navigateToEmployeeList();
},
),
]
),
body: new Padding(
padding: const EdgeInsets.all(16.0),
child: new Form(
key: formKey,
child: new Column(
children: [
new TextFormField(
keyboardType: TextInputType.text,
decoration: new InputDecoration(labelText: 'First Name'),
validator: (val) =>
val.length == 0 ?"Enter FirstName" : null,
onSaved: (val) => this.firstname = val,
),
new TextFormField(
keyboardType: TextInputType.text,
decoration: new InputDecoration(labelText: 'Last Name'),
validator: (val) =>
val.length ==0 ? 'Enter LastName' : null,
onSaved: (val) => this.lastname = val,
),
new TextFormField(
keyboardType: TextInputType.phone,
decoration: new InputDecoration(labelText: 'Mobile No'),
validator: (val) =>
val.length ==0 ? 'Enter Mobile No' : null,
onSaved: (val) => this.mobileno = val,
),
new TextFormField(
keyboardType: TextInputType.emailAddress,
decoration: new InputDecoration(labelText: 'Email Id'),
validator: (val) =>
val.length ==0 ? 'Enter Email Id' : null,
onSaved: (val) => this.emailId = val,
),
new Container(margin: const EdgeInsets.only(top: 10.0),child: new RaisedButton(onPressed: _submit,
child: new Text('Save Employee'),),)

],
),
),
),
);
}
void _submit() {
if (this.formKey.currentState.validate()) {
formKey.currentState.save();
}else{
return null;
}
var employee = Employee(firstname,lastname,mobileno,emailId);
var dbHelper = DBHelper();
dbHelper.saveEmployee(employee);
_showSnackBar("Data saved successfully");
}

void _showSnackBar(String text) {
scaffoldKey.currentState
.showSnackBar(new SnackBar(content: new Text(text)));
}

void navigateToEmployeeList(){
Navigator.push(
context,
new MaterialPageRoute(builder: (context) => new MyEmployeeList()),
);
}
}

Download

Vamos rever e fazer o download do projeto, ou navegar no github.

---

Crédito e Graças ao Criador Original do projeto acima @payen83

Como Funcionar

  1. Faça o download do projeto acima.
  2. Crie sua aplicação no estúdio andróide/estúdio visual como de costume.
  3. Edite o pubspec.yaml para adicionar as dependências appopriate.
  4. Copie colar os arquivos de dardos acima em seu projeto.

Em seguida:

Apenas certifique-se de que seu dispositivo ou emulador está rodando e clique no botão run em android studio, ele irá automaticamente escolher o dispositivo e instalar o aplicativo.

Aletrnative, você pode usar o terminal ou o prompt de comando. Navegue/Cd para a página raiz do projeto e digite isto:

flutter.bat build apk

Isto construirá o APK que você poderá então arrastar e instalar em seu dispositivo. O processo de construção em minha máquina leva cerca de três minutos, o que não é ruim.