如何在 Flutter 中创建自定义类型的 widget？

Question

我正在尝试创建几个小部件 A，它们都应该属于另一种类型的小部件 B，以便最终所有它们都可以传递给构造函数仅接受 B 类型的小部件，但不接受其他自定义小部件，例如 Container、Text 等。

我尝试了这样的操作：

Parent class:

class ProDynamicWidget {

  const ProDynamicWidget({
    required this.height
  });

  final double height;
}

Child类：

class ProDynamicTitle extends ProDynamicWidget {

  final String title;

  ProDynamicTitle({
    required this.title
  }) : super(height: 50.0);

  // Here should be a build method for the title

}

############################################################

class ProDynamicImage extends ProDynamicWidget {

  final String imageUrl;

  ProDynamicImage({
    required this.imageUrl
  }) : super(height: 70.0);

  // Here should be a build method for the image

}

然后我想创建一个仅接受类型小部件的小部件ProDynamicWidget：

class TestOneWidget extends StatelessWidget {

  const TestOneWidget({ 
    Key? key,
    required this.widget
  }) : super(key: key);

  final ProDynamicWidget widget;

  @override
  Widget build(BuildContext context) {
    return Container();
  }
}

我真的不明白现在如何才能得到具有单独构建方法的子小部件，以及最后的构造器仅接受这些子小部件而不是每种类型的小部件的方式。

Answer 1

使 ProDynamicWidget abstract 并让它扩展 StatelessWidget：

abstract class ProDynamicWidget extends StatelessWidget{

  const ProDynamicWidget({
    required this.height
  });

  final double height;
}

接下来，简单地 ProDynamicTitle 和 ProDynamicImage扩展ProDynamicWidget，因此必须定义构建方法：

class ProDynamicTitle extends ProDynamicWidget {

  final String title;

  const ProDynamicTitle({
    required this.title
  }) : super(height: 50.0);

  @override
  Widget build(BuildContext context) {
    return Text(title);
  }
}

class ProDynamicImage extends ProDynamicWidget {

  final String imageUrl;

  const ProDynamicImage({
    required this.imageUrl
  }) : super(height: 70.0);

  @override
  Widget build(BuildContext context) {
    return Image(image: NetworkImage(imageUrl));
  }
}

您可以保持TestOneWidget不变。它只接受 ProDynamicWidget 的后代。