我正在尝试使用自定义SearchDelegate自定义搜索的外观,但似乎覆盖appBarTheme
仅更新某些主题样式。我可以更改应用栏的颜色和文本样式,但似乎忽略了其他设置,例如高程和装饰。
如何自定义搜索代表输入的装饰和应用栏的标高?
我想念什么吗?这是预期的行为吗?
import 'package:flutter/material.dart';
void main() => runApp(MyApp());
class MyApp extends StatefulWidget {
@override
_MyAppState createState() => _MyAppState();
}
class _MyAppState extends State<MyApp> with WidgetsBindingObserver {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Title',
home: Scaffold(
appBar: AppBar(
actions: [
Builder(
builder: (context) => IconButton(
icon: Icon(Icons.search),
onPressed: () => showSearch(context: context, delegate: CustomSearchDelegate()),
),
),
],
),
),
);
}
}
class CustomSearchDelegate extends SearchDelegate {
@override
List<Widget> buildActions(BuildContext context) => [
if (query.isNotEmpty)
IconButton(
icon: Icon(Icons.close),
onPressed: () {
query = "";
showSuggestions(context);
},
)
];
@override
Widget buildLeading(BuildContext context) => IconButton(
tooltip: 'Back',
icon: AnimatedIcon(icon: AnimatedIcons.menu_arrow, progress: transitionAnimation),
onPressed: () => close(context, null),
);
@override
Widget buildSuggestions(BuildContext context) => Text("Suggestions go here");
@override
Widget buildResults(BuildContext context) => Text("Results go here");
@override
ThemeData appBarTheme(BuildContext context) {
final ThemeData theme = Theme.of(context);
return theme.copyWith(
primaryColor: Colors.white,
primaryIconTheme: theme.primaryIconTheme.copyWith(color: Colors.green),
primaryColorBrightness: Brightness.dark,
textTheme: theme.textTheme.copyWith(
title: TextStyle(fontWeight: FontWeight.normal),
),
// these ↓ do not work ☹️
appBarTheme: theme.appBarTheme.copyWith(color: Colors.black12, elevation: 0),
inputDecorationTheme: theme.inputDecorationTheme.copyWith(border: UnderlineInputBorder()),
);
}
}
我设法通过添加appBarTheme: AppBarTheme(elevation: 0.0, color: Colors.black12)
将标高设为零。我无法以相同的方式使输入修饰正常工作,我确实在应用程序主题代码的根目录中添加了该行,但似乎不起作用。
代码根主题代码如下:
class MyApp extends StatelessWidget {
// This widget is the root of your application.
@override
Widget build(BuildContext context) {
return MaterialApp(
theme: ThemeData(
backgroundColor: Colors.white,
appBarTheme: AppBarTheme(elevation: 0.0, color: Colors.black12),//elevation did work
inputDecorationTheme:
InputDecorationTheme(border: UnderlineInputBorder()),//this did not imply
title: 'Flutter Demo',
home: MyHomePage(),
);
}
}
并且SearchDelegate内部的主题如下:
@override
ThemeData appBarTheme(BuildContext context) {
assert(context != null);
final ThemeData theme = Theme.of(context);
assert(theme != null);
return theme.copyWith(
primaryColor: Colors.white,
primaryIconTheme: theme.primaryIconTheme.copyWith(color: Colors.green),
primaryColorBrightness: Brightness.dark,
textTheme: theme.textTheme.copyWith(
title: TextStyle(fontWeight: FontWeight.normal),
),
);
}
希望这会有所帮助!