【问题标题】:Flutter not displaying images according to official docs根据官方文档,颤振不显示图像
【发布时间】:2019-01-13 15:26:48
【问题描述】:

我正在关注一个流行的颤振教程,我似乎是唯一遇到这个问题的人,这也让导师感到困惑。

问题:图片不按照官方文档显示。

变通解决方案:在引用文件的小部件中添加尾随“./”。

问题:为什么会这样?

pubspec.yaml 代码:

flutter:
  uses-material-design: true

  assets:
    - assets/food.jpg

没有尾随'./'的代码

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('EasyList'),
        ),
        body: Card(child: Column(children: <Widget>[
          Image.asset('assets/food.jpg'),
          Text('Food Paradise')
        ],),),
      ),
    );
  }
}

带有尾随 './' 的代码

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('EasyList'),
        ),
        body: Card(child: Column(children: <Widget>[
          Image.asset('./assets/food.jpg'),
          Text('Food Paradise')
        ],),),
      ),
    );
  }
}

【问题讨论】:

  • 您是否使用了包获取?命令,flutter packages get
  • 你好胡安。我刚试过,但没有解决问题。
  • 路径与flutter.io/docs/development/ui/assets-and-images#asset-bundling 中给出的pubspec.yaml 相关,实际目录无关紧要。看起来你的路径不正确或什么的。 @JuanEstebanLondoñoTabares 给出的答案很好。
  • 我假设你是对的,我的路径在某处不正确。但我通读了资产和图像文档,似乎无法找到答案。

标签: dart flutter flutter-appbar


【解决方案1】:

你看我刚刚用你上面指出的代码创建了一个项目,没有`/`它也能正常工作,那么我分享你使用的代码和项目的结构。

文件 main.dart

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('EasyList'),
        ),
        body: Card(
          child: Column(
            children: <Widget>[
              Image.asset('assets/food.jpg'),
              Text('Food Paradise')
            ],
          ),
        ),
      ),
    );
  }
}

文件 pubspec.yaml 名称:普鲁巴 描述:一个新的 Flutter 项目。

# The following defines the version and build number for your application.
# A version number is three numbers separated by dots, like 1.2.43
# followed by an optional build number separated by a +.
# Both the version and the builder number may be overridden in flutter
# build by specifying --build-name and --build-number, respectively.
# Read more about versioning at semver.org.
version: 1.0.0+1

environment:
  sdk: ">=2.0.0-dev.68.0 <3.0.0"

dependencies:
  flutter:
    sdk: flutter

  # The following adds the Cupertino Icons font to your application.
  # Use with the CupertinoIcons class for iOS style icons.
  cupertino_icons: ^0.1.2

dev_dependencies:
  flutter_test:
    sdk: flutter


# For information on the generic Dart part of this file, see the
# following page: https://www.dartlang.org/tools/pub/pubspec

# The following section is specific to Flutter.
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
  assets:
    - assets/food.jpg

这是项目的结构

结果如下:

您共享的代码看起来不错,如果一切配置良好,它应该可以正常运行。

【讨论】:

  • 谢谢胡安。我的设置完全相同,并且我的 pubspec.yaml 文件与您的相同。然而,我的代码仅适用于 main.dart 文件中的尾随“./”
猜你喜欢
  • 2022-01-08
  • 2019-08-30
  • 2020-11-15
  • 1970-01-01
  • 2020-10-30
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多