如何在颤动中将变量从一个 .dart 文件导入另一个文件

Question

我正在尝试从 udacity 学习颤振，其中一项任务是将变量从 main.dart 文件导入 category.dart 以创建新的小部件。

不幸的是，我无法将主 dart 文件中的 _categoryIcon 导入到类别 dart 中。 （也是 _categoryName 和 _categoryColor）这里是 main.dart 文件：

import 'package:flutter/material.dart';
import 'package:unispero/category.dart';

const _categoryName = 'Cake';
const _categoryIcon = Icons.cake;
const _categoryColor = Colors.green;

/// The function that is called when main.dart is run.
void main() {
  runApp(UnitConverterApp());
}

/// This widget is the root of our application.
/// Currently, we just show one widget in our app.
class UnitConverterApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      title: 'Unit Converter',
      home: Scaffold(
        backgroundColor: Colors.green[100],
        body: Center(
          // TODO: Determine what properties you'll need to pass into the widget
          child: Category(_categoryColor, _categoryIcon, _categoryName),
        ),
      ),
    );
  }
}

这里是 category.dart：

import 'package:flutter/material.dart';
import 'package:unispero/main.dart';


class Category extends StatelessWidget {
  /// Creates a [Category].
  ///
  /// A [Category] saves the name of the Category (e.g. 'Length'), its color for
  /// the UI, and the icon that represents it (e.g. a ruler).
  // TODO: You'll need the name, color, and iconLocation from main.dart
  const Category(_categoryColor, _categoryIcon, _categoryName);

  /// Builds a custom widget that shows [Category] information.
  ///
  /// This information includes the icon, name, and color for the [Category].
  @override
  // This `context` parameter describes the location of this widget in the
  // widget tree. It can be used for obtaining Theme data from the nearest
  // Theme ancestor in the tree. Below, we obtain the display1 text theme.
  // See https://docs.flutter.io/flutter/material/Theme-class.html
  Widget build(BuildContext context) {
    // TODO: Build the custom widget here, referring to the Specs.
    // const _categoryIcon = Icons.cake;
    // IconData? _categoryIcon;
    return Container(
      // width: 50,
      child: Row(children: <Widget>[
        Icon(_categoryIcon),
      ]),

      height: 100,
      color: Colors.blueAccent,
    );
  }
}

对不起，如果这是一个简单的问题，但我找不到答案

Answer 1

您不能从另一个具有underscore 的文件中导入变量。 Underscore 字段只能在 .dart 文件中访问。在这种情况下，您的 main.dart。如果您仍想访问这些值，则必须为它们创建 getters。

get categoryName => _categoryName;
get categoryIcon => _categoryIcon;
get categoryColor => _categoryColor;

我看到的另一个问题是您的Category 构造函数。您在 main.dart 中传递了值，但没有在 Category 中声明这些字段。

class Category extends StatelessWidget {
  /// Creates a [Category].
  ///
  /// A [Category] saves the name of the Category (e.g. 'Length'), its color for
  /// the UI, and the icon that represents it (e.g. a ruler).
  // TODO: You'll need the name, color, and iconLocation from main.dart
  const Category(this._categoryColor, this._categoryIcon, this._categoryName);

  final _categoryColor;
  final _categoryIcon;
  final _categoryName;

  /// Builds a custom widget that shows [Category] information.
  ///
  /// This information includes the icon, name, and color for the [Category].
  @override
  // This `context` parameter describes the location of this widget in the
  // widget tree. It can be used for obtaining Theme data from the nearest
  // Theme ancestor in the tree. Below, we obtain the display1 text theme.
  // See https://docs.flutter.io/flutter/material/Theme-class.html
  Widget build(BuildContext context) {
    // TODO: Build the custom widget here, referring to the Specs.
    // const _categoryIcon = Icons.cake;
    // IconData? _categoryIcon;
    return Container(
      // width: 50,
      child: Row(children: <Widget>[
        Icon(_categoryIcon),
      ]),

      height: 100,
      color: Colors.blueAccent,
    );
  }
}

Answer 2

“下划线”表示属性是私有的。它不能被其他 dart 文件访问。您需要创建 getter，或者在您的情况下您可以创建构造函数。

在 main.dart 中：

//before
child: Category(_categoryColor, _categoryIcon, _categoryName),

//after
child: Category(color: _categoryColor, name: _categoryName,icon: _categoryIcon),     

在 category.dart 中

//before
const Category(_categoryColor, _categoryIcon, _categoryName);

//after
const Category({required this.color, required this.icon, required this.name});
  final Color color;
  final IconData icon;
  final String name;