Flutter：Text Widget无法显示Double/Int的原因及解决方法

一、错误根源 #

你遇到的Method invocation is not a constant expression错误，核心原因是在const修饰的Widget树中使用了非常量的实例变量：

• 代码里给SizedBox和内部的Row都加了const关键字，而bid、offer是State类的实例变量（不是编译时常量），在const上下文里调用bid.toString()或者$bid都会触发错误——const Widget要求所有子元素的参数必须是编译期可确定的常量。
• 另外代码存在语法错误：double offer = roundNumber((2.75, 2);多了一个左括号，应修正为double offer = roundNumber(2.75, 2);

二、在Text中显示数值类型的最佳方式 #

1. 基础实现（常用） #

字符串插值或toString()方法本身完全可行，只要避开const Widget上下文：

// 字符串插值写法
Text('$bid')
// toString()写法
Text(bid.toString())

2. 格式化数值（推荐） #

如果需要控制小数位数、千分位等格式，可使用以下方式：

// 保留指定小数位数
Text(bid.toStringAsFixed(2))

// 控制有效数字位数
Text(bid.toStringAsPrecision(3))

// 使用intl包做更复杂格式化（需先在pubspec.yaml添加intl依赖）
import 'package:intl/intl.dart';
Text(NumberFormat("#,##0.00").format(bid))

三、你的代码修复方案 #

只需去掉SizedBox和内部Row的const关键字，同时修正语法错误：

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

class BuyXSO extends StatefulWidget {
 const BuyXSO({super.key});

 @override
 State<BuyXSO> createState() => _BuyXSOState();
}

class _BuyXSOState extends State<BuyXSO> {
 double bid = roundNumber(1.324, 2);
 // 修正语法错误：移除多余的左括号
 double offer = roundNumber(2.75, 2);

 double roundNumber(double value, int places) {
  num val = pow(10.0, places);
  return ((value * val).round().toDouble() / val);
 }

@override
Widget build(BuildContext context) {
 return Column(
     children: [

      //XSO Ticker
      Padding(
        padding: const EdgeInsets.all(15.0),
        child: Container(
          padding: EdgeInsets.all(15.0),
          decoration: BoxDecoration(
            borderRadius: BorderRadius.circular(5),
            border: Border.all(color: const Color.fromARGB(255, 218, 216, 216)),
          ),

          // 去掉const关键字
          child: SizedBox(
            height: 50,
            // 去掉const关键字
            child: Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                Row(
                  children: [
                    const Text('XSocial',
                      style: TextStyle(fontSize: 18),
                    ),
                    const Text(' XSO',
                      style: TextStyle(fontSize: 18, fontWeight: FontWeight.bold,),
                    ),
                  ],
                ),
            
                const VerticalDivider(
                  color: Color.fromARGB(255, 218, 216, 216),
                  thickness: 1,
                ),
            
                Column(
                  children: [
                    const Text('BID',
                      style: TextStyle(fontSize: 12, color: Colors.black54),
                    ),
                    Text(
                      bid.toString(),
                      style: const TextStyle(
                        fontSize: 18,
                        fontWeight: FontWeight.bold,
                        color: Color.fromARGB(255, 2, 160, 68),
                      ),
                    ),
                  ],
                ),

                const VerticalDivider(
                  color: Color.fromARGB(255, 218, 216, 216),
                  thickness: 1,
                ),
                
                Column(
                  children: [
                    const Text('OFFER',
                      style: TextStyle(fontSize: 12, color: Colors.black54),
                    ),
                    Text(
                      offer.toString(),
                      style: const TextStyle(
                        fontSize: 18,
                        fontWeight: FontWeight.bold,
                        color: Color.fromARGB(255, 2, 160, 68),
                      ),
                    ),
                  ],
                ),
              ],
            ),
          ),
        ),
      ),
    ],
  );
 }
}

四、常见导致数值无法显示的原因 #

• const上下文冲突：在const修饰的Widget中使用非常量的实例变量/方法调用，是本次问题的核心原因。
• 语法错误：变量初始化代码写错（如多余括号），导致变量无法正常赋值。
• 空值未处理：数值变量为null且未做空安全处理，会触发空指针错误（可使用bid?.toString() ?? "0"处理）。
• 类型传递错误：直接将数值类型传给Text的data参数（Text仅接受String类型）。

内容的提问来源于stack exchange，提问作者Cliff Odebala Clarke