如何使用 flutter 访问小部件的子 class 中小部件的父 class 的属性？

Question

大家好，我是 flutter 的新手，我想创建自己的自定义小部件。 我正在使用 inheritance

我试过了，但我无法访问子 class 中父 class 小部件的属性。 例如，一个列小部件具有属性 children，它实际上是一个小部件列表。 现在我想用很多小部件填充列表。 我想使用继承 Container 小部件的 MyContainer class 填充该列表。 MyContainer class 工作正常，但使用 MyColumn class 不是。

import 'package:flutter/material.dart';

void main(List<String> args) {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        appBar: AppBar(
          title: Title(
              color: const Color(0xFFFFFFFF),
              child: const Text("Hello World App")),
        ),
        body: MyColumn(),
      ),
    );
  }
}

class MyContainer extends Container {
  late int numbr;
  MyContainer(numbr) {
    this.numbr = numbr;
  }

  @override
  // TODO: implement color
  Color? get color => Colors.blue;
  @override
  // TODO: implement child
  Widget? get child => Center(
        child: Text("Container $numbr",
            style: TextStyle(
                fontSize: 34, fontFamily: "Cursive", color: Colors.white)),
      );
}

class MyColumn extends Column {
  @override
  // TODO: implement children
  List<Widget> get children {
    for (int i = 1; i < 11; i++) {
      this.children.add(MyContainer(i));
    }
    return this.children;
  }
}

对不起英语不好！！！

Answer 1

1. 使用build-in Column widget并像类似的小部件一样实例化它： Column() 、 Text()等，而不是扩展 class。 请参考dart官方文档here ，了解如何正确使用extends关键字。

2. 您不能只向 Scaffold 的body添加多个小部件，因为它expects a single widget （例如，列、文本或容器）。

3. 您可以使用自定义小部件MyCustomColumn来配置您的列（参见下面的代码），但您也可以简单地将列添加到 body 并将List.generate方法传递给它的 children 属性。

这是一个代码示例：

class MyCustomColumn extends StatelessWidget {
  const MyCustomColumn ({ Key? key }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Column(children: List.generate(11, (index) {
      return MyContainer(i);}
      ),
    );
  }
}