Flutter - 更改 SearchDelegate 的搜索提示文本
Flutter - Change search hint text of SearchDelegate
在 SearchDelegate
的当前实现中,没有更改提示文本的选项。当查询为空时,搜索屏幕在查询字段中显示 "Search" 作为提示文本。
提示文本当前在第 395 行定义如下:
final String searchFieldLabel = MaterialLocalizations.of(context).searchFieldLabel;
然而,有一个existing issue to this subject reported。
我无法为此提出任何解决方案。
您知道该问题的解决方法吗?
通过创建您自己的 DefaultMaterialLocalizations
class 并将其传递到 MaterialApp
小部件中可以解决此问题:
void main() => runApp(SearchApp());
class SearchApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
localizationsDelegates: [
CustomLocalizationDelegate(),
],
home: Scaffold(
appBar: AppBar(
title: Text('Search demo'),
),
body: Center(
child: Builder(
builder: (context) => MaterialButton(
child: Text('Search'),
onPressed: () => showSearch(
context: context,
delegate: DummyDelegate(),
),
),
),
),
),
);
}
}
class DummyDelegate extends SearchDelegate<String> {
@override
List<Widget> buildActions(BuildContext context) => [];
@override
Widget buildLeading(BuildContext context) => IconButton(
icon: Icon(Icons.close),
onPressed: () => Navigator.of(context).pop(),
);
@override
Widget buildResults(BuildContext context) => Text('Result');
@override
Widget buildSuggestions(BuildContext context) => Text('Suggestion');
}
class CustomLocalizationDelegate extends LocalizationsDelegate<MaterialLocalizations> {
const CustomLocalizationDelegate();
@override
bool isSupported(Locale locale) => locale.languageCode == 'en';
@override
Future<MaterialLocalizations> load(Locale locale) => SynchronousFuture<MaterialLocalizations>(const CustomLocalization());
@override
bool shouldReload(CustomLocalizationDelegate old) => false;
@override
String toString() => 'CustomLocalization.delegate(en_US)';
}
class CustomLocalization extends DefaultMaterialLocalizations {
const CustomLocalization();
@override
String get searchFieldLabel => "My hint text";
}
目前 SearchDelegate 有一个可选成员 "searchFieldLabel" 来指定搜索字段的标签。
它应该看起来像这样:
@override
String get searchFieldLabel => 'custom label';
就提示颜色而言,如果您仍在寻找解决方案,HintColor 将不起作用。像这样使用 ThemeData 的 InputDecoration 属性:
inputDecorationTheme: InputDecorationTheme(hintStyle: Theme.of(context).textTheme.title.copyWith(color: Colors.white),)
class SongSearch extends SearchDelegate<String> {
SongSearch({
String hintText = "Song Search",
}) : super(
searchFieldLabel: hintText,
keyboardType: TextInputType.text,
textInputAction: TextInputAction.search,
);
.....
您可以只扩展源代码 class 并在您的构造函数中覆盖它的默认字段来为该字段定义您自己的值吗?
例如:
class CustomSearch extends SearchDelegate<String> {
CustomSearch() : super(searchFieldLabel: "My own hint");
}
有了 null-safety,你应该这样做:
class MyDelegate extends SearchDelegate<String> {
final String? hintText;
MyDelegate({this.hintText});
@override
String? get searchFieldLabel => hintText;
// Other overrides...
}
用法:
showSearch<String>(
context: context,
delegate: MyDelegate(hintText: 'My hint'),
);
在 SearchDelegate
的当前实现中,没有更改提示文本的选项。当查询为空时,搜索屏幕在查询字段中显示 "Search" 作为提示文本。
提示文本当前在第 395 行定义如下:
final String searchFieldLabel = MaterialLocalizations.of(context).searchFieldLabel;
然而,有一个existing issue to this subject reported。
我无法为此提出任何解决方案。 您知道该问题的解决方法吗?
通过创建您自己的 DefaultMaterialLocalizations
class 并将其传递到 MaterialApp
小部件中可以解决此问题:
void main() => runApp(SearchApp());
class SearchApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
localizationsDelegates: [
CustomLocalizationDelegate(),
],
home: Scaffold(
appBar: AppBar(
title: Text('Search demo'),
),
body: Center(
child: Builder(
builder: (context) => MaterialButton(
child: Text('Search'),
onPressed: () => showSearch(
context: context,
delegate: DummyDelegate(),
),
),
),
),
),
);
}
}
class DummyDelegate extends SearchDelegate<String> {
@override
List<Widget> buildActions(BuildContext context) => [];
@override
Widget buildLeading(BuildContext context) => IconButton(
icon: Icon(Icons.close),
onPressed: () => Navigator.of(context).pop(),
);
@override
Widget buildResults(BuildContext context) => Text('Result');
@override
Widget buildSuggestions(BuildContext context) => Text('Suggestion');
}
class CustomLocalizationDelegate extends LocalizationsDelegate<MaterialLocalizations> {
const CustomLocalizationDelegate();
@override
bool isSupported(Locale locale) => locale.languageCode == 'en';
@override
Future<MaterialLocalizations> load(Locale locale) => SynchronousFuture<MaterialLocalizations>(const CustomLocalization());
@override
bool shouldReload(CustomLocalizationDelegate old) => false;
@override
String toString() => 'CustomLocalization.delegate(en_US)';
}
class CustomLocalization extends DefaultMaterialLocalizations {
const CustomLocalization();
@override
String get searchFieldLabel => "My hint text";
}
目前 SearchDelegate 有一个可选成员 "searchFieldLabel" 来指定搜索字段的标签。 它应该看起来像这样:
@override
String get searchFieldLabel => 'custom label';
就提示颜色而言,如果您仍在寻找解决方案,HintColor 将不起作用。像这样使用 ThemeData 的 InputDecoration 属性:
inputDecorationTheme: InputDecorationTheme(hintStyle: Theme.of(context).textTheme.title.copyWith(color: Colors.white),)
class SongSearch extends SearchDelegate<String> {
SongSearch({
String hintText = "Song Search",
}) : super(
searchFieldLabel: hintText,
keyboardType: TextInputType.text,
textInputAction: TextInputAction.search,
);
.....
您可以只扩展源代码 class 并在您的构造函数中覆盖它的默认字段来为该字段定义您自己的值吗?
例如:
class CustomSearch extends SearchDelegate<String> {
CustomSearch() : super(searchFieldLabel: "My own hint");
}
有了 null-safety,你应该这样做:
class MyDelegate extends SearchDelegate<String> {
final String? hintText;
MyDelegate({this.hintText});
@override
String? get searchFieldLabel => hintText;
// Other overrides...
}
用法:
showSearch<String>(
context: context,
delegate: MyDelegate(hintText: 'My hint'),
);