在 flutter 中添加背景

Question

我应该怎么做才能在我的项目中应用我的背景图片？我错过了什么？我的背景图片在 lib/assets/background.jpg

下找到

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  Util flameUtil = Util();
  await flameUtil.fullScreen();
  await flameUtil.setOrientation(DeviceOrientation.portraitUp);

  LangawGame game = LangawGame();
  runApp(game.widget);
}

langaw-game.dart

class LangawGame extends Game {
  Size screenSize;
  double tileSize;
  @override
  void render(Canvas canvas) {
    body:
    Container(
      decoration: BoxDecoration(
        image: DecorationImage(
          image: AssetImage("assets/background.jpg"),
          fit: BoxFit.cover,
        ),
      ),

    );
  }

  @override
  void update(double t) {}
  @override
  void resize(Size size) {
    super.resize(size);
    screenSize = size;
    tileSize = screenSize.width / 9;
  }
}

这是结果

这是背景

我没有收到错误，但图像没有反映

Answer 1

您的图片路径不正确。现在您的图像位于 lib/assets 文件夹下，但您正在尝试访问 assets/background.jpg。您需要使用如下所示的完整路径进行编辑：

AssetImage("lib/assets/background.jpg"),

注意：另外，请检查您的 pubspec.yaml 文件。

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

  # To add Flutter specific assets to your application, add an assets section,
  # like this:
  assets:
    - lib/assets/background.jpg

从 official document 阅读更多内容。

Answer 2

确保 pubspec.yaml 中的缩进正确。

颤振 1 个资产标签： -assets/

的 2 个标签

希望对您有所帮助

在 flutter 中添加背景

Adding background in flutter

flutter

dart

flame