如何使用 flutter 功能部件库生成代码？

Question

根据 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!

Answer 1

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

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

@swidget
Widget myApp(){
...
}

Answer 2

我刚刚解决了它，将 flutter create 在 pubspec.yaml 中的默认 sdk 环境从

更改为

environment:
  sdk: ">=2.7.0 <3.0.0"

到

environment:
  sdk: ^2.12.0

如来自'functional_widget包的示例所示。

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

如何使用 flutter 功能部件库生成代码？

How to generate code with flutter functional widget library?

android

android-widget

flutter

附加信息