Flutter
Parse SDK (REST)
Intégration Flutter-Parse: Opérations CRUD sur Back4app
10 min
ce guide démontre comment gérer les objets parse sur back4app en utilisant le plugin flutter pour parse server vous apprendrez les opérations crud de base créer, lire, mettre à jour et supprimer ce tutoriel utilise une simple application todo pour illustrer ces opérations le stockage de données back4app repose sur le parseobject , qui contient des paires clé valeur de données compatibles json le stockage de données back4app prend en charge une large gamme de types de données courants, y compris les chaînes, les nombres, les booléens, datetime, geopoints, pointers, relations, ainsi que des listes et des objets essentiellement, il prend en charge toutes les données qui peuvent être encodées au format json, offrant une solution flexible et robuste pour divers besoins de stockage de données prérequis pour compléter ce tutoriel, vous aurez besoin de version flutter 3 x x ou ultérieure android studio https //developer android com/studio ou vs code installé (avec plugins dart et flutter) une application créée sur back4app remarque suivez le tutoriel de nouvelle application parse pour apprendre à créer une application parse sur back4app une application flutter connectée à back4app remarque suivez le installer le sdk parse sur le projet flutter pour créer un projet flutter connecté à back4app un appareil (ou un appareil virtuel) exécutant android ou ios 1\ créer un objet le savetodo fonction crée une nouvelle tâche avec un titre et un done statut défini sur faux voici comment cela fonctionne initialiser l'objet parse en définissant ses attributs créez une instance de parseobject pour votre classe (par exemple, 'todo') utilisez la set méthode pour définir les paires clé valeur enregistrer l'objet appelez la save méthode pour stocker l'objet dans la base de données future\<void> savetodo(string title) async { final todo = parseobject('todo') set('title', title) set('done', false); await todo save(); } 2\ lire l'objet la gettodo fonction interroge la base de données et renvoie une liste de tâches voici comment cela fonctionne initialiser la requête créez une instance de querybuilder pour votre classe exécuter la requête utilisez la query méthode pour récupérer les données gérer la réponse vérifiez si la requête a réussi et traitez les résultats future\<list\<parseobject>> gettodo() async { querybuilder\<parseobject> querytodo = querybuilder\<parseobject>(parseobject('todo')); final parseresponse apiresponse = await querytodo query(); if (apiresponse success && apiresponse results != null) { return apiresponse results as list\<parseobject>; } else { return \[]; } } mettez à jour la listview\ builder fonction pour extraire et afficher les valeurs des objets parse // get parse object values final vartodo = snapshot data!\[index]; final vartitle = vartodo get\<string>('title')!; final vardone = vartodo get\<bool>('done')!; 3\ mettre à jour l'objet la updatetodo fonction met à jour le statut d'une tâche existante voici comment cela fonctionne initialiser l'objet parse et définir les attributs créez une instance de parseobject et définissez son objectid utilisez la méthode set pour mettre à jour les paires clé valeur enregistrer l'objet appelez la méthode save pour mettre à jour l'objet dans la base de données future\<void> updatetodo(string id, bool done) async { var todo = parseobject('todo') objectid = id set('done', done); await todo save(); } 4\ supprimer l'objet la deletetodo fonction supprime une tâche existante de la base de données voici comment cela fonctionne initialiser l'objet parse créez une instance de parseobject et définissez son objectid supprimer l'objet appelez la méthode delete pour retirer l'objet de la base de données future\<void> deletetodo(string id) async { var todo = parseobject('todo') objectid = id; await todo delete(); } code d'exemple complet voici le code complet pour une simple application todo intégrée avec le backend de back4app import 'package\ flutter/material dart'; import 'package\ parse server sdk flutter/parse server sdk flutter dart'; void main() async { widgetsflutterbinding ensureinitialized(); const keyapplicationid = 'your app id here'; const keyclientkey = 'your client key here'; const keyparseserverurl = 'https //parseapi back4app com'; await parse() initialize(keyapplicationid, keyparseserverurl, clientkey keyclientkey, autosendsessionid true); runapp(const materialapp(home todoapp())); } class todoapp extends statefulwidget { const todoapp({super key}); @override // ignore library private types in public api todoappstate createstate() => todoappstate(); } class todoappstate extends state\<todoapp> { list\<parseobject> tasks = \[]; texteditingcontroller taskcontroller = texteditingcontroller(); @override void initstate() { super initstate(); gettodo(); } @override widget build(buildcontext context) { return materialapp( debugshowcheckedmodebanner false, theme themedata( primarycolor colors white, hintcolor colors black, scaffoldbackgroundcolor colors white, appbartheme appbartheme(backgroundcolor color fromargb(255, 68, 122, 246))), home scaffold( appbar appbar( title const text('todo list'), ), body container( decoration boxdecoration( border border all(color colors black), ), child column( children \[ const sizedbox(height 20), buildtaskinput(), const sizedbox(height 20), expanded(child buildtasklist()), ], ), ), ), ); } widget buildtaskinput() { return padding( padding const edgeinsets symmetric(horizontal 20), child row( children \[ expanded( child textfield( controller taskcontroller, decoration inputdecoration( hinttext 'enter tasks', filled true, fillcolor colors grey\[200], border outlineinputborder( borderradius borderradius circular(8), borderside borderside none, ), ), ), ), const sizedbox(width 10), elevatedbutton( onpressed addtodo, style buttonstyle( foregroundcolor materialstateproperty all\<color>(colors black)), child const text('add'), ), ], ), ); } widget buildtasklist() { return listview\ builder( itemcount tasks length, itembuilder (context, index) { final vartodo = tasks\[index]; final vartitle = vartodo get\<string>('title') ?? ''; bool done = vartodo get\<bool>('done') ?? false; return listtile( title row( children \[ checkbox( value done, onchanged (newvalue) { updatetodo(index, newvalue!); }, ), expanded(child text(vartitle)), ], ), trailing iconbutton( icon const icon(icons delete), onpressed () { deletetodo(index, vartodo objectid!); }, ), ); }, ); } future\<void> addtodo() async { string task = taskcontroller text trim(); if (task isnotempty) { var todo = parseobject('todo') set('title', task) set('done', false); var response = await todo save(); if (response success) { setstate(() { tasks add(todo); }); taskcontroller clear(); } else { // handle error } } } future\<void> updatetodo(int index, bool done) async { final vartodo = tasks\[index]; final string id = vartodo objectid tostring(); var todo = parseobject('todo') objectid = id set('done', done); var response = await todo save(); if (response success) { setstate(() { tasks\[index] = todo; }); } else { // handle error } } future\<void> gettodo() async { var querybuilder = querybuilder\<parseobject>(parseobject('todo')); var apiresponse = await querybuilder query(); if (apiresponse success && apiresponse results != null) { setstate(() { tasks = apiresponse results as list\<parseobject>; }); } else { // handle error } } future\<void> deletetodo(int index, string id) async { var todo = parseobject('todo') objectid = id; var response = await todo delete(); if (response success) { setstate(() { tasks removeat(index); }); } else { // handle error } } } votre application devrait ressembler à ceci conclusion vous avez maintenant implémenté les opérations crud de base dans une application flutter en utilisant parse sur back4app ce tutoriel a démontré comment ajouter, récupérer, mettre à jour et supprimer des tâches dans une application todo