如何将 HTML 游戏转换为 Flutter Android 应用程序？

Question

我使用 HTML、CSS 和 JavaScript 开发了一个游戏，我想将其转换为 Flutter Android 应用程序。我听说使用 WebView 可能是一个可能的解决方案，但我不确定如何正确实现它或是否有更好的替代方案。

详情如下：

该游戏作为网络应用程序具有完整的功能。

• 它包括 HTML、CSS 和 JavaScript 文件。

• 我想在 Flutter 中运行游戏并且

  机器人应用程序。

实现这一目标的最佳方法是什么？我应该使用 WebView 嵌入游戏还是用 Flutter 重写游戏更好？任何有关如何设置的指导将不胜感激。

我使用 HTML、CSS 和 JavaScript 开发了一个游戏，我想将其转换为 Flutter Android 应用程序。我听说使用 WebView 可能是一个可能的解决方案，但我不确定如何正确实现它或是否有更好的替代方案。

详情如下：

该游戏作为网络应用程序具有完整的功能。

它包括 HTML、CSS 和 JavaScript 文件。

我想在 Flutter 中运行游戏并且

机器人应用程序。

实现这一目标的最佳方法是什么？我应该使用 WebView 嵌入游戏还是用 Flutter 重写游戏更好？任何有关如何设置的指导将不胜感激。

Answer 1

dependencies:
  flutter:
    sdk: flutter
  webview_flutter: ^4.0.0
  flame: ^1.0.0
  
  flutter:
  assets:
    - assets/your_game.html
    - assets/js/
    - assets/css/

import 'package:flutter/material.dart';
import 'package:webview_flutter/webview_flutter.dart';

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('HTML Game in Flutter'),
        ),
        body: WebView(
          initialUrl: 'assets/your_game.html',  // Point to your local HTML game
          javascriptMode: JavascriptMode.unrestricted,
        ),
      ),
    );
  }
}


import 'package:flame/game.dart';
import 'package:flutter/material.dart';

void main() => runApp(GameWidget(game: MyGame()));

class MyGame extends FlameGame {
  @override
  void render(Canvas canvas) {
    super.render(canvas);
    // Render your game elements
  }

  @override
  void update(double dt) {
    super.update(dt);
    // Update your game logic
  }
}