Search code examples
flutterdartflutter-layout

How to set a red asterisk (*) for sign of is mandatory field in Flutter


I am trying to get a red asterisk() in a RichText widget; I can use the style property. But it will make the entire text red. I want only the asterisk() to be red. Any clue, how to make it happen?

Here is my RichText Widget, right now i am able to view a asterisk(*) in the same color as the rest of the text.

RichText(
    text: TextSpan(
        text: '$labelText *',
        style: TextStyle(
            color: labelColor, fontWeight: fontWeight, fontSize: fontSize)),
    textScaleFactor: labelTextScale,
    maxLines: labelMaxLines,
    overflow: overflow,
    textAlign: textAlign,
  );

Solution

  • I figured out how to do it. TextSpan has an attribute for children, which takes a List as value.

    So i assigned a a TextSpan for the asterisk(*).

     RichText(
        text: TextSpan(
            text: '$labelText',
            style: TextStyle(
                color: labelColor, fontWeight: fontWeight, fontSize: fontSize),
            children: [
               TextSpan(
                      text: ' *',
                      style: TextStyle(
                          color: Colors.red,
                          fontWeight: fontWeight,
                          fontSize: fontSize))
            ]),
        textScaleFactor: labelTextScale,
        maxLines: labelMaxLines,
        overflow: overflow,
        textAlign: textAlign,
      ),