在Flutter中如何仅更改数字字体？

Question

我有一个完整的应用程序，并且正在使用自定义字体。

有没有办法使用两种字体族，一种用于文本，另一种仅用于数字？

请注意，文本和数字来自API并且它们是混合的。

- KIRAx2000

Answer 1

这是一个如何实现的示例。我使用了 GoogleFonts 来获取不同的字体，但您可以使用任何样式来获取所需的字体。正如您所看到的，您甚至可以像这样调整颜色和大小。

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

void main() => runApp(const MyApp());

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
        home: Scaffold(
            body: Center(
                child: Column(children: [
      MyText('test test 123 32123 tter213'),
      MyText('qqqqqq'),
      MyText('11111111'),
      MyText('123bla, 123 blablabla'),
    ]))));
  }
}

class MyText extends StatelessWidget {
  final String text;

  MyText(this.text, {Key? key}) : super(key: key);

  final RegExp regExp = RegExp(r'(?<=\d)(?=\D)|(?=\d)(?<=\D)');
  final RegExp number = RegExp(r'\d');

  late final List<String> split = text.split(regExp);

  @override
  Widget build(BuildContext context) {
    return RichText(
      text: TextSpan(
          children: split
              .map((e) => number.hasMatch(e)
                  ? TextSpan(
                      text: e,
                      style: GoogleFonts.vampiroOne(
                          color: Colors.red, fontSize: 30),
                    )
                  : TextSpan(
                      text: e,
                      style: GoogleFonts.poppins(),
                    ))
              .toList()),
    );
  }
}

输出：

- Ivo

Answer 2

在Flutter中，您可以使用两种不同的字体系列，但我认为Flutter不会将它们分别应用于数字和文本，您需要手动更改字体系列。

- IonicFireBaseApp