Flutter中Firebase获取的时间整数补前导零问题排查

问题根源 #

1. 存储环节：你将timeInput.hour和timeInput.minute（整数类型）直接存入Firebase，当小时/分钟为个位数时，Firebase会存储为单个数字（比如5而非05），没有保留前导零的格式。
2. 显示环节：调取数据时直接将整数转为字符串拼接，个位数整数转字符串不会自动补前导零，所以出现9:5这类不符合预期的格式。

解决方案 #

两种处理方式选其一即可：

方式一：存储时直接存格式化后的时间字符串

写入Firebase时，不要拆分存储小时和分钟，先格式化为两位数字的字符串再存储：

// 把选择的时间格式化为两位数字的小时和分钟
String formattedHour = timeInput.hour.toString().padLeft(2, '0');
String formattedMinute = timeInput.minute.toString().padLeft(2, '0');
String formattedTime = "$formattedHour:$formattedMinute";

// 将formattedTime存入Firebase，替代原来分开存的timeHour和timeMinute

方式二：读取数据时补前导零再显示

如果已经按整数拆分存储了小时和分钟，在显示时对数字做补零处理：

// 从Firebase获取到timeHour和timeMinute（整数类型）后，先格式化
String displayHour = timeHour.toString().padLeft(2, '0');
String displayMinute = timeMinute.toString().padLeft(2, '0');

// 再用于UI显示
Padding(
  padding: EdgeInsets.only(left: 8.0, bottom: 8.0),
  child: Text(
    "$dateEvent at $displayHour:$displayMinute",
    style: const TextStyle(
      fontSize: 12,
      fontWeight: FontWeight.w400,
    ),
  ),
),

补充说明 #

你当前时间选择器里的timeInput.format(context)能正确显示两位数字，是因为这个方法内部已经做了补零逻辑，但你没有复用这个格式化结果去存储，而是拆分存了整数，才导致后续显示出问题。

内容的提问来源于stack exchange，提问作者Mutant52