如何在Flutter Web中动态更改应用程序标题？

Question

网络应用通常会在标签的标题中反映当前显示的内容。

将title parameter提供给MaterialApp或WidgetsApp意味着我不能在不重建整个树的情况下对其进行更改 ，即在以下位置调用setState我返回MaterialApp的顶层。

MaterialApp(
  title: 'Web app title',
  ...,
)

---

我希望能够随时在应用中的任何地方中更改应用标题。我该怎么办？

Answer 1

Flutter中的动态应用程序标题

可以使用SystemChrome.setApplicationSwitcherDescription在所有平台上动态更改应用 ：

@override
Widget build(BuildContext context) {
    SystemChrome.setApplicationSwitcherDescription(ApplicationSwitcherDescription(
      label: 'Dynamic web app title',
      primaryColor: Theme.of(context).primaryColor.value,
    ));


  return Container(...);
}

SystemChrome与import 'package:flutter/services.dart';一起可用，并且您想通过 setApplicationSwitcherDescription方法调用build。

这也是Title的工作方式（请参阅source code），WidgetsApp，MaterialApp等使用的小部件。

因此，您也可以使用Title小部件来代替自己访问SystemChrome：

@override
Widget build(Context context) {
  return Title(
    label: 'Dynamic app title',
    primaryColor: Theme.of(context).primaryColor.value,
    child: ..,
  );
}

label

label参数非常简单：它精确映射到您的title中的MaterialApp，而仅映射到String。

primaryColor

primaryColor将确定系统在应用程序切换器中可能使用的颜色，例如Android上最近使用的标题栏颜色。
这是int的 Color ，这就是为什么您需要调用Color.value将原色转换为整数的原因。

与其他Title s的干扰

设置了setApplicationSwitcherDescription的{​​{1}}属性时，您可能会问自己是调用Title还是插入title小部件会导致任何问题。
答案是：否，因为树中最深处的小部件将设置标题。本质上，即使整个应用程序都进行了重建，假设您在儿童中调用它，您的MaterialApp也将在setApplicationSwitcherDescription之后被调用，因此您将覆盖 {{1 }}标题。