Search code examples
flutterdartflutter-layout

How to change selected text color locally - flutter


Text selection color can be changed by globally setting the theme:

    theme: ThemeData.light().copyWith(
        accentColor: kPrimaryAccent,
        primaryColor: kPrimaryColor,
        textSelectionColor: kTextSelectionColor,
        textSelectionHandleColor: kPrimaryAccent)

But how can this be done locally in a single text-field?


Solution

  • Since the property mentioned in Mobina answer become deprecated, here is how you do it in early 2022:

    Container(
      child: Theme(
        data: ThemeData(
          textSelectionTheme: const TextSelectionThemeData(
            cursorColor: Colors.yellow,
            selectionColor: Colors.green,
            selectionHandleColor: Colors.blue,
          )
        ),
        child: SelectableText(
          'this is a text',
        ),
      ),
    ),
    

    Source: TextSelectionTheme migration