The images for the code below are not showing and it's throwing an exception. My pubspec is aligned correctly so not sure what's wrong.
I tried updating flutter, restarting,re-aligning but still get the same exception below.
Syncing files to device iPhone X... flutter: ══╡ EXCEPTION CAUGHT BY
IMAGE RESOURCE SERVICE
╞════════════════════════════════════════════════════ flutter: The
following assertion was thrown resolving an image codec: flutter:
Unable to load asset: /images/barlogo.png flutter: flutter: When the
exception was thrown, this was the stack: flutter: #0
PlatformAssetBundle.load
(package:flutter/src/services/asset_bundle.dart:221:7) flutter:
import 'package:flutter/material.dart';
void main() {
return runApp(
MaterialApp(
home: Scaffold(
appBar: AppBar(
backgroundColor: new Color(0xffA62FF0),
centerTitle: true,
elevation: 1.0,
leading: new Icon(Icons.camera_alt),
title: SizedBox(
height: 35.0, child:new Image.asset('/images/barlogo.png')),
actions: <Widget>[
Padding(
padding: const EdgeInsets.only(right: 12.0),
child: new Image.asset('/images/search.png'),
)
],
),
)
)
);
}
The exception gives it away - Flutter cannot find the image requested.
You should not have a leading / when specifying asset paths. Try:
Image.asset('images/barlogo.png')
There's more info in the documentation: https://api.flutter.dev/flutter/widgets/Image/Image.asset.html
Related
Exception is thrown when debugging on windows, stacktrace:
ERROR:flutter/runtime/dart_vm_initializer.cc(41)] Unhandled Exception: Scaffold.geometryOf() must only be accessed during the paint phase.
The ScaffoldGeometry is only available during the paint phase, because its value is computed during the animation and layout phases prior to painting.
#0 _ScaffoldGeometryNotifier.value.<anonymous closure> (package:flutter/src/material/scaffold.dart:835:9)
#1 _ScaffoldGeometryNotifier.value (package:flutter/src/material/scaffold.dart:842:6)
#2 _BottomAppBarClipper.getClip (package:flutter/src/material/bottom_app_bar.dart:238:35)
The stacktrace is hinting at getting geometry values from a BottomAppBar which is what I have in my widget. This error is followed by a lot of error messages for mouse_tracker when I move the mouse on the screen:
[ERROR:flutter/runtime/dart_vm_initializer.cc(41)] Unhandled Exception: 'package:flutter/src/rendering/mouse_tracker.dart': Failed assertion: line 195 pos 12: '!_debugDuringDeviceUpdate': is not true.
#0 _AssertionError._doThrowNew (dart:core-patch/errors_patch.dart:51:61)
#1 _AssertionError._throwNew (dart:core-patch/errors_patch.dart:40:5)
#2 MouseTracker._deviceUpdatePhase (package:flutter/src/rendering/mouse_tracker.dart:195:12)
Nothing on the screen is clickable after this.
The error occurs only after the FloatingActionButton is pressed, and not if the back button on the page is pressed. The onPressed for the FAB is:
void onOkPressed() {
Navigator.of(context).pop();
}
How can I solve this error?
The FAB is contained in the bottom app bar, try setting the FAB location to float
from
Scaffold(
appBar: const AppBar(),
bottomNavigationBar: const BottomAppBar(),
floatingActionButton: FloatingActionButton(
onPressed: onOkPressed,
child: const Icon(Icons.check, size: 32),
),
floatingActionButtonLocation: FloatingActionButtonLocation.endContained,
....
to
Scaffold(
appBar: const AppBar(),
bottomNavigationBar: const BottomAppBar(),
floatingActionButton: FloatingActionButton(
onPressed: onOkPressed,
child: const Icon(Icons.check, size: 32),
),
floatingActionButtonLocation: FloatingActionButtonLocation.endFloat,
....
I encountered this problem a few days ago and I was not sure how, but I managed to solve it. I still don't have a clue about what actually causes it. Whenever I create a new flutter project and try to add asset images in my app it throws this error:
======== Exception caught by image resource service ================================================
The following assertion was thrown resolving an image codec:
Unable to load asset: assets/image01
When the exception was thrown, this was the stack:
#0 PlatformAssetBundle.load (package:flutter/src/services/asset_bundle.dart:224:7)
<asynchronous suspension>
#1 AssetBundleImageProvider._loadAsync (package:flutter/src/painting/image_provider.dart:672:14)
<asynchronous suspension>
Image provider: AssetImage(bundle: null, name: "assets/image01")
Image key: AssetBundleImageKey(bundle: PlatformAssetBundle#abc8a(), name: "assets/image01", scale: 1.0)
====================================================================================================
I surfed for a while to find a solution but I was unable to find one, sometimes I just restart the app and run '''flutter clean''' to fix it but it isn't working this time. I don't know what to do, the pubsec.yaml and and the code seems to be working fine. I've tried creating new projects and rebuilding gradle but it's no good. Please provide descriptive and helpful answers.
Here's the code:
import 'package:flutter/material.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({Key? key}) : super(key: key);
#override
Widget build(BuildContext context) {
return MaterialApp(
debugShowCheckedModeBanner: false,
home: Scaffold(
backgroundColor: Colors.teal,
body: SafeArea(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Center(
child: CircleAvatar(
radius: 100,
backgroundColor: Colors.blue,
child: Image.asset('assets/image01'),
),
),
],
),
),
),
);
}
}
And here's pubsec.yaml
name: mi_card
description: A new Flutter project.
publish_to: 'none'
version: 1.0.0+1
environment:
sdk: ">=2.12.0 <3.0.0"
dependencies:
flutter:
sdk: flutter
cupertino_icons: ^1.0.2
dev_dependencies:
flutter_test:
sdk: flutter
flutter:
uses-material-design: true
assets:
- assets/
Try below code
Add below code in pubspec.yaml file.
flutter:
assets:
- assets/
uses-material-design: true
and create Image Widget, add your image path that save you in any folder like assets/image.png with your image extension
Center(
child: CircleAvatar(
radius: 100,
backgroundColor: Colors.blue,
child: Image.asset('assets/image01.png'),
),
),
You have to specify the extension of your image (i.e. image01.png)
child: Image.asset('assets/image01.png')
First create folder - best name (images). Put your picture, all of the pictures you want, calling. Then go to the pubspec.yml page edit portion of the picture.
flutter:
uses-material-design: true //two space
assets: //same up space
- images/ //two speace after asset
Then go to your code add all paths. Example:
backgroundImage: AssetImage("images/ss.jpeg"),
I am writing code for a simple flutter app.
The code is very simple,
void main() {
runApp(
MaterialApp(
home: Scaffold(
appBar: AppBar(
backgroundColor: Colors.teal,
shadowColor: Colors.black38,
title: Text(
'Some Ramdom Text',
style: TextStyle(color: Colors.black),
),
),
body: Center(
child: Image.asset('images/poor.png'),
),
),
),
);
}
However when I run it, I get the below error:
The following assertion was thrown resolving an image codec:
Unable to load asset: images/poor.png
When the exception was thrown, this was the stack:
#0 PlatformAssetBundle.load (package:flutter/src/services/asset_bundle.dart:224:7)
<asynchronous suspension>
What could I be missing? I tried refactoring the project.
I checked the pubspec.yaml, it looks good.
assets:
- images/
The Error states itself It was not able to find the assets or load it do a pub get in pubsec.yaml after saving it.
It will fix your problem
I am using Android Studio, and when I open pubspec.yaml, I see the option Pub Get on the right top corner on the screen.
This enables the project to install the referenced packages.
After this I was able to view the image.
I am trying to use the flutter_svg package to load some .svg icon.
class _MyHomePageState extends State<MyHomePage> {
final String iconPath = "assets/icons/adept.svg";
...
}
I added the assets/ folder containing the icons/ folder to the pubspec.yaml file:
assets:
- assets/
And when I try to load the icon inside my body:
body: Center(
child: Container(
child: LimitedBox(
child: SvgPicture.asset('iconPath', color: Colors.black, width: 100, height: 100,),
maxHeight: 100,
maxWidth: 100,
)
)
),
I get this StackTrace, Unable to load asset: assetName,
I/flutter (10154): ══╡ EXCEPTION CAUGHT BY SVG ╞═══════════════════════════════════════════════════════════════════════
I/flutter (10154): The following assertion was thrown resolving a single-frame picture stream:
I/flutter (10154): Unable to load asset: iconPath
I/flutter (10154):
I/flutter (10154): When the exception was thrown, this was the stack:
I/flutter (10154): #0 PlatformAssetBundle.load (package:flutter/src/services/asset_bundle.dart:223:7)
...
I/flutter (10154): Picture provider: ExactAssetPicture(name: "iconPath", bundle: null, colorFilter: null)
I/flutter (10154): Picture key: AssetBundlePictureKey(bundle: PlatformAssetBundle#153a9(), name: "iconPath",
I/flutter (10154): colorFilter: null)
I/flutter (10154): ════════════════════════════════════════════════════════════════════════════════════════════════════
Kindly explain to me what am I missing?
Did you change like below code?
assets:
- assets/
- assets/icons/
body: Center(
child: Container(
child: LimitedBox(
child: SvgPicture.asset(iconPath, color: Colors.black, width: 100, height: 100,),
maxHeight: 100,
maxWidth: 100,
)
)
),
just do 3 work:
Run this command in terminal : flutter clean.
and in android studio go to file and select:
Invalidated caches and restarted.
then get dependencies again by this command: flutter pub get
I'm new in flutter, just started since last week. I'm learning from the online lesson, then i want to load a image in my flutter app. But there was an error which is :
════════ Exception caught by image resource service ════════════════════════════════════════════════
The following assertion was thrown resolving an image codec:
Unable to load asset: assets/image2.jpg
When the exception was thrown, this was the stack:
#0 PlatformAssetBundle.load (package:flutter/src/services/asset_bundle.dart:225:7)
#1 AssetBundleImageProvider._loadAsync (package:flutter/src/painting/image_provider.dart:670:14)
Image provider: AssetImage(bundle: null, name: "assets/image2.jpg")
Image key: AssetBundleImageKey(bundle: PlatformAssetBundle#9f84b(), name: "assets/image2.jpg", scale: 1.0)
════════════════════════════════════════════════════════════════════════════════════════════════════
Below is the main.dart code :
import 'package:flutter/material.dart';
void main() =>
runApp(MaterialApp(
home: Home(),
));
class Home extends StatelessWidget {
#override
Widget build(BuildContext context) {
return Scaffold(
appBar : AppBar(
title : Text(
"Welcome to HLH",
style: TextStyle(
fontSize: 20.0,
color: Colors.black,
fontFamily: "Goldman",
),
),
centerTitle: false,
backgroundColor: Colors.amber,
),
body: Center(
child: Image(
image : AssetImage("assets/image2.jpg"),
),
),
floatingActionButton: FloatingActionButton(
onPressed: () {},
child: Text("Login"),
),
);
}
}
Can anyone exists me how to solve it? I'm wondering is it the image problem? Thanks^^
This can be a error of not declaring the assets in your pubspec.yaml file.
flutter:
assets:
- images/
Add this to your pubspec.yaml file and then flutter pub get on the app root folder in terminal
I think this problem was caused due to the image path!
Make sure that the path of the image correctly in pubspec.yaml (must be the same with the image path directory).
like this:-
i saved my image in this path "assets/images/cat.png"
Pubspec.yaml file :
flutter:
assets:
- assets/images/