如何在卡片小部件中显示 children with，其中一个 child 是 fl 条形图？

Question

这是当我运行 flutter 运行命令时出现在我的终端上的错误。我怎样才能在卡片中有两个 children 而不会溢出或将其大小扩展到无穷大？

The following RenderObject was being processed when the exception was fired: RenderBarChart#947f3 relayoutBoundary=up24
NEEDS-LAYOUT NEEDS-PAINT:
  creator: BarChartLeaf ← Listener ← _GestureSemantics ← RawGestureDetector ← GestureDetector ←
    BarChart ← BarChartWidget ← RepaintBoundary ← IndexedSemantics ←
    NotificationListener<KeepAliveNotification> ← KeepAlive ← AutomaticKeepAlive ← ⋯
  parentData: <none> (can use size)
  constraints: BoxConstraints(w=376.0, 0.0<=h<=Infinity)
  size: Size(376.0, Infinity)
This RenderObject has no descendants.

//代码

Widget build(BuildContext context) {
    return Padding(
      padding: const EdgeInsets.all(15),
      child: Card(
        shadowColor: Colors.red,
        elevation: 20,
        shape: RoundedRectangleBorder(
          borderRadius: BorderRadius.circular(8),
        ),
        color: Color(0xff240046),
        child: ListView(
          shrinkWrap: true,
          children: [
            BarChartWidget(),
            Text("Demo"),
          ],
        ),
      ),
    );

我也试过 SingleChildScrollView，但是不行

这是我用来构建 flutter 图表的代码。

Widget build(BuildContext context) {
    return BarChart(BarChartData(
        axisTitleData: FlAxisTitleData(
          show: true,
          leftTitle: AxisTitle(
            titleText: "Interest Rate",
            showTitle: true,
            textStyle: TextStyle(fontSize: 15, color: Colors.white),
          ),
          bottomTitle: AxisTitle(
            titleText: "Banks",
            showTitle: true,
            textStyle: TextStyle(fontSize: 15, color: Colors.white),
          ),
        ),
        titlesData: FlTitlesData(
          bottomTitles: BarTitles.getBottomTitles(),
          leftTitles: BarTitles.getLeftTitles(),
        ),
        gridData: FlGridData(checkToShowHorizontalLine: (value) {
          return value % BarData.interval == 0;
        }, getDrawingHorizontalLine: (value) {
          return FlLine(
            color: Colors.white,
            strokeWidth: 0.5,
          );
        }),
        minY: 0,
        maxY: 10,
        groupsSpace: 5,
        barGroups: BarData.barData.map((data) {
          return BarChartGroupData(x: data.id, barRods: [
            BarChartRodData(
              borderRadius: BorderRadius.only(
                topLeft: Radius.circular(5),
                topRight: Radius.circular(5),
              ),
              y: data.y,
              width: 20,
              colors: [data.color],
            ),
          ]);
        }).toList()));
  }

Answer 1

如果能见到你就好了BarChartWidget()class.

为什么不使用 Expanded() 小部件包装并查看。

ListView(
  children: [
    Expanded(
      child: Column( 
        children: [
          BarChartWidget(),
          Text("Demo"),
       ],
      ),
    ),
  ],
),

或

SingleChildScrollView(
  child: 
    Expanded(
      child: Column( 
        children: [
          BarChartWidget(),
          Text("Demo"),
       ],
      ),
    ),
),

这就是您收到错误的原因： ‘Vertical viewport was given unbounded height’

如何在卡片小部件中显示 children with，其中一个 child 是 fl 条形图？

How to display children with in a card widget, and one of the child is fl bar chart?

flutter

dart

card

fl-chart