如何使用颤振功能小部件库生成代码？

Posted 2023-04-15

【中文标题】如何使用颤振功能小部件库生成代码？

【英文标题】：How to generate code with flutter functional widget library?

【发布时间】：2021-07-07 18:35:59

【问题描述】：

根据functional_widget 文档，如果我设置正确，我可以使用此库编写功能小部件，该库在单独的[filename].g.dart 中生成样板代码，我所要做的就是将part '[filename].g.dart'; 添加到文件中并运行使用flutter pub run build_runner watch的代码生成器

所以我写了一个简单的“计数器”应用来测试它。

import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'package:flutter_hooks/flutter_hooks.dart';
import 'package:functional_widget_annotation/functional_widget_annotation.dart';

part 'main.g.dart';

void main() 
  runApp(MyApp());


@swidget
Widget myApp()
  return MaterialApp(
    title: 'Flutter Demo',
    routes: 
      '/': (context) => MyHomePage(title: 'Rutas lmL')
    ,
    theme: ThemeData(
      primarySwatch: Colors.lightGreen,
    ),
  );



@hwidget
Widget myHomePage(String title)
  final countState = useState(0);

  void increment() => countState.value++;
  void decrement() => countState.value--;

  return Scaffold(
    appBar: AppBar(
      title: Text(title),
    ),
    body: Column(
      mainAxisAlignment: MainAxisAlignment.center,
      crossAxisAlignment: CrossAxisAlignment.stretch,
      children: [
        Text('Presionaste $countState.value veces', textAlign: TextAlign.center,),
        TextButton.icon(onPressed: increment, label: Text('Incrementar'), icon: Icon(Icons.add)),
        TextButton.icon(onPressed: decrement, label: Text('Decrementar'), icon: Icon(Icons.vertical_align_bottom))
      ],
    ),
  );

但是生成器输出错误：

[INFO] ------------------------------------------------------------------------

[INFO] Starting Build

[INFO] Updating asset graph...
[INFO] Updating asset graph completed, took 1ms

[INFO] Running build...
[SEVERE] functional_widget:functional_widget on lib/main.dart:

Invalid prototype. The function must be synchronous, top level, and return a Widget
package:testapp/main.dart:13:8
   ╷
13 │ Widget myApp()
   │        ^^^^^
   ╵
[INFO] Running build completed, took 121ms

[INFO] Caching finalized dependency graph...
[INFO] Caching finalized dependency graph completed, took 35ms

[SEVERE] Failed after 158ms

我阅读了所有关于它的文档，我认为我的代码没有任何问题，但如果你们中的任何人能指出我做错了什么，我会非常感激。

附加信息

pubspec.yml

name: testapp
description: A new Flutter project.

# The following line prevents the package from being accidentally published to
# pub.dev using `pub publish`. This is preferred for private packages.
publish_to: 'none' # Remove this line if you wish to publish to pub.dev

# 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.
# In android, build-name is used as versionName while build-number used as versionCode.
# Read more about Android versioning at https://developer.android.com/studio/publish/versioning
# In ios, build-name is used as CFBundleShortVersionString while build-number used as CFBundleVersion.
# Read more about iOS versioning at
# https://developer.apple.com/library/archive/documentation/General/Reference/InfoPlistKeyReference/Articles/CoreFoundationKeys.html
version: 1.0.0+1

environment:
  sdk: ">=2.7.0 <3.0.0"

dependencies:
  flutter:
    sdk: flutter
  cupertino_icons: ^1.0.2
  flutter_hooks: ^0.16.0
  functional_widget_annotation: ^0.9.0

dev_dependencies:
  flutter_test:
    sdk: flutter
  functional_widget: ^0.9.0
  build_runner: ^1.9.0
# For information on the generic Dart part of this file, see the
# following page: https://dart.dev/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

  # To add assets to your application, add an assets section, like this:
  # assets:
  #   - images/a_dot_burr.jpeg
  #   - images/a_dot_ham.jpeg

  # An image asset can refer to one or more resolution-specific "variants", see
  # https://flutter.dev/assets-and-images/#resolution-aware.

  # For details regarding adding assets from package dependencies, see
  # https://flutter.dev/assets-and-images/#from-packages

  # To add custom fonts to your application, add a fonts section here,
  # in this "flutter" section. Each entry in this list should have a
  # "family" key with the font family name, and a "fonts" key with a
  # list giving the asset and other descriptors for the font. For
  # example:
  # fonts:
  #   - family: Schyler
  #     fonts:
  #       - asset: fonts/Schyler-Regular.ttf
  #       - asset: fonts/Schyler-Italic.ttf
  #         style: italic
  #   - family: Trajan Pro
  #     fonts:
  #       - asset: fonts/TrajanPro.ttf
  #       - asset: fonts/TrajanPro_Bold.ttf
  #         weight: 700
  #
  # For details regarding fonts from package dependencies,
  # see https://flutter.dev/custom-fonts/#from-packages

扑扑医生：

Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel stable, 2.0.4, on Microsoft Windows [Versión 10.0.21313.1000], locale es-CL)
[✓] Android toolchain - develop for Android devices (Android SDK version 30.0.3)
[✓] Chrome - develop for the web
[✓] Android Studio (version 4.1.0)
[✓] IntelliJ IDEA Ultimate Edition (version 2019.3)
[✓] VS Code (version 1.55.1)
[✓] Connected device (3 available)

• No issues found!

【参考方案1】：

看看你的装饰函数的名字，应该是这样的

void main() 
  runApp(MyApp());


@swidget
Widget myApp()
...

【讨论】：

这是不正确的，文档说函数应该始终以小​​写字母开头，因为生成的类以大写字母开头

当您在项目中启动 flutter pub run build_runner watch 时，您有一个测试文件夹吗？

我不记得了，它是使用flutter create <projectname> 创建的默认模板无论如何我解决了它更改 pubspec.yml 中的 sdk 版本。

【参考方案2】：

我刚刚解决了在 pubspec.yaml 中更改 flutter create 的默认 sdk 环境的问题

environment:
  sdk: ">=2.7.0 <3.0.0"

到

environment:
  sdk: ^2.12.0

如 'functional_widget 包中的示例所示。

这个错误没有记录，我不明白为什么会发生，所以我无法记录它。