【自学Flutter】33 自定义Widget 的使用(组合)，2024年最新flutter开源项目商业化

在Flutter中，可以通过组合多个现有的Widget来创建自定义Widget。以下是一个简单的自定义Widget示例，它组合了一个Container和一个Text：

import 'package:flutter/material.dart';
 
class CustomWidget extends StatelessWidget {
  final String text;
  final Color color;
 
  const CustomWidget({Key? key, required this.text, required this.color}) : super(key: key);
 
  @override
  Widget build(BuildContext context) {
    return Container(
      color: color,
      padding: const EdgeInsets.all(10.0),
      child: Text(
        text,
        style: const TextStyle(fontSize: 20),
      ),
    );
  }
}
 
void main() {
  runApp(MyApp());
}
 
class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: Center(
          child: CustomWidget(
            text: 'Hello, Custom Widget!',
            color: Colors.blue,
          ),
        ),
      ),
    );
  }
}

在这个例子中，CustomWidget是一个组合了其他Widget的自定义Widget。它接受文本内容和颜色作为参数，并在Container内部显示Text。这是一个很基础的自定义Widget示例，但它展示了如何将现有的Widget组合起来创建新的功能。