我怎样才能在flutter中实现这个半粗体文本

问题描述 投票:0回答:5

有谁知道如何使用 Flutter 获得这种半粗体效果?

enter image description here

flutter flutter-layout flutter-web flutter-text
5个回答
0
投票

您可以使用

RichText
小部件,如下所示。

RichText(
   textAlign: TextAlign.center,
   text: TextSpan(children: [
   TextSpan(text: "Are you sure you want to delete ", style: black16w700),
   TextSpan(text: "Broker Account?", style: black16w500)
]))

0
投票
    var text = RichText(
  text: TextSpan(
   
    style: const TextStyle(
      fontSize: 14.0,
      color: Colors.black,
    ),
    children: <TextSpan>[
      TextSpan(text: 'NonBOld'),
      TextSpan(text: 'Bold', style: TextStyle(fontWeight: FontWeight.bold)),
    ],
  ),
);

尝试使用具有子项的 TextSpan 小部件。


0
投票

按如下方式使用富文本小部件属性

Text.rich(
    TextSpan(
      style: TextStyle(
        fontFamily: 'Roboto',
        fontSize: 52,
        color: const Color(0xff7a7a7a),
      ),
      children: [
        TextSpan(
          text: 'arch',
          style: TextStyle(
            fontWeight: FontWeight.w700,
          ),
        ),
        TextSpan(
          text: 'Incubator',
        ),
      ],
    ),
     )

0
投票

你应该使用

RichText

RichText(
  text: TextSpan(
    text: 'Hello ',
    style: // style text,
    children: const <TextSpan>[
      TextSpan(text: 'bold', style: TextStyle(fontWeight: FontWeight.bold)),
      TextSpan(text: ' world!'),
    ],
  ),
)

阅读此文档并检查此答案


0
投票

您还可以使用 leancode_markup 包。那么你的代码应该如下所示:

MarkupText(
  'arch[b]Incubator[/b]',
  tagStyles: DefaultMarkupTheme.basicTags,
),
© www.soinside.com 2019 - 2024. All rights reserved.