【问题标题】:Flutter: How to theme material widgets in Cupertino theme?Flutter:如何在 Cupertino 主题中为材质小部件设置主题?
【发布时间】:2021-07-07 09:09:58
【问题描述】:

我有一个 Flutter 应用程序,它使用适用于 Android 的 Material 主题和适用于 iOS 的 Cupertino 主题。但是我在两个主题中都使用了 Card 小部件,它是一个 Material 小部件。现在我在main.dart中有以下代码

Widget build(BuildContext context) => PlatformProvider(
      builder: (BuildContext context) => PlatformApp(
            cupertino: (_, __) => CupertinoAppData(
                theme: CupertinoThemeData(brightness: Brightness.light, ...)),
            material: (_, __) => MaterialAppData(
                theme: ThemeData(
                  brightness: Brightness.light,
                  primarySwatch: Colors.deepPurple,
                  cardTheme: CardTheme(
                    color: Colors.grey,
                    ...
                  )
                  ...
                ),),
......

如您所见,Card 小部件使用 Material ThemeData 中的 cardTheme 进行主题化,但在 CupertinoThemeData 中没有对应的 cardTheme。所以在 iOS 上,Cards 只使用他们的默认主题。

那么我如何在 Cupertino 主题中为 Card 之类的 Material 小部件设置主题?

【问题讨论】:

    标签: flutter flutter-cupertino flutter-theme


    【解决方案1】:

    遇到了我尝试使用MaterialBasedCupertinoThemeData https://api.flutter.dev/flutter/material/MaterialBasedCupertinoThemeData-class.html 的相同问题,但它不正确地尊重黑暗主题。最终,我找到了如何将 MaterialTheme 与 CupertinoTheme 同时结合并正确应用暗/亮主题的解决方案:

    @override
    Widget build(BuildContext context) {
      final Brightness platformBrightness = WidgetsBinding.instance!.window.platformBrightness;
      return Theme(
        data: ThemeData(brightness: platformBrightness),
        child: CupertinoApp(
          theme: CupertinoThemeData(
            brightness: platformBrightness,
          ),
        ),
      );
    }
    

    【讨论】:

    • 这个实现能顺利处理主题转换吗?我认为你需要 CupertinoDynamicColor 来做到这一点。
    猜你喜欢
    • 2021-10-03
    • 2023-03-17
    • 1970-01-01
    • 2016-01-25
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2018-10-12
    • 1970-01-01
    相关资源
    最近更新 更多