我正在尝试使用自定义 SearchDelegate 自定义搜索的外观,但似乎覆盖 appBarTheme
仅更新某些主题样式。我可以更改应用栏的颜色和文本样式,但我似乎忽略了其他设置,例如高程和装饰。
如何自定义搜索委托(delegate)输入装饰和应用栏高度?
我错过了什么吗?这是预期的行为吗?
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)
使海拔为零.我无法让输入装饰以相同的方式工作,我确实在应用程序主题代码的根目录中添加了该行,但它似乎不起作用。
代码Root主题代码如下:
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 里面的 Theme 如下:
@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),
),
);
}
希望这可以帮助!
关于Flutter 搜索无法覆盖某些主题样式,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58345121/