Flutter在独立Dart文件定义通用AppBar无法调用是什么问题？

你的问题主要来自两点语法错误：

• Dart函数定义的参数格式错误：你直接照搬了AppBar构造函数的参数写法，没有按照Dart函数的规范用{}包裹命名可选参数，导致函数本身定义不合法，调用时自然无法被识别为合法的AppBar类型变量。
• 未正确导入封装文件：如果没有在页面dart文件顶部引入originappbar.dart，IDE会无法识别originAppBar方法，出现类型报错。

这种简单的通用样式封装用函数实现完全足够，代码更简洁：

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

AppBar originAppBar({
  // 命名参数用{}包裹，可设置默认值或者声明为可空
  Color? backgroundColor,
  String? title,
  List<Widget>? actions,
  bool centerTitle = true,
}) {
  return AppBar(
    // 统一设置通用样式，有自定义传参则优先用传参
    backgroundColor: backgroundColor ?? Colors.blue,
    title: title == null ? null : Text(title),
    centerTitle: centerTitle,
    actions: actions,
    // 其余你需要统一的AppBar样式都可以在此处添加
  );
}

页面调用示例：

// home.dart
import 'package:flutter/material.dart';
// 注意路径要和你项目的文件结构匹配
import 'originappbar.dart';

class ShowHome extends StatelessWidget {
  ShowHome({Key? key}) : super(key: key);
  static const String route = '/home';
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: originAppBar(
        title: "首页",
        actions: [
          IconButton(onPressed: () {}, icon: const Icon(Icons.settings))
        ],
      ),
      // 其余页面代码
    );
  }
}

如果你后续需要给AppBar增加交互逻辑、更复杂的样式扩展，推荐封装为独立组件，注意要继承PreferredSizeWidget才能被Scaffold的appBar参数接收：

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

class OriginAppBar extends PreferredSizeWidget {
  final Color? backgroundColor;
  final String? title;
  final List<Widget>? actions;
  final bool centerTitle;

  const OriginAppBar({
    super.key,
    this.backgroundColor,
    this.title,
    this.actions,
    this.centerTitle = true,
  });

  @override
  Widget build(BuildContext context) {
    return AppBar(
      backgroundColor: backgroundColor ?? Colors.blue,
      title: title == null ? null : Text(title),
      centerTitle: centerTitle,
      actions: actions,
    );
  }

  // 必须重写preferredSize，默认AppBar高度为kToolbarHeight
  @override
  Size get preferredSize => const Size.fromHeight(kToolbarHeight);
}

调用方式：

appBar: const OriginAppBar(title: "我的页面")

内容的提问来源于stack exchange，提问作者Beginner_