Index
画像を表示するサンプルコードを以下のように書いたのですが、なぜか画像が標示されなくて困っていました。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 |
class _MyHomePageState extends State<MyHomePage> { @override Widget build(BuildContext context) { return Scaffold( appBar: AppBar( title: Text(widget.title), ), body: ListView( children: [ Image.asset( 'image/lake.jpeg', width: 600, height: 240, fit: BoxFit.cover, ), ], ), ); } } |
このコードで実行してみると、以下のようなエラーが出ます。
エラー
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 |
#0 _validateRpcStringParam (package:flutter_tools/src/vmservice.dart:377:5) #1 setUpVmService.<anonymous closure> (package:flutter_tools/src/vmservice.dart:236:33) #2 setUpVmService.<anonymous closure> (package:flutter_tools/src/vmservice.dart:234:60) #3 VmService._routeRequest (package:vm_service/src/vm_service.dart:2376:27) #4 VmService._processRequest (package:vm_service/src/vm_service.dart:2346:25) #5 VmService._processMessageStr (package:vm_service/src/vm_service.dart:2313:9) #6 VmService._processMessage (package:vm_service/src/vm_service.dart:2271:7) #7 _rootRunUnary (dart:async/zone.dart:1434:47) #8 _CustomZone.runUnary (dart:async/zone.dart:1335:19) #9 _CustomZone.runUnaryGuarded (dart:async/zone.dart:1244:7) #10 _BufferingStreamSubscription._sendData (dart:async/stream_impl.dart:341:11) #11 _BufferingStreamSubscription._add (dart:async/stream_impl.dart:271:7) #12 _SyncStreamControllerDispatch._sendData (dart:async/stream_controller.dart:774:19) #13 _StreamController._add (dart:async/stream_controller.dart:648:7) #14 _StreamController.add (dart:async/stream_controller.dart:596:5) #15 new _WebSocketImpl._fromSocket.<anonymous closure> (dart:_http/websocket_impl.dart:1144:21) #16 _rootRunUnary (dart:async/zone.dart:1434:47) #17 _CustomZone.runUnary (dart:async/zone.dart:1335:19) #18 _CustomZone.runUnaryGuarded (dart:async/zone.dart:1244:7) #19 _BufferingStreamSubscription._sendData (dart:async/stream_impl.dart:341:11) #20 _BufferingStreamSubscription._add (dart:async/stream_impl.dart:271:7) #21 _SinkTransformerStreamSubscription._add (dart:async/stream_transformers.dart:63:11) #22 _EventSinkWrapper.add (dart:async/stream_transformers.dart:13:11) #23 _WebSocketProtocolTransformer._messageFrameEnd (dart:_http/websocket_impl.dart:332:23) #24 _WebSocketProtocolTransformer.add (dart:_http/websocket_impl.dart:226:46) #25 _SinkTransformerStreamSubscription._handleData (dart:async/stream_transformers.dart:111:24) #26 _rootRunUnary (dart:async/zone.dart:1434:47) #27 _CustomZone.runUnary (dart:async/zone.dart:1335:19) #28 _CustomZone.runUnaryGuarded (dart:async/zone.dart:1244:7) #29 _BufferingStreamSubscription._sendData (dart:async/stream_impl.dart:341:11) #30 _BufferingStreamSubscription._add (dart:async/stream_impl.dart:271:7) #31 _SyncStreamControllerDispatch._sendData (dart:async/stream_controller.dart:774:19) #32 _StreamController._add (dart:async/stream_controller.dart:648:7) #33 _StreamController.add (dart:async/stream_controller.dart:596:5) #34 _Socket._onData (dart:io-patch/socket_patch.dart:2314:41) #35 _rootRunUnary (dart:async/zone.dart:1442:13) #36 _CustomZone.runUnary (dart:async/zone.dart:1335:19) #37 _CustomZone.runUnaryGuarded (dart:async/zone.dart:1244:7) #38 _BufferingStreamSubscription._sendData (dart:async/stream_impl.dart:341:11) #39 _BufferingStreamSubscription._add (dart:async/stream_impl.dart:271:7) #40 _SyncStreamControllerDispatch._sendData (dart:async/stream_controller.dart:774:19) #41 _StreamController._add (dart:async/stream_controller.dart:648:7) #42 _StreamController.add (dart:async/stream_controller.dart:596:5) #43 new _RawSocket.<anonymous closure> (dart:io-patch/socket_patch.dart:1839:33) #44 _NativeSocket.issueReadEvent.issue (dart:io-patch/socket_patch.dart:1322:14) #45 _microtaskLoop (dart:async/schedule_microtask.dart:40:21) #46 _startMicrotaskLoop (dart:async/schedule_microtask.dart:49:5) #47 _runPendingImmediateCallback (dart:isolate-patch/isolate_patch.dart:122:13) #48 _RawReceivePortImpl._handleMessage (dart:isolate-patch/isolate_patch.dart:193:5) |
エラー発生箇所はここ
pubspec.yamlファイルに以下のコードを追加して、再起動すると画像が表示されるようになります。
|
1 2 |
assets: - image/lake.jpeg |
位置はこの辺で良さそうです。
|
1 2 3 4 5 6 7 8 9 10 |
# The following section is specific to Flutter packages. flutter: # The following line ensures that the Material Icons font is # included with your application, so that you can use the icons in # the material Icons class. uses-material-design: true //以下の2行を追加 assets: - image/lake.jpeg |
ちなみに、以下のように書いておくと、imageフォルダ下全ての画像を読み込み可能になると、情報をいただきました:)
HTML
|
1 |
- image/ |
pubspecファイルの公式のリファレンスはこちら
https://docs.flutter.dev/development/ui/layout/tutorial#step-5-implement-the-image-section
