title: How to update image with Image_picker and bloc
body: <p>I'm new to the Bloc pattern so I'm having a bit of trouble with updating an image that is chosen with <a href="https://pub.dartlang.org/packages/image_picker#-readme-tab-" rel="nofollow noreferrer">image_picker</a>.</p>
  
  <p>This is my code so far</p>
  
  <p><strong>image_picker_provider.dart</strong></p>
  
  <pre><code>import 'dart:io';
  
  import 'package:image_picker/image_picker.dart';
  
  class ImagePickerProvider {
    Future&lt;File&gt; getImage() async {
      File image = await ImagePicker.pickImage(
          source: ImageSource.gallery, maxWidth: 150.0, maxHeight: 150.0);
      return image;
    }
  
    Future&lt;File&gt; takeImage() async {
      var image = await ImagePicker.pickImage(
          source: ImageSource.camera, maxWidth: 150.0, maxHeight: 150.0);
      return image;
    }
  }
  </code></pre>
  
  <p><strong>repository.dart</strong></p>
  
  <pre><code>  Future&lt;File&gt; getImage() =&gt; _imagePickerProvider.getImage();
  
    Future&lt;File&gt; takeImage() =&gt; _imagePickerProvider.takeImage();
  </code></pre>
  
  <p><strong>form.dart</strong></p>
  
  <pre><code>  Widget picture() {
      return StreamBuilder(
          stream: _bloc.profilePicture,
          builder: (BuildContext context, AsyncSnapshot&lt;Future&lt;File&gt;&gt; snapshot) {
            if (!snapshot.hasData || snapshot.hasError) {
              return defaultPicture();
            } else {
              return profilePicture(snapshot);
            }
          });
    }
  
    Widget defaultPicture() {
      return Container(
        width: 150.0,
        height: 150.0,
        decoration: new BoxDecoration(
          image: new DecorationImage(
            image: AssetImage("assets/defaultProfile.jpg"),
            fit: BoxFit.cover,
          ),
          borderRadius: new BorderRadius.all(new Radius.circular(128.0)),
          border: new Border.all(
            color: Colors.black,
            width: 1.0,
          ),
        ),
      );
    }
  
    Widget profilePicture(File snapshotData) {
      return Container(
        width: 150.0,
        height: 150.0,
        decoration: new BoxDecoration(
          image: new DecorationImage(
            image: FileImage(snapshotData),
            fit: BoxFit.cover,
          ),
          borderRadius: new BorderRadius.all(new Radius.circular(128.0)),
          border: new Border.all(
            color: Colors.black,
            width: 1.0,
          ),
        ),
      );
    }
  </code></pre>
  
  <p>And so far all I have regarding the profile picture inside of my </p>
  
  <p><strong>create_account_bloc.dart</strong></p>
  
  <pre><code>import 'dart:async';
  import 'dart:io';
  import 'package:rxdart/rxdart.dart';
  import '../resources/repository.dart';
  
  class CreateAccountBloc {
    final _repository = Repository();
    final _email = BehaviorSubject&lt;String&gt;();
    final _password = BehaviorSubject&lt;String&gt;();
    final _firstName = BehaviorSubject&lt;String&gt;();
    final _phoneNumber = BehaviorSubject&lt;int&gt;();
    final _profilePicture = BehaviorSubject&lt;Future&lt;File&gt;&gt;();
    final _profilePictureURL = BehaviorSubject&lt;String&gt;();
    final _createAccountStatus = BehaviorSubject&lt;CreateAccountStatus&gt;();
  
    Observable&lt;String&gt; get email =&gt; _email.stream.transform(_validateEmail);
  
    Observable&lt;String&gt; get password =&gt;
        _password.stream.transform(_validatePassword);
  
    Observable&lt;String&gt; get firstName =&gt;
        _firstName.stream.transform(_validateFirstName);
  
    Observable&lt;CreateAccountStatus&gt; get createAccountStatus =&gt;
        _createAccountStatus.stream;
  
    Observable&lt;Future&lt;File&gt;&gt; get profilePicture =&gt; _profilePicture.stream;
  
    String get emailAddress =&gt; _email.value;
  
    // Change data
    Function(String) get changeEmail =&gt; _email.sink.add;
  
    Function(String) get changePassword =&gt; _password.sink.add;
  
    Function(String) get changeFirstName {
      return _firstName.sink.add;
    }
  
    Function(CreateAccountStatus) get changeAccountStatus =&gt;
        _createAccountStatus.sink.add;
  
    final _validateEmail =
        StreamTransformer&lt;String, String&gt;.fromHandlers(handleData: (email, sink) {
      if (Validator.isValidEmail(email)) {
        sink.add(email);
      } else {
        sink.addError(StringConstant.emailValidateMessage);
      }
    });
  
    final _validatePassword = StreamTransformer&lt;String, String&gt;.fromHandlers(
        handleData: (password, sink) {
      if (password.length &gt;= 6) {
        sink.add(password);
      } else {
        sink.addError(StringConstant.passwordValidateMessage);
      }
    });
  
    final _validateFirstName = StreamTransformer&lt;String, String&gt;.fromHandlers(
        handleData: (firstName, sink) {
      if (Validator.isValidFirstName(firstName)) {
        sink.add(firstName);
      } else {
        sink.addError(StringConstant.firstNameValidateMessage);
      }
    });
  
    bool validateFields() {
      if (Validator.isNotNullEmptyFalseOrZero(_email.value) &amp;&amp;
          Validator.isNotNullEmptyFalseOrZero(_password.value) &amp;&amp;
          Validator.isValidFirstName(_firstName.value) &amp;&amp;
  //        _phoneNumber.value != null &amp;&amp;
  ////        _phoneNumber.value.is &amp;&amp;
  //        _profilePicture.value != null &amp;&amp;
  //        _profilePicture.value.isNotEmpty &amp;&amp;
          Validator.isValidEmail(_email.value) &amp;&amp;
          _password.value.length &gt;= 6) {
        return true;
      } else {
        return false;
      }
    }
  
    void dispose() async {
      await _email.drain();
      _email.close();
      await _password.drain();
      _password.close();
      await _firstName.drain();
      _firstName.close();
      await _phoneNumber.drain();
      _phoneNumber.close();
      await _profilePicture.drain();
      _profilePicture.close();
      await _profilePictureURL.drain();
      _profilePictureURL.close();
      await _createAccountStatus.drain();
      _createAccountStatus.close();
    }
  }
  </code></pre>
  
  <p>I've tried to kinda copy other parts and make them work but every time on the journey I seem to come across an error.</p>
  
  <p>Any ideas on how to pick an image from the gallery and update the <code>_bloc.profilePicture</code> ?</p>
  
  <p>Thanks!</p>