dart - 如何在搜索代表上添加hintText？

Question

如何在Flutter showSearch()上更改提示文本和提示文本颜色

 AppBar(
        backgroundColor: Colors.blue,
        centerTitle: true,
        title: appBarIcon(context),
        actions: <Widget>[
          IconButton(
              icon: Icon(Icons.search),
              onPressed: () {
                showSearch(
                    context: context,
                    delegate: CustomSearchDelegateAssets(_searchdata, widget.regId));
              })
        ],
      ),

Answer 1

根据showSearch方法的the sources，它只是推送了一条新路由 _SearchPageRoute 。

此内部定义的路由提供了一个有状态的小部件(_SearchPage)，该小部件由一个新建的AppBar和其中的文本字段组成。

您需要做的是基于_SearchPageRoute创建一个自定义路由，返回自定义_SearchPage。需要通过基于showSearch逻辑的自己的方法来推送路由。

要实现自定义hintText和hintStyle，请在您的自定义InputDecoration中修改_SearchPageState。

例如MySearchPageRoute

class MySearchPageRoute<T> extends PageRoute<T> {
  // ...
  @override
  Widget buildPage(
    BuildContext context,
    Animation<double> animation,
    Animation<double> secondaryAnimation,
  ) {
    return MySearchPage<T>( // KEY PROP: Custom stateful widget based on `_SearchPage`
      delegate: delegate,
      animation: animation,
    );
  }
  // ...
}

MySearchPage:

class MySearchPage<T> extends StatefulWidget {
  // ...
  @override
  State<StatefulWidget> createState() => MySearchPageState<T>();
}
class MySearchPageState<T> extends State<MySearchPage<T>> {
  // ...
  @override
  Widget build(BuildContext context) {
    // ...
    return Semantics(
      // ...
      child: Scaffold(
        appBar: AppBar(
          // ...
          title: TextField(
            // ...
            decoration: InputDecoration(
              border: InputBorder.none,
              hintText: "My Custom Search Label", // KEY PROP
              hintStyle: TextStyle(color: Colors.red), // KEY PROP
            ),
          ),
          // ...
        ),
        // ...
      )
    );
  }
  // ...
}

推路线:

Future<T> showMySearch<T>({
  @required BuildContext context,
  @required SearchDelegate<T> delegate,
  String query = '',
}) {
  // ...
  return Navigator.of(context).push(MySearchPageRoute<T>( // KEY PROP
    delegate: delegate,
  ));
}

换句话说-只需复制 _SearchPageRoute， _SearchPage， _SearchPageState和 showSearch from the sources即可。然后在我用 // KEY PROP标记的行中进行更改。