flutter - Flutter SearchDelegate：如何从文本光标更改蓝色气泡的颜色并选择？

Question

Flutter SearchDelegate：如何在颤动中更改搜索委托小部件中蓝色气泡的颜色？

环境：sdk：">=2.12.0 <3.0.0"

在我的 Scaffold-Appbar 中，我有一个带有 IconButton 的操作，然后我调用 DataSearch。然后我在 DataSearch 中设置 ThemeData appBarTheme。而已。

      appBar: AppBar(
        title: Text(widget.title),
        actions: [
          IconButton(
            icon: const Icon(Icons.search),
            onPressed: () {
              showSearch(context: context, delegate: DataSearch());
            },
          ),
        ],
      ),


class DataSearch extends SearchDelegate<String> {
  @override
  ThemeData appBarTheme(BuildContext context) {
    return ThemeData(
      textSelectionTheme: TextSelectionThemeData(
        //cursorColor: Colors.red,
        selectionHandleColor: Colors.red,
        //selectionColor: Colors.white,
      ), // cursor color
    );
  }

标签： flutterdart

Answer 1

您可以textSelectionTheme通过设置selectionHandleColor来更改其中的颜色。

textSelectionTheme: TextSelectionThemeData(
        selectionHandleColor: Colors.red, // Change bubble to red
        cursorColor: Colors.white,
      ), 

编辑：完整示例

import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData(
        textSelectionTheme: TextSelectionThemeData(
          selectionHandleColor: Colors.red,
        ),
        primaryColor: Colors.green,
      ),
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        appBar: AppBar(
          title: TextField(),
        ),
        body: Center(
          child: Text('MyApp'),
        ),
      ),
    );
  }
}

结果：