Flutter脚本执行插件hetu_script_flutter的使用

Flutter脚本执行插件hetu_script_flutter的使用

开始使用

hetu_script_flutter 是一个用于在 Flutter 中执行脚本的插件。它允许你在应用中动态加载和执行 .ht 脚本文件。

首先，在 pubspec.yaml 文件中添加 hetu_script_flutter 和你的脚本文件路径。

dependencies:
  flutter:
    sdk: flutter
  hetu_script_flutter: ^版本号

flutter:
  assets:
    - scripts/main.ht

确保你的脚本文件位于项目根目录下的 scripts/ 文件夹中。

初始化Hetu脚本

在 Flutter 应用中初始化 Hetu 脚本。这一步需要异步操作，所以你需要使用 async 和 await。

import 'package:flutter/material.dart';
import 'package:hetu_script/hetu_script.dart';
import 'package:hetu_script_flutter/hetu_script_flutter.dart';

void main() async {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Hetu Script Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: const MyHomePage(title: 'Hetu Script Demo'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({super.key, required this.title});

  final String title;

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  late final Hetu hetu;

  bool _isHetuReady = false;

  String _scriptResult = '';

  void init() async {
    const root = 'scripts/';
    final filterConfig = HTFilterConfig(root, extension: [
      HTResource.hetuModule,
      HTResource.hetuScript,
      HTResource.json,
    ]);
    final sourceContext =
        HTAssetResourceContext(root: root, includedFilter: [filterConfig]);
    hetu = Hetu(sourceContext: sourceContext);
    await hetu.initFlutter();
    _isHetuReady = true;
  }

  void _runScript() {
    if (!_isHetuReady) {
      return;
    }
    setState(() {
      _scriptResult = hetu.evalFile('main.ht', invokeFunc: 'hello');
    });
  }

  @override
  void initState() {
    super.initState();

    init();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            const Text(
              '点击按钮运行脚本。',
            ),
            Text(
              _scriptResult,
              style: Theme.of(context).textTheme.headline4,
            ),
          ],
        ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: _runScript,
        tooltip: '运行脚本',
        child: const Icon(Icons.play_arrow),
      ),
    );
  }
}

示例脚本文件 (main.ht)

在 scripts/ 目录下创建一个名为 main.ht 的脚本文件，并包含以下内容：

func hello() -> string {
  return "Hello, Hetu Script!";
}

更多关于Flutter脚本执行插件hetu_script_flutter的使用的实战教程也可以访问 https://www.itying.com/category-92-b0.html

1 回复

更多关于Flutter脚本执行插件hetu_script_flutter的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


hetu_script_flutter 是一个 Flutter 插件，用于在 Flutter 应用中执行 Hetu 脚本。Hetu 是一种轻量级的脚本语言，专为嵌入到 Dart/Flutter 应用中而设计。通过 hetu_script_flutter 插件，你可以在 Flutter 应用中动态执行 Hetu 脚本，从而实现灵活的配置、逻辑控制等功能。

安装

首先，你需要在 pubspec.yaml 文件中添加 hetu_script_flutter 依赖：

dependencies:
  hetu_script_flutter: ^0.1.0

然后运行 flutter pub get 来安装依赖。

基本用法

  1. 导入库

    在你的 Dart 文件中导入 hetu_script_flutter：

    import 'package:hetu_script_flutter/hetu_script_flutter.dart';

  2. 初始化 Hetu 引擎

    创建一个 Hetu 实例来管理和执行脚本：

    final hetu = Hetu();

  3. 执行脚本

    你可以使用 hetu.eval 或 hetu.evalFile 来执行 Hetu 脚本。

    void main() async {
  final hetu = Hetu();

  // 执行一段简单的 Hetu 脚本
  final result = hetu.eval('return 42;');
  print(result); // 输出: 42

  // 执行一个 Hetu 脚本文件
  final fileResult = await hetu.evalFile('path/to/script.ht');
  print(fileResult);
}

  4. 与 Flutter 集成

    你可以在 Flutter 的 StatefulWidget 或 StatelessWidget 中使用 Hetu 脚本来动态控制 UI 或逻辑。

    class MyWidget extends StatelessWidget {
  final hetu = Hetu();

  @override
  Widget build(BuildContext context) {
    // 执行 Hetu 脚本来获取文本内容
    final text = hetu.eval('return "Hello, Hetu!";');

    return Scaffold(
      appBar: AppBar(
        title: Text('Hetu Script Example'),
      ),
      body: Center(
        child: Text(text),
      ),
    );
  }
}

高级用法

  1. 与 Dart 对象交互

    Hetu 脚本可以与 Dart 对象进行交互。你可以将 Dart 对象传递给 Hetu 脚本，并在脚本中使用它们。

    void main() {
  final hetu = Hetu();

  // 定义一个 Dart 类
  class Person {
    String name;
    int age;

    Person(this.name, this.age);

    void sayHello() {
      print('Hello, my name is $name and I am $age years old.');
    }
  }

  // 将 Dart 对象传递给 Hetu 脚本
  hetu.bind('person', Person('Alice', 30));

  // 在 Hetu 脚本中使用 Dart 对象
  hetu.eval('''
    person.sayHello();
  ''');
}

  2. 加载外部模块

    Hetu 支持模块化编程。你可以将脚本拆分为多个模块，并在主脚本中加载它们。

    void main() async {
  final hetu = Hetu();

  // 加载外部模块
  await hetu.import('path/to/module.ht');

  // 执行主脚本
  hetu.eval('''
    import "module.ht";
    module.someFunction();
  ''');
}
回到顶部