flutter - 使用自定义小部件在列表中给出错误

Question

我创建了一个名为“ BigCard ”的自定义小部件。现在，当我在 List 数组中使用它时，在 InputPage.dart 文件中出现错误。错误说->元素类型“BigCard”不能分配给列表类型“Widget”。

Main.dart 文件->

void main() => runApp(BMICalculator());

class BMICalculator extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData.dark().copyWith(
        primaryColor: Color(0xFFfbe0c4),
        scaffoldBackgroundColor: Color(0xFFff8303),
      ),
      home: InputPage(),
    );
  }
}

InputPage.dart 文件->

class InputPage extends StatefulWidget {
  @override
  _InputPageState createState() => _InputPageState();
}

class _InputPageState extends State<InputPage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
          title: Text('BMI CALCULATOR'),
        ),
        body: Column(
          children: [
            Expanded(
              child: Row(children: [
                BigCard(
                  a: Colors.black38,
                  b: TextIcon(a: 'MALE', b: FontAwesomeIcons.mars),
                ),
                BigCard(
                  a: Colors.blueGrey,
                  b: TextIcon(a: 'FEMALE', b: FontAwesomeIcons.venus),
                ),
              ]),
            ),
            Expanded(
                child: Row(
              children: [],
            )),
            Expanded(
                child: Row(
              children: [
                BigCard(),
                BigCard(),
              ],
            )),
            Container(
              color: Color(0xFFEB1555),
              margin: EdgeInsets.only(top: 10.0),
              height: 80,
              width: double.infinity,
            ),
          ],
        ));
  }
}

TextIcon.dart 文件->

class TextIcon {
  String a;
  IconData b;
  TextIcon({this.a, this.b});
  Column repe() {
    return Column(
      mainAxisAlignment: MainAxisAlignment.center,
      children: <Widget>[
        Icon(
          b,
          size: 80,
        ),
        SizedBox(
          height: 15,
        ),
        Text(
          a,
          style: TextStyle(
            fontSize: 18,
            color: Color(0xFF8D8E98),
          ),
        )
      ],
    );
  }
}

BigCard.dart 文件->

class BigCard {
  Color a;
  TextIcon b;
  BigCard({this.a, this.b});
  Expanded repeat({Color a, Widget b}) {
    return Expanded(
      child: Container(
        child: b,
        margin: EdgeInsets.all(15),
        decoration: BoxDecoration(
          borderRadius: BorderRadius.circular(15),
          color: a,
        ),
      ),
    );
  }
}

请帮忙。

标签： flutter

Answer 1

制作 BigCard 如下

class BigCard extends StatelessWidget {
  Color a;
  TextIcon b;
  BigCard({this.a, this.b});
  @override
  Widget build(BuildContext context) {
    return Expanded(
      child: Container(
        child: b,
        margin: EdgeInsets.all(15),
        decoration: BoxDecoration(
          borderRadius: BorderRadius.circular(15),
          color: a,
        ),
      ),
    );
  }
}