Flutter完整开发实战详解( 深入Widget原理)

在Flutter中，Widget是构建用户界面的基本单位。每个Widget都有自己的createElement方法，该方法返回一个Element对象，Element是Widget在Flutter渲染树中实例的表示。

// 定义一个简单的自定义Widget
class MyCustomWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(
      child: Text('Hello, World!'),
    );
  }
}
 
void main() {
  runApp(MyApp());
}
 
class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: Center(
          child: MyCustomWidget(), // 使用自定义Widget
        ),
      ),
    );
  }
}

在这个例子中，MyCustomWidget是一个简单的自定义Widget，它继承自StatelessWidget。在build方法中，它返回一个Container，其中包含一个Text Widget。在MyApp的build方法中，它返回一个MaterialApp，其中包含了MyCustomWidget。

这个例子展示了如何在Flutter中创建和使用自定义Widget。通过继承StatelessWidget或StatefulWidget，你可以定义自己的Widget，并在其中构建复杂的布局和交互逻辑。