title: flutter upload image with multi_image_picker http
body: <p>I have this code trying to upload images with flutter
  the code successfully picks multiple images from the gallery and displays it but it cant be uploaded successfully
  here is the</p>
  <p>&quot;Unhandled Exception: Bad state: Cannot set the body fields of a Request with content-type &quot;multipart/form-data&quot;.&quot;</p>
  <pre><code>  List&lt;Asset&gt; images = List&lt;Asset&gt;();
    String _error = 'No Error Dectected';
  
    Widget buildGridView() {
      return GridView.count(
        crossAxisCount: 3,
        children: List.generate(images.length, (index) {
          Asset asset = images[index];
          return AssetThumb(
            asset: asset,
            width: 300,
            height: 300,
          );
        }),
      );
    }
  
  
  
  
    Future&lt;void&gt; uploadAssets() async {
  
      List&lt;MultipartFile&gt; multipart = List&lt;MultipartFile&gt;();
  
      for (int i = 0; i &lt; images.length; i++) {
        var path = await FlutterAbsolutePath.getAbsolutePath(images[i].identifier);
        multipart.add(await MultipartFile.fromPath(&quot;file&quot;,path,filename: basename(path)));
      }
  //    new http.MultipartFile('file', stream, length,
  //        filename: basename(imageFile.path));
  //    List&lt;ByteData&gt; byteDataList = await Future.wait(images.map((Asset image) =&gt; image.getByteData()));
  //
  //    List&lt;Uint8List&gt; byteArrayList = byteDataList.map((ByteData byteData) {
  //      ByteBuffer byteBuffer = byteData.buffer;
  //      return byteBuffer.asUint8List(byteData.offsetInBytes, byteBuffer.lengthInBytes);
  //    }).toList();
  
  
  //    Map data = {
  //       : multipart,
  //      'description' : 'here',
  //      'size': '7899'
  //
  //    };
  
      var res = await httpSend(multipart);
      print(res);
    }
    Future&lt;void&gt; loadAssets() async {
      List&lt;Asset&gt; resultList = List&lt;Asset&gt;();
      String error = 'No Error Dectected';
  
      try {
        resultList = await MultiImagePicker.pickImages(
          maxImages: 300,
          enableCamera: true,
          selectedAssets: images,
          cupertinoOptions: CupertinoOptions(takePhotoIcon: &quot;chat&quot;),
          materialOptions: MaterialOptions(
            actionBarColor: &quot;#abcdef&quot;,
            actionBarTitle: &quot;Example App&quot;,
            allViewTitle: &quot;All Photos&quot;,
            useDetailsView: false,
            selectCircleStrokeColor: &quot;#000000&quot;,
          ),
        );
      } on Exception catch (e) {
        error = e.toString();
      }
   if (!mounted) return;
  
      setState(() {
        images = resultList;
        _error = error;
      });
    }
  
  
  
  
  return new Scaffold(
        body: new Container(
              child:Container(
  
          child: Stack(
                children: [
  
   Visibility(
  
      visible:_pickvisiblee,
      child: Container(
  
      padding: EdgeInsets.fromLTRB(20.0,180.0,0.0, 0.0),
  //    child: Stack(
      child:Column(
        children: &lt;Widget&gt;[
          Center(child: Text('Error: $_error')),
          RaisedButton(
            child: Text(&quot;Pick images&quot;),
            onPressed: loadAssets,
          ),
          RaisedButton(
            child: Text(&quot;upload&quot;),
            onPressed: uploadAssets,
          ),
          Expanded(
            child: buildGridView(),
          )
        ],
      ),
      ),
      ),
  
  
     ],
        ),
        );
  
  
      });
    }
  }
  
  </code></pre>
  <p>I am trying to upload multiple images using http</p>
  <pre><code>
  Future httpSend(List&lt;http.MultipartFile&gt; params) async
  {
    Map data ={
      'file':params
    };
    String endpoint = 'https://dynamicurl.com/api/uploadimage';
    final response= await http.post(endpoint, body: data,
      headers:{ &quot;Content-Type&quot;:&quot;multipart/form-data&quot; } );
    List&lt;dynamic&gt; convertedDatatoJson = null;
    if(response.body.isEmpty){
  
      convertedDatatoJson =  null;
    }else{
      print(response.body);
      convertedDatatoJson =  jsonDecode(response.body);
    }
    return convertedDatatoJson;
  }
  
  
  </code></pre>
  <p>here is the error
  Unhandled Exception: Bad state: Cannot set the body fields of a Request with content-type &quot;multipart/form-data&quot;.
  i will like to see solution on how to upload multiple images, Firstly, convert List  to List, the error was as a result of my working.</p>