0

I'm trying to get url from my Firebase inform of a string and i want the process to wait for the http request to complete before proceeding because this url is to be used as the image url.

I want to make an app that automatically takes an image from a server and displays it automatically.Someone please help

I have tried future builder but i get the above error

    class _MyScreensHomeState extends State<MyScreensHome> {
  Future<String> _getmorningScreen1() async {
    var response = await http.get(
        'https://xxxxx.firebaseio.com/Shows/Morning_Show/Screen1.json');
    final String latestResponse = json.decode(response.body);
    return latestResponse;
  }

  Widget _defaultImage() {
    return Image.asset(
      'assets/Kiss_default.jpg',
      fit: BoxFit.fill,
      height: double.infinity,
      width: double.infinity,
    );
  }

  Widget _connectingImage() {
    return Image.asset(
      'assets/Kiss_default.jpg',
      fit: BoxFit.fill,
      height: double.infinity,
      width: double.infinity,
    );
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        appBar: AppBar(
          title: Text('Screen 2'),
        ),
        body: FutureBuilder(
          future: _getmorningScreen1(),
          builder: (BuildContext context, AsyncSnapshot<String> snapshot) {
            switch (snapshot.connectionState) {
              case ConnectionState.none:
                _defaultImage();
                break;
              case ConnectionState.waiting:
                _connectingImage();
                break;
              case ConnectionState.done:
                if (snapshot.hasError) {
                  return Text('Error:${snapshot.error}');
                } else {
                  return Image.asset(
                    (snapshot.data).toString(),
                    fit: BoxFit.fill,
                    height: double.infinity,
                    width: double.infinity,
                  );
                }
                break;
              default:
                Card(
                  child: Center(
                    child: Text('No Images to Display'),
                  ),
                );
            }
            return Container(width: 0.0, height: 0.0);
          },
        ),
      ),
    );
  }
════════ Exception caught by image resource service ════════════════════════════
The following assertion was thrown resolving an image codec:
Unable to load asset: https://i.postimg.cc/NjZGz6fS/Studio-Screens-Wake-01.png

When the exception was thrown, this was the stack
#0      PlatformAssetBundle.load 
package:flutter/…/services/asset_bundle.dart:221
<asynchronous suspension>
#1      AssetBundleImageProvider._loadAsync 
package:flutter/…/painting/image_provider.dart:464
<asynchronous suspension>
#2      AssetBundleImageProvider.load 
package:flutter/…/painting/image_provider.dart:449
...
Image provider: AssetImage(bundle: null, name: "https://i.postimg.cc/NjZGz6fS/Studio-Screens-Wake-01.png")
Image key: AssetBundleImageKey(bundle: PlatformAssetBundle#966e8(), name: "https://i.postimg.cc/NjZGz6fS/Studio-Screens-Wake-01.png", scale: 1.0)
════════════════════════════════════════════════════════════════════════════════
5
  • Remove Generic from FutureBuilder<String>, make it plain FutureBuilder. Oct 2, 2019 at 12:26
  • i didbut now im gettng a new error.
    – Clio Tech
    Oct 2, 2019 at 12:38
  • so how do i get the url in the end?
    – Clio Tech
    Oct 2, 2019 at 12:39
  • What kind of error are you getting? Also your future will fireup every second if you keep the Future method inside. Oct 2, 2019 at 12:44
  • I/flutter ( 6819): The offending widget is: FutureBuilder<String> I/flutter ( 6819): Build functions must never return null. To return an empty space that causes the building widget to I/flutter ( 6819): fill available room, return "new Container()". To return an empty space that takes as little room as I/flutter ( 6819): possible, return "new Container(width: 0.0, height: 0.0)".
    – Clio Tech
    Oct 2, 2019 at 12:48

2 Answers 2

0

The first error as I said in comment, difference between your Future method and FutureBuilder Generics. They must be same type.

Another one is as I realize with additional error log, you are not returning any Widget inside some cases and default.

So do like this:

switch (snapshot.connectionState) {
                  case ConnectionState.none:
                    return _defaultImage();
                  case ConnectionState.waiting:
                    return _connectingImage();
                  case ConnectionState.done:
                    if (snapshot.hasError) {
                      return Text('Error:${snapshot.error}');
                    } else {
                      return Text('Result:${snapshot.data}');
                    }
                    break;
                  default:
                    return Card(
                      child: Center(
                        child: Text('No Images to Display'),
                      ),
                    );
                }

Edit: Another problem is with your edited code:

case ConnectionState.done:
                if (snapshot.hasError) {
                  return Text('Error:${snapshot.error}');
                } else {
                  return Image.network( // => Change this into .network
                    (snapshot.data).toString(),
                    fit: BoxFit.fill,
                    height: double.infinity,
                    width: double.infinity,
                  );
                }

Because you are putting url, not a relative path.

3
  • so far your changeshave helped....now for the million dollar question
    – Clio Tech
    Oct 2, 2019 at 13:21
  • @ClioTech I edited the answer, just change the Image.asset into Image.network in that specific place. Oct 2, 2019 at 13:36
  • @ClioTech if your issue is solved, please accept the answer and close the topic: stackoverflow.com/help/someone-answers Oct 2, 2019 at 14:02
0

Problem is your FutureBuilder knows the data type but your Future function is sending dynamic instead of string.

Just update your _getmorningScreen1 function like that Future<String> _getmorningScreen1() ...

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.