Neste artigo pretendo mostrar como consumir arquivos JSON no Dart. Não é bem como consumir uma API, algo que dependa de requisições web. Se trata de fato em consumir arquivos JSON da máquina local e atribuindo-os a objetos Dart.
Estruturando o arquivo JSON
Vamos criar um arquivo JSON em nosso projeto e, em seguida, estruturá-lo da seguinte forma:
[
{
"id": 1,
"nome": "Bulbassaur",
"regiao": "Kanto",
"tipos": [
"Grass",
"Poison"
]
},
{
"id": 2,
"nome": "Ivyssaur",
"regiao": "Kanto",
"tipos": [
"Grass",
"Poison"
]
},
{
"id": 4,
"nome": "Charmander",
"regiao": "Kanto",
"tipos": [
"Fire"
]
}
]
Antes de mais nada, vamos pegar esse arquivo JSON que escrevemos e chamá-lo de poke_db.json, por exemplo.
Definindo a classe
class Pokemon {
int id;
String? nome;
String? regiao;
List<String>? tipos;
Pokemon({this.id, required this.nome, this.regiao, this.tipos});
}
Criando o método de deserialização do JSON
Antes de partirmos para a criação do método, vamos entender o que é deserializar um objeto JSON?
O que acontece é que o que está presente em nosso "poke_db.json" são dados prontos e fresquinhos para serem consumidos, e nós precisamos de alguma forma utilizar esses dados. Para isso, nós pegamos esses dados "fresquinhos" e reconstruímos eles na forma de um model
, um modelo. No caso, atribuímos esses dados aos atributos de uma classe.
No mesmo arquivo da classe criada, criaremos o método fromJson().
O que acontece nesse método?
O fromJson serve para atribuir valores vindos de um objeto JSON para sua classe. Um objeto JSON é reconhecido como um Map devido ao seu comportamento e estruturação de chave-valor. Então pegamos os atributos da classe e fazemos com que recebam os valores do JSON referentes às chaves do Map correspondentes a estes.
Basicamente, esta função é uma espécie de MAPEAMENTO da classe para um objeto JSON.
Pokemon.fromJson(Map<String, dynamic> json) {
id = json['id'];
nome = json['nome'];
regiao = json['regiao'];
tipos = json['tipos'].cast<String>[]();
}
Por qual motivo a tipagem do Map utilizado como parâmetro é <String, dynamic>
?
Bom, já sabemos que o tipo informado no lado esquerdo é a tipagem das chaves. Já no direito, é a tipagem dos valores.
No caso, utilizamos o dynamic para os valores justamente pelo motivo de que podemos ter números (int, double), textos (String), listas (List), Maps...
Exemplo de um JSON genérico
{
"chave": "valor"
}
Vamos consumir o objeto JSON
Vamos criar um arquivo chamado poke_repository.dart
.
Neste arquivo iremos criar algumas funções que ficarão responsáveis pelo processo de consumo do nosso objeto JSON.
Primeiramente iremos realizar alguns imports
import 'dart:async';
import 'package:flutter/services.dart' show rootBundle;
import 'dart:convert';
import 'package:pokemon_json/poke_model.dart'; // import da classe
Criaremos uma função para carregar a String contendo todo o arquivo poke_db.json
.
É muito importante lembrar de colocarmos o caminho do arquivo JSON nos assets do nosso pubspec.yaml
!
assets:
- lib/poke_db.json
Future<String> _carregarPokemonJSON() async {
return await rootBundle.loadString('lib/poke_db.json');
// Aqui passamos o [caminho] do arquivo JSON
}
Tendo a String do nosso arquivo JSON carregada, vamos criar uma função que irá nos retornar a lista contendo os objetos Dart de Pokémon.
// Como temos uma lista em nosso objeto JSON, podemos então dizer para nossa função que pode aguardar uma List<Pokemon>
Future<List<Pokemon>> carregarPokemon() async {
// Atribuímos a String de todo o JSON para a variável pokeJsonString
String pokeJsonString = await _carregarPokemonJSON();
// Agora utilizamos o método json.decode() para "decodificarmos" essa String
final respostaJson = json.decode(pokeJsonString);
// criando lista genérica para armazenar os Pokémon do objeto JSON
final lista = <Pokemon>[];
// Atribuindo cada objeto da lista JSON para a classe Dart Pokémon utilizando o método Pokemon.fromJson()
for (var pokemon in respostaJson) {
final poke = Pokemon.fromJson(pokemon);
lista.add(poke);
}
// e finalmente teremos a lista com nossos Pokémon
return lista;
}
Pronto, com esta última função sendo chamada em alguma parte de seu código você já pode ter acesso aos dados do poke_db.json
.
Exemplo:
Future<void> main() async {
final listaPokemon = await carregarPokemon();
print(listaPokemon[0].nome); // Bulbassaur
for (Pokemon pkmn in listaPokemon) {
print(pkmn.nome);
/*
Bulbassaur
Ivyssaur
Charmander
*/
}
}
Artigo que possa vir a te ajudar em caso de dúvidas mais específicas em relação ao Dart
Dart4Noobs
Top comments (0)