Flutter开发中如何将String类型数据转换为Offset与Color类型

你上传时调用toString()生成的字符串格式固定，直接提取对应字段做类型转换即可完成还原，不需要额外依赖。

1. Color类型还原 #

上传生成的Color字符串固定为Color(0xff000000)格式，括号内是带0x前缀的十六进制ARGB色值，解析逻辑如下：

Color strToColor(String colorStr) {
  // 提取括号内的十六进制色值段
  final hex = colorStr.split('(0x')[1].split(')')[0];
  return Color(int.parse(hex, radix: 16));
}

2. Offset类型还原 #

上传生成的Offset字符串固定为Offset(x坐标, y坐标)格式，括号内是逗号分隔的两个浮点数，解析逻辑如下：

Offset strToOffset(String offsetStr) {
  // 提取括号内的坐标段
  final coordPart = offsetStr.split('(')[1].split(')')[0];
  final xy = coordPart.split(',');
  return Offset(
    double.parse(xy[0].trim()),
    double.parse(xy[1].trim())
  );
}

拉取数据时的使用示例 #

从Firestore拉取到存储的字符串数据后，直接调用上述方法批量转换即可：

// 从Firestore文档拿到数据Map
final firestoreData = doc.data() as Map<String, dynamic>;

final lineModel = DrawingLineModel(
  // 遍历Offset字符串列表，逐个转成Offset实例
  pointList: (firestoreData['pointList'] as List)
      .map((e) => strToOffset(e.toString()))
      .toList(),
  color: strToColor(firestoreData['colorString'].toString()),
  strokeWidth: double.parse(firestoreData['strokeWidth'].toString()),
);

补充说明：当前字符串解析方案依赖Flutter对Offset、Color的toString()默认输出格式，若后续Flutter版本修改了这两个类的字符串输出规则，解析会失败。更稳定的持久化方案是上传时直接存储基础类型：Color存对应的int色值、Offset存包含dx/dy两个浮点值的Map，拉取时不需要做字符串解析，兼容性更强。

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