Question

我写的代码与我的老师完全一样，然后重新检查了一下。一切都很好，但是我的代码未在我的小部件内输出文本和图标（即，我的Male和Female徽标图标和文本）。请帮助我，我不知道该怎么办。这是代码-

main.dart中的代码-

import 'package:flutter/material.dart';
import 'input_page.dart';

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

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

pubspec.yaml中的代码-

name: bmi_calculator
description: A new Flutter application.

version: 1.0.0+1

environment:
  sdk: ">=2.1.0 <3.0.0"

dependencies:
  flutter:
    sdk: flutter

  cupertino_icons: ^0.1.2
  font_awesome_flutter: ^8.4.0

dev_dependencies:
  flutter_test:
    sdk: flutter

flutter:
  uses-material-design: true

input_page.dart中的代码-

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:font_awesome_flutter/font_awesome_flutter.dart';

const bottomContainerHeight = 80.0;
const activeCardColour = Color(0xFF1D1E33);
const bottomContainerColour = Color(0xFFEB1555);

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: Row(
            children: <Widget>[
              Expanded(
                child: ReusableCard(
                    colour: activeCardColour,
                    cardChild: IconContent(icon:
                    FontAwesomeIcons.mars,
                    label: 'MALE',
                    )
                ),
              ),
              Expanded(
                child: ReusableCard(
                    colour: activeCardColour,
                    cardChild: IconContent(icon:
                    FontAwesomeIcons.venus,
                      label: 'FEMALE',
                    )
                ),
              ),
            ],
          ),),
          Expanded(
            child: ReusableCard(colour: activeCardColour),
          ),
          Expanded(child: Row(
            children: <Widget>[
              Expanded(
                child: ReusableCard(colour: activeCardColour),
              ),
              Expanded(
                child: ReusableCard(colour: activeCardColour),
              ),
            ],
          ),),
            Container(
            color: bottomContainerColour,
            margin: EdgeInsets.only(top: 10.0,bottom: 10.0),
            height: bottomContainerHeight,
            width: double.infinity,
            )
        ],
      ),
    );
  }
}

class IconContent extends StatelessWidget {
  IconContent({this.icon, this.label});

  final IconData icon;
  final String label;

  @override
  Widget build(BuildContext context) {
    return Column(
      mainAxisAlignment: MainAxisAlignment.center,
      children: <Widget>[
        Icon(
          icon,
          size: 80,
        ),
        SizedBox( height: 15),
        Text(
          label,
          style: TextStyle(
            fontSize: 18.0,
            //color: Colors.white,
            color: Color(0xFF8D8E98),
          ),
        )
      ],
    );
  }
}

class ReusableCard extends StatelessWidget {

  ReusableCard({@required this.colour, this.cardChild});

  final Color colour;
  final Widget cardChild;

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

Answer 1

在您的ReusableCard中缺少child。您必须写：

return Container(
      margin: EdgeInsets.all(15.0),
      decoration: BoxDecoration(
        color: colour,
        borderRadius: BorderRadius.circular(10.0),
      ),
      child: cardChild,
     );

在此类ReusableCard

中

我的图标和文字没有颤抖地输出

1 个答案: