Futuristic Part of a Widget won't disappear

[filly82]

I hope I can describe my problem correctly, because it is somehow weird

I have a GridView with a few Items shown on screen. A single item is a Column with a Image and a Button. The Image is the Futuristic Part. When clicking on the Button the complete Item is to disappear.
Everything works fine when I click on the last Item-Button. But when clicking on an other Button somewhere in the middle then the Image won't disappear and the the Buttons/Images get shifted (they do not match anymore)

Here is a Screenshot of what I mean. On the right side the Images do not match the Text/Button (Star) because the Image did not disappear as it should have. I clicked on the first Button from the left Picture

When switching from Futuristic to FutureBuilder everything is working like intended.
I am not sure if this is a Bug, since Futuristic is meant to not execute the future on rebuilding but it seems pretty weird to me and I would really like to make it work with Futuristic

Is my "problem" clear?

[martinrybak]

Where are your futures coming from? Looks like the futures being used by each futureBuilder are off by one. Can you attach a minimal working example?

[filly82]

the future is just a simple file loader.

here is everything you need to see what i mean

just click on the first or second button on the bottom right of each item and you will see the shifting

import 'dart:convert';
import 'dart:io';
import 'dart:typed_data';

import 'package:flutter/material.dart';
import 'package:path_provider/path_provider.dart' as pathProvider;
import 'package:futuristic/futuristic.dart';
import 'package:path/path.dart' as path;

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

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

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

  final String title;

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  List<Map<String, dynamic>> books = [{"title": "one"}, {"title": "two"}, {"title": "three"}];

  void _incrementCounter(int index) {
    setState(() {
      books.removeAt(index);
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: GridView.builder(
          physics: ClampingScrollPhysics(),
          gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(crossAxisCount: 2, childAspectRatio: 0.8),
          itemCount: books.length,
          shrinkWrap: true,
          itemBuilder: (BuildContext context, int index)
          {
            Map<String, dynamic> book = books.elementAt(index);

            return Container(
                margin: EdgeInsets.only(right: 5, left: 5, bottom: 10),
                child: Column(
                  children: <Widget>[
                    Expanded(child:Padding(padding: EdgeInsets.all(10), child:getCover("books_pics", "${book["title"]}", boxFit: BoxFit.contain))),
                    Container(
                        color: Colors.transparent.withOpacity(0.04),
                        width: MediaQuery.of(context).size.width,
                        padding: EdgeInsets.all(5),
                        child: Row(
                          mainAxisAlignment: MainAxisAlignment.spaceBetween,
                          children: <Widget>[
                            Flexible(child: Text("${book["title"]}", maxLines: 1, overflow: TextOverflow.ellipsis, style: TextStyle(fontSize: 13),)),
                            GestureDetector(child: Icon(Icons.map, color: Colors.yellow, size: 22,), onTap: () {
                              _incrementCounter(index);
                            },)
                          ],)
                    ),
                  ],
                ));

          }),
    );
  }

  static Widget getCover(String collection, String document, {BoxFit boxFit, double scale=1.0})
  {
    return Futuristic<File>(
      autoStart: true,
      futureBuilder: () => _loadCover(collection, document, boxFit: boxFit),
      busyBuilder: (context) => CircularProgressIndicator(),
      errorBuilder: (context, error, retry) => RaisedButton(child: Text('Oops'), onPressed: retry),
      dataBuilder: (context, data) => ClipRRect(
        child: Image.file(data, fit: boxFit),
      ),
    );
  }

  static Future<File> _loadCover(String collection, String document, {BoxFit boxFit}) async
  {
    String imagesDirectoryPath = path.join((await pathProvider.getApplicationDocumentsDirectory()).path, "$collection");

    String filePath = path.join(imagesDirectoryPath, "$document.png");
    if (!await File(filePath).exists())
    {
      await Directory(imagesDirectoryPath).create(recursive: true);

      String b64Data;
      if (document == "one")
        b64Data = "iVBORw0KGgoAAAANSUhEUgAAATUAAACxCAIAAAAqK70pAAAEL0lEQVR42u3cQUrcbACA4anSvXgP8RLd9QKCiAjeS0R6hO56CSn0GOJe1A4IMiSZzPxSnZff51m4iJOJC9/5vsyX5Mvz8/MCSPqiT8jSJ3TpE7r0CV36hC59Qpc+oUuf0KVP6NIndOkTuvQJXfqELn1Clz6hS5/QpU/o0id06RO69Ald+oQufUKXPqFLn9ClT+jSJ3TpE7r0CV36hC59Qpc+oUuf0KVP6NIndOkTuvQJXfqELn1Clz6hS5/QpU/o0id06RO66n3e39///Pnz169f19fXrxvPz8+/ffv2/fv3g4OD+d1//PhxdnY23n57e3t0dDTefnFxsXqgpaenp23ecN7gTWBL3T5///59fHy88WU3NzcnJyf7+/uTv53JabIZfZJS7PPx8fHy8nLQyby7u7vJsXQmp8khVJ+k5Ppcxvn169c37DiZ6HxODw8Pg4FXn6Tk+hwXsr1xb/M5LefGp6en80fXJzvU6nPdOefgJHPdy87Pz6+urla3bMxpkPQb+hwfFP6VVp97e3vjjZMT13XT4MGLN/Y5qEufpIT6nBwVx1PQV/f394eHh4ONg1q2mY6uJq1PUkJ9TrY0PqVcNXmyulrU+D1vb2/HnwKvu+iTlFCf48ntxn/9ySF3dTwc57QMfrx487rW8h7fD81/xMCMSp+T55PrrvKZ32tjn8uf471eOtQnKf/DPlf3muxzWct4+8uJrj5J+aR9Tu44OfXVJzv0SftcTJ27LofQwYX4C32yU5+3z8Wa5dYB39+yQ5U+F1O1zCx+vnjb97evfU6uoA7okx0K9Tk5dZy/cvUN658bL+ib/wP0yUcK9fkx1w8N+tw4hOqTHQr1ufiQ62//6z0u+mSHWn1uc//Kssw/f/68+f6VcZ/zd5zqkx1q9bl4//s/J1c7tn8Mivs/+Ui5PhfbLXuMbfn8hHWrkesOqk92qNjnuz5/aF2f66bW+mSHin2+eKfn981czTM5hOqTHer2+eKfP/92ps/JtRZ9skP1PuEz0yd06RO69Ald+oQufUKXPqFLn9ClT+jSJ3TpE7r0CV36hC59Qpc+oUuf0KVP6NIndOkTuvQJXfqELn1Clz6hS5/QpU/o0id06RO69Ald+oQufUKXPqFLn9ClT+jSJ3TpE7r0CV36hC59Qpc+oUuf0KVP6NIndOkTuvQJXfqELn1Clz6hS5/QpU/o0id06RO69Ald+oQufUKXPqFLn9ClT+jSJ3TpE7r0CV36hC59Qpc+oUuf0KVP6NIndOkTuvQJXfqELn1Clz6hS5/QpU/o0id06RO69Ald+oQufUKXPqFLn9ClT+jSJ3TpE7r0CV36hC59Qpc+oUuf0KVP6NIndOkTuvQJXfqELn1Clz6hS5/QpU/o0id06RO69Ald+oQufUKXPqFLn9ClT+jSJ3TpE7r0CV1/AQnc3tuZQf33AAAAAElFTkSuQmCC";
      else if (document == "two")
        b64Data = "iVBORw0KGgoAAAANSUhEUgAAAPMAAACBCAIAAACafhuiAAAEGUlEQVR42u3cQUrlQBRA0bTiXJy7BHETztyAICKCK3A9goi4BGduQgSXIc5F7UAghKpXlbRo2bneM3CQTueH5v7qZ/3on4+Pj07C+WPZQrJsMVm2mCxbTJYtJssWk2WLybLFZNlismwxWbaYLFtMli0myxaTZYvJssVk2WKybDFZtpgsW0yWLSbLFpNli8myxWTZYrJsMVm2mCxbTJYtJssWk2WLybLFZNlismwxWbaYLFtMli0myxaTZYtpvuyNjY1PX/309PTg4ODk5CQ5eHV1lZ/8+Pi4v7+fHHx9fd3c3EwOvry87OzsJAff399Lt9Gff3d3d39/f319ndzb4eHh9vb2l/+z6sd9e9kXFxcLez07O5uWN3h+fs7Ly98D//Ruyd3c3BwdHeW3pPX69rIvLy+3traS42Gv4Qs9PDzs7e0lB29vb5P/B/LT3t7ezs/P87dKRXhXWqlvL7tfSvMr5CGGA0ZXWIzzCyZR9lnnb6cljBujRdn5Epv3WhkbkgE6rDY5JxxsFgonJa3OJ/dGZlfNqSXf8FVaTK6cXy15n5TeJMkwXTqtNLJrXVqUHa6yydJY+Z8hGV1mh+zwUuHtlYYWZxKAFmV30ZI8Pb80ZA+SRbR+qXAl7lfr4+Pj8OLhS7tsAzQqO19op7XN7s1NR5f8pad/mr9QNzc6h4NQZXdcq9Co7PpwPPsN33jx/DrJepzf2OwCHL6vHEjWrlHZ9Q2N5Gr93JykNk7SeYXTITt8lXBHfPbeLHvtGpXdRQvzMCTky3B/PPmQZVx382FjOml8Ydmzf0v/uXZll/Y0kuNDxPnaPCzw9SHbsjVqV3ZpRE7W8uFguJD3X5MEkyHbsjVqV3YeUPhUyXidfPje3d1Nck/6s2yN2pXdFbai87V5mJvztbz/WhmySzdW2cweuDeC1LTs8OnT8DvFJSd30a5zuJ9d35x2Pxupadn1zxq7BVt4U+Fi7GeQGjQtu5t7cjC5SP3k0ijscyPq2pdd/7gxmQHC0WJU+sx8ybN+fdNPT08+6wfWuuzKIyJ5UpXppd6fz2erddmVWMOf+CqN2rM7Hp/7gQnnEIzWZXfl5sIrlFbfJdvn/hzkb/YDZZdiDTfaSqP2wpnBn13/tX6g7LC20tz8Jbty/r6RX8jfESUmyxaTZYvJssVk2WKybDFZtpgsW0yWLSbLFpNli8myxWTZYrJsMVm2mCxbTJYtJssWk2WLybLFZNlismwxWbaYLFtMli0myxaTZYvJssVk2WKybDFZtpgsW0yWLSbLFpNli8myxWTZYrJsMVm2mCxbTJYtJssWk2WLybLFZNlismwxWbaYLFtMli0myxaTZYvJssVk2WKybDFZtpgsW0yWLSbLFpNli8myxWTZYrJsMVm2mCxbTH8Brjo9O7d2xbYAAAAASUVORK5CYII=";
      else if (document == "three")
        b64Data = "iVBORw0KGgoAAAANSUhEUgAAAPMAAACBCAIAAACafhuiAAACz0lEQVR42u3cW0ojQQBA0R7Ff3Ef4iZchCAigssSRMQFifsQwU9RJyBISHecGMWRm3O+8mgqFbiE6qLIn9fX1wFy/iibJGXTpGyalE2TsmlSNk3KpknZNCmbJmXTpGyalE2TsmlSNk3KpknZNCmbJmXTpGyalE2TsmlSNk3KpknZNCmbJmXTpGyalE2TsmlSNk3KpknZNCmbJmXTpGyalE2TsmlSNk3KpunfZW9tba09+unp6eXl5ezBzc3NycnJ5FtjDw8Pe3t7Cy++vLzMPz07O7u6ulplAoeHh0dHR9vb28uuGc9tFfPz+foIfLt42fMfd3FxMdm3spM2pew3T09P47iVnbRZZQ9TPSk7aePKvr+/393dnX9F2Ulr7o2Mcx8XM+8Hyr69vd3f339/+vz8fH5+Pq7/+vr6+Ph47bl9/dvxM7JlL5vn+HOVnRQve3yZ3+wNoWxlN/23sj9rjbJnS+2dnZ2FccaXrTG3hd3Dr4/At2uWPWv68fFx/MM/TCWl7KRO2auYXLEoO2mDyh6vsNeem7J/v00pe1nW681N2b9fZ2/kAx9nZG8kaSPK/rgzZSd1yn6/O5yM/lOrEWUHBMselpzimtwY+ezcvv7t+BnNsidHGFY+n63sgGbZM3d3dwcHB+PBVzmfreyAbNnDks24Vc76rcL57F+uXPawZMG9cDep7KR42ZOHohYuVnZSvOxhhbtJZSf1yx6Wl/c2prKT/EcUTcqmSdk0KZsmZdOkbJqUTZOyaVI2TcqmSdk0KZsmZdOkbJqUTZOyaVI2TcqmSdk0KZsmZdOkbJqUTZOyaVI2TcqmSdk0KZsmZdOkbJqUTZOyaVI2TcqmSdk0KZsmZdOkbJqUTZOyaVI2TcqmSdk0KZsmZdOkbJqUTZOyaVI2TcqmSdk0KZsmZdOkbJqUTZOyaVI2TcqmSdk0KZsmZdOkbJqUTZOyafoLQNv0O/X6tmwAAAAASUVORK5CYII=";

      if (b64Data != null)
      {
        Uint8List imageData = base64Decode(b64Data);

        await File(filePath).writeAsBytes(imageData);
      }
    }

    return File(filePath);
  }
}