Question

您好，我可以帮忙吗，我知道Expanded小部件需要Flex父级。但由于某些原因，我的错误：

我的代码是：

import 'package:flutter/material.dart';

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

class _InputPageState extends State<InputPage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Center(child: Text('BMI CALCULATOR')),
      ),
      body: Column(
        children: <Widget>[
          Expanded(
                      child: Container(
              child: ReusableCard(colour: Color(0xFF141A3C)),
            ),
          ),
        ],
      ),
    );
  }
}

class ReusableCard extends StatelessWidget {
  //CUSTOM CONSTRUCTOR
  //the color from the Stateful Widget from above is passed in to the INPUT of ReusableCard({PASSED IN HERE}),

  ReusableCard({this.colour});
  Color colour;

  @override
  Widget build(BuildContext context) {
    return Expanded(
      child: Container(
        margin: EdgeInsets.all(15.0),
        // height: 200.0,
        // width: 170.0,
        decoration: BoxDecoration(
          color: colour,
          borderRadius: BorderRadius.circular(10.0),
        ),
      ),
    );
  }
}

更新

我尝试将另一个扩展窗口小部件作为Column（）的孩子添加，但错误再次出现

class _InputPageState extends State<InputPage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Center(child: Text('BMI CALCULATOR')),
      ),
      body: Column(
        children: <Widget>[
          Expanded(
            child: Row(
              // <------ change this Container to a Row or Column
              children: <Widget>[
                ReusableCard(colour: Color(0xFF141A3C)),
                ReusableCard(colour: Color(0xFF141A3C)),
              ],
            ),
          ),
          Expanded(
            child: ReusableCard(
              colour: Color(0xFF141A3C),
            ),
          )
        ],
      ),
    );
  }
}

Answer 1

您的ReusableCard（返回Expanded小部件）包装在Container类中。这就是给您错误的原因。要解决此问题，您只需将Container类更改为Row或Column：

class _InputPageState extends State<InputPage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Center(child: Text('BMI CALCULATOR')),
      ),
      body: Column(
        children: <Widget>[
          Expanded(
              child: Container( // <------ change this Container to a Row or Column
                   child: ReusableCard(colour: Color(0xFF141A3C)
              ),
            ),
          ),
        ],
      ),
    );
  }
}

即使存在Flex父级，Flutter扩展小部件错误

1 个答案: