Repository navigation
Asset Image not loading while using Cupertino Picker in bottom sheet #61228
Description
Hi Everyone
I am trying to show country flag and names using Cupertino Picker which is used inside a bottom sheet.When the bottom sheet opens up for the first time, Cupertino Picker is throwing an error saying "The method 'toDouble' was called on null."
**I would like to point out two things here:-
- This issue is coming when I am displaying images by fetching it from assets in cupertino picker. If I use Inbuilt flutter icons then the same code works fine.
- Also note that if you comment this line
Image.asset('images/image_2.jpg', height: 200),, the same code will work**
Below is the stack trace.
════════ Exception caught by image resource service ════════════════════════════════════════════════
The following NoSuchMethodError was thrown while resolving an image:
The method 'toDouble' was called on null.
Receiver: null
Tried calling: toDouble()
When the exception was thrown, this was the stack:
#0 Object.noSuchMethod (dart:core-patch/object_patch.dart:51:5)
#1 double.> (dart:core-patch/double.dart:94:31)
#2 max (dart:math-patch/math_patch.dart:43:9)
#3 _clipOffsetToScrollableRange (package:flutter/src/widgets/list_wheel_scroll_view.dart:362:19)
#4 _getItemFromOffset (package:flutter/src/widgets/list_wheel_scroll_view.dart:354:11)
...
Image provider: ScrollAwareImageProvider<dynamic>()
Image configuration: ImageConfiguration(bundle: PlatformAssetBundle#b5efd(), devicePixelRatio: 3.0, locale: en_US, textDirection: TextDirection.ltr, size: Size(30.0, 30.0), platform: android)
Image key: AssetBundleImageKey(bundle: PlatformAssetBundle#b5efd(), name: "images/flags/in.png", scale: 1.0)
Also check the code that I have used to show the flag and name of country:-
code sample
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
void main() => runApp(MyApp());
List<Map<String, String>> flagData = [
{"name": "India", "flag": "images/flags/in.png"},
{"name": "France", "flag": "images/flags/fr.png"},
{"name": "Italy", "flag": "images/flags/it.png"},
{"name": "Germany", "flag": "images/flags/de.png"},
{"name": "Belgium", "flag": "images/flags/be.png"},
];
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: MyHomePage(),
);
}
}
class MyHomePage extends StatefulWidget {
@override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
double hgt;
double wdth;
@override
Widget build(BuildContext context) {
var size = MediaQuery.of(context).size;
hgt = size.height;
wdth = size.width;
return Scaffold(
appBar: AppBar(
title: Text("ScrollWheel in bottom sheet"),
),
body: SingleChildScrollView(
child: Column(children: [
Image.asset('images/image_2.jpg', height: 200),
SizedBox(height: 10),
RaisedButton(
child: Text("Tap To Open"),
onPressed: () async {
_showBottomSheetModal();
})
]),
));
}
_showBottomSheetModal() {
showModalBottomSheet(
backgroundColor: Colors.white,
context: context,
builder: (context) {
return Column(
mainAxisSize: MainAxisSize.min,
children: <Widget>[
SizedBox(
height: 250,
child: CupertinoPicker(
onSelectedItemChanged: (int item) {
print("item - $item");
},
itemExtent: 80,
diameterRatio: 2,
children: flagData.map((e) {
print(e['flag']);
return Row(
children: <Widget>[
Image.asset(
e['flag'],
width: 30,
height: 30,
),
Text(e['name'])
],
);
}).toList(),
),
),
],
);
});
}
}here is the flutter doctor stacktrace:-
Doctor summary (to see all details, run flutter doctor -v):
[√] Flutter (Channel beta, 1.19.0-4.3.pre, on Microsoft Windows [Version 10.0.17763.168], locale en-IN)
[√] Android toolchain - develop for Android devices (Android SDK version 30.0.0)
[√] Android Studio (version 4.0)
[√] VS Code (version 1.46.1)
[√] Connected device (1 available)
• No issues found!
Also check screenshots for actual output (having no flag) and expected output (having flag with country name).
Reacted by Angel, 0948, Martin Jäger, Jon Hanson, Maciej Berka, Jérémy Favier and Ivan Serdiukov
Activity
VladyslavBondarenko commentedon Jul 10, 2020
@sherrychhabra51
could you attach minimal reproducible project?
What device are you using? do you have another device/emulator to check if it persists?
I tried to run it on my Redmi Note 7 Android 9 (API 28) with master
1.20.0-8.0.pre.40and beta1.19.0-4.3.pre(as you used) with this image instead of image_2.jpg and flags. But it is working as intendedsherrychhabra51 commentedon Jul 10, 2020
@VladyslavBondarenko
Can you please clone repo from below mentioned URL:-
https://github.com/sherrychhabra51/flutter-wheel-view.git
I have tested this in Google Pixel 2 and MI A-1 device and able to reproduce this in both of these devices .
Here are some steps which might help you :-
I am facing this issue with CupertinoPicker only, if i use List view instead of Cupertino Picker , it seems to be working fine without any issue.
Let me know if more details are required.
VladyslavBondarenko commentedon Jul 13, 2020
@sherrychhabra51
thank you, with this repo I can reproduce it, with current master
1.20.0-8.0.pre.57as well.I also noticed that it doesn't happen when I use
Image.network('https://i.imgur.com/uBlK6gV.jpg', height: 200),instead ofImage.asset('images/image_2.jpg', height: 200),, although it's the same imagesherrychhabra51 commentedon Jul 13, 2020
Yes. That's correct. The issue only occurs when we use Image.asset and the same code works fine if used with Icon class or Image.network class.
aylanexame commentedon Jul 14, 2020
I am facing the same issue.
4 remaining items
Adavo commentedon Sep 27, 2020
Hi @yaaqovadam ,
I have tried on my side but it's not working even by loading picture on the main screen.
See : https://youtu.be/d8Q8SlcwJ7Y
I really hope that Flutter team will fix this issue ASAP because I have no idea how to find a proper workaround...
0xPixelfrost commentedon Sep 30, 2020
Duplicate of #60578
Check my comment
yaaqovadam commentedon Sep 30, 2020
@Adavo
hrmmm.. wellll.........:) i dunno.. i actually preload mine on the sign in screen, the top most widget in the widget tree, before i navigate to the screen with the picker. try doing that.
"I really hope that Flutter team will fix this issue ASAP"
me too :)
jonbhanson commentedon Dec 11, 2020
I am experiencing this same issue. Used @yaaqovadam's workaround, which worked. It would be nice to have this work out of the box, though.
Edit: a cleaner way to preload the image file is using
precacheImage:maciejberka commentedon Dec 22, 2020
Try (for each image):
Source
bounty1342 commentedon Feb 4, 2021
Please look at @XxLuckyMxX comment.
Pre-caching with a builder is counterproductive...
also linked to #60578
@darshankawar
bounty1342 commentedon Apr 10, 2021
@darshankawar So any updates on this ?
hyungtaecf commentedon May 4, 2021
I was trying to fix the issue for my app for hours! I tried a lot of stuff, and I decided to try one last stupid thing before giving up, but it ended up working in my case!!
I'm using FancyShimmerImage inside ListWheelScrollView, which is basically the CachedNetworkImage with a shimmer. I noticed the problem was only happening to me for the visible widgets in the ListWheelScrollView, but when scrolling to the parts where it starts hidden, those images were loading well. So I realized it happens just in the first rendering. Then I had what I thought was a stupid idea, that I set the errorWidget to be displayed in the CachedNetworkImage as the FancyShimmerImage itself, and it ended up that when it tries to load the image again it works.
quango2304 commentedon Sep 9, 2021
thanh @hyungtaecf
this is how it work for me
GotJimmy commentedon Oct 25, 2021
Works perfectly that way! Thanks!
maheshj01 commentedon Dec 21, 2022
@sherrychhabra51 I tried running your code sample and it seems to work as expected, I believe the bug is fixed.
flutter doctor -v (mac)
Closing for now. Incase you still encounter the issue please feel free to write in the comments and we will reopen it.
Thank you.
github-actions commentedon Mar 4, 2023
This thread has been automatically locked since there has not been any recent activity after it was closed. If you are still experiencing a similar issue, please open a new bug, including the output of
flutter doctor -vand a minimal reproduction of the issue.