如何在Android端Flutter应用中修改文本选中高亮颜色

解决方案 #

你遇到的问题是Flutter中可选中文本的样式默认继承主题主色，当主色为黑色时会和黑色文本重叠，无法区分选中区域。提供两种修改方案：

方案1：仅修改当前页面的选中样式 #

直接给页面内的每个SelectableText组件添加selectionColor参数即可快速生效，示例修改代码如下：

SelectableText(
  global!.config.aboutText1!,
  textDirection: TextDirection.rtl,
  // 新增选中颜色配置，可自定义透明度和色值
  selectionColor: Colors.blue.withOpacity(0.3),
  style: TextStyle(
      fontSize: 20, height: 1.6, fontWeight: FontWeight.w500),
)

将页面内其余3个SelectableText都加上同样的selectionColor配置即可。

方案2：全局修改全应用的文本选中样式 #

如果需要所有页面的可选中文本（包括输入框文本）都生效，直接修改项目根目录的MaterialApp主题配置即可，无需单独修改每个组件：

MaterialApp(
  title: '你的应用名',
  theme: ThemeData(
    // 新增文本选中主题配置
    textSelectionTheme: TextSelectionThemeData(
      selectionColor: Colors.blue.withOpacity(0.3), // 选中区域背景色
      cursorColor: Colors.blue, // 输入框光标颜色
      selectionHandleColor: Colors.blue, // 选中文本两端的拖动手柄颜色
    ),
    // 你原来的其他主题配置保持不变
  ),
  home: 你的首页组件,
)

注：Flutter 2.0及以上版本废弃了之前直接在ThemeData中设置selectionColor的写法，统一通过textSelectionTheme管控，这也是之前尝试修改未生效的常见原因。

内容的提问来源于stack exchange，提问作者Jaffer Alfahdawi