Bonjour, j'ai une application simple qui récupère les images du serveur Web, puis les affiche dans le générateur de vue en grille
ce que j'essaie de faire est de reconstruire toutes les images, notez que j'ai déjà implémenté RefreshIndicator () et sa fonction qui est OnRefresh fonctionne correctement chaque fois qu'un changement se produit dans la base de données, il ajoutera la nouvelle image à la vue,
Je veux aussi qu'il reconstruise toutes les images car imaginez cette situation avec moi:
vous avez ouvert l'application, le futur constructeur a récupéré les données et maintenant il les montre, mais pendant qu'il les montre, vous vous êtes soudainement déconnecté d'Internet, cela vous laissera des espaces vides (c'était censé être des images mais maintenant ils sont vides ) donc ce que je veux faire est de reconstruire ces images sur pull up afin que si l'utilisateur trouve des images manquantes, il puisse simplement remonter pour actualiser la page et reconstruire toutes les images à nouveau
voici mon code c'est juste le RefreshCompanies () qui doit être modifié
class CompaniesInterface extends StatelessWidget{
final companyId;
final companyName;
final companyLogo;
CompaniesInterface(this.companyId , this.companyName ,this.companyLogo);
@override
Widget build(BuildContext context) {
return Align(
child : Container(
margin: EdgeInsets.all(20),
height: DeviceInformation(context).height * 0.7,
width: DeviceInformation(context).width * 0.9,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(20),
shape: BoxShape.rectangle,
image: DecorationImage(
image: NetworkImage('$webSiteUrl$companyLogo'),
fit: BoxFit.fill,
),
),
),
);
}
}
My Companies Interface
XXX
ici vous pouvez trouver ce que j'entends par espaces vides
comme vous pouvez le voir à partir du code, j'ai essayé d'appeler EmptyCache () mais cela n'a pas reconstruit la vue en grille
Suggéré Solution: le rechargement à chaud fait correctement la chose souhaitée si vous pouvez trouver une fonction pour recharger à chaud l'application par programme, alors je pense que cela résoudra le problème
MISE À JOUR: pour quiconque viendra dans le futur avec la même question j'ai peur qu'il n'y ait pas de réponse directe à ma question, de sorte que j'ai récompensé la meilleure de mon point de vue
3 Réponses :
FutureBuilder ne s'exécutera qu'une seule fois. Une fois le Future terminé, il ne sera plus reconstruit. Vous devrez appeler setState () ou le convertir en Stream , en ajoutant de nouvelles données chaque fois que les données sont actualisées.
Eh bien, j'ai déjà essayé de le convertir en flux et de l'ajouter à l'aide de setstate, mais cela n'a pas fonctionné car il n'ajoute ou supprime que les données basées sur la base de données, donc le flux n'a pas fonctionné, puis j'ai essayé de le faire avec le futur constructeur a fait le même travail, il ne supprime que les données supprimées et ajoute de nouvelles données à l'écran, il n'a pas actualisé la page entière
Je suis désolé mais je n'ai pas compris
considérez ce scénario avec moi pour plus de précisions. l'utilisateur a récupéré les données et maintenant les données lui sont affichées dans l'application, maintenant, en tant que webmaster, j'ai ajouté des données sur mon serveur. Maintenant, l'utilisateur s'est levé et l'application a affiché l'indicateur d'actualisation et utilisé setState pour ajouter les nouvelles données à la variable. Ce qui va se passer, c'est que le Future Builder ou le Stream Builder va simplement récupérer les nouvelles données et les ajouter à l'écran et il ne reconstruira aucun élément manquant.
Pourquoi ne reconstruirait-il pas les éléments manquants? Si vous configurez correctement les choses, il se reconstruira. Vous devez ajouter les nouvelles données, la liste des éléments du serveur au Stream, puis le StreamBuilder réagira et reconstruira tout. Vous devrez probablement utiliser des Clés pour vous assurer que les choses sont en ordre.
vous pouvez jeter un œil ici stackoverflow.com/questions/62604261/... cette question que j'ai posée auparavant et c'est exactement comme vous me dites de le faire si je vous ai bien compris mais même si le générateur de flux n'a pas reconstruit
être honorés, je ne sais pas où et quand utiliser les clés ou même quelles sont les clés, mais je pourrais l'avoir fait par accident, donc si vous en êtes sûr s'il vous plaît partager du code et la raison pour laquelle vous pensez que cela résoudra le problème, merci vous pour votre temps
Lisez cet article: medium.com/flutter/keys-what- sont-ils-bons-pour-13cb51742e7d en un mot Les touches indiquent au Flutter Engine quels éléments d'une liste ont changé. Le moteur Flutter a du mal à déterminer quels éléments mettre à jour sur une liste si les éléments ont le même type et sont un StatefulWidget.
bien après avoir lu que je pense que cela pourrait être l'une des façons de le faire, mais comment dois-je la mettre en œuvre exactement? , dois-je spécifier une clé unique pour chaque élément de ma liste? et si je fais cela, comment puis-je reconstruire à nouveau la liste avec de nouvelles clés?
Lisez l'article, comprenez ce que sont les clés. Habituellement, vous pouvez utiliser des clés uniques ou utiliser n'importe quel identifiant unique dans vos données comme valeur de la clé, cela dépend vraiment de votre cas et de vos données.
c'est principalement la clé unique, mais cela n'a pas fonctionné avec moi, j'ai essayé de la mettre dans presque tous les widgets afin que même si le niveau était faux, cela fonctionnera dans certains cas et cela n'a pas reconstruit les images si vous avez une meilleure idée s'il vous plaît partager avec moi
Je pense que vous le mettez à jour mal, mais je ne peux pas vous aider beaucoup plus car vous avez dit que vous aviez essayé votre setstste, vos flux et vos futurs, je pense que vous les utilisez mal, mais je ne peux pas en être sûr car je n'ai pas accès à le code complet, et honnêtement je n'ai pas le temps de faire un examen complet du code
Je ne sais pas si cela vous est utile, mais peut-être que vous ne pourrez récupérer l'image que lorsqu'il y a une connexion active. https://pub.dev/packages/connectivity
Pseudo-code:
< pre> XXXQuelque chose comme ça ne récupérera les entreprises que s'il y a une connexion Internet.
le problème ne se produit que si votre connexion Internet est faible ou si vous vous êtes soudainement déconnecté d'Internet pendant que le futur constructeur crée des actifs, je veux juste recharger la page ou supprimer les images et les récupérer fonctionnera aussi je suis coincé dans ce problème pour 5 jours XD
Au lieu d'avoir un espace vide sans connexion Internet, essayez d'utiliser cached_network_image comme widget d'image, cela donne vous avez plus de contrôles comme l'espace réservé (vous pouvez toujours afficher l'image de chargement si aucune connexion):
TransitionToImage(
image: AdvancedNetworkImage(url,
loadedCallback: () {
print('It works!');
},
loadFailedCallback: () {
print('Oh, no!');
},
loadingProgress: (double progress) {
print('Now Loading: $progress');
},
),
loadingWidgetBuilder: (_, double progress, __) => Text(progress.toString()),
fit: BoxFit.contain,
placeholder: const Icon(Icons.refresh),
width: 400.0,
height: 300.0,
enableRefresh: true, // <-- Refresh button
);
ou vous pouvez même actualiser chaque image que vous voulez si aucune connexion en utilisant flutter_advanced_networkimage :
CachedNetworkImage(
imageUrl: "http://via.placeholder.com/200x150",
imageBuilder: (context, imageProvider) => Container(
decoration: BoxDecoration(
image: DecorationImage(
image: imageProvider,
fit: BoxFit.cover,
colorFilter:
ColorFilter.mode(Colors.red, BlendMode.colorBurn)),
),
),
placeholder: (context, url) => CircularProgressIndicator(),
errorWidget: (context, url, error) => Icon(Icons.error),
),
c'est une excellente façon de le faire, je vais bientôt refactoriser mon code en utilisant cette méthode mais désolé cela ne répond pas à la question c'est une alternative mais vraiment merci pour votre réponse
Pourquoi n'utilisez-vous pas l'image réseau en cache? Cela vous donnera la flexibilité d'afficher le chargeur pour chaque image et d'économiser de la bande passante lorsque vous rechargez la page car il mettra en cache l'image pour une utilisation future.En outre, cela vous donnera une erreur si l'image ne se charge pas et vous pouvez l'utiliser pour mettre à jour l'interface utilisateur en conséquence.
j'envisage de l'utiliser mais pas maintenant je l'utiliserai plus tard