flutter 如何使CupertinoApp中的材质设计小部件使用与CupertinoThemeData相同的亮度颜色?

xxhby3vn  于 2023-01-09  发布在  Flutter
关注(0)|答案(1)|浏览(131)

我的库比蒂诺应用程序包括一个材料设计风格的小部件(导航轨道)。我想所有的小部件使用相同的主题。
我的一些代码:

@override
Widget build(BuildContext context) {
  final Brightness platformBrightness = WidgetsBinding.instance.window.platformBrightness;
  return Theme(
    data: ThemeData(
      brightness: platformBrightness,
    ),
    child: CupertinoApp(
      onGenerateTitle: (context) => S.of(context).AppName,
      localizationsDelegates: const [
        GlobalMaterialLocalizations.delegate,
        GlobalWidgetsLocalizations.delegate,
        GlobalCupertinoLocalizations.delegate,
        S.delegate
      ],
      supportedLocales: S.delegate.supportedLocales,
      theme: CupertinoThemeData(
        brightness: platformBrightness,
      ),
      home: const Scaffold(
        resizeToAvoidBottomInset: false,
        body: SafeArea(
          bottom: false,
          child: HomePage(),
        ),
      ),
    ),
  );
}

主页返回

return Row(
  children: <Widget>[
    SingleChildScrollView(
      controller: ScrollController(),
      scrollDirection: Axis.vertical,
      child: IntrinsicHeight(
        child: AppRightSideControls(_controller.future),
      ),
    ),
    const VerticalDivider(thickness: 1, width: 1),
    // This is the main content.
    Expanded(
      ...
    ),
  ],
);

class AppRightSideControls extends StatelessWidget {
  ...

  @override
  Widget build(BuildContext context) {
    return FutureBuilder(
      future: _webViewControllerFuture,
      builder:
          (BuildContext context, AsyncSnapshot<WebViewController> snapshot) {
        ...
        return NavigationRail(
          labelType: NavigationRailLabelType.all,
          ...
        );
      },
    );
  }
}

我试着把CupertinoApp作为主题的子项。让ThemeData和CupertinoThemeData使用相同的亮度。但是我得到了黑色和白色两种颜色。
第一节第一节第一节第一节第一次

nkkqxpd9

nkkqxpd91#

我已经通过cupertinoOverrideTheme和ColorScheme解决了这个问题。

theme: ThemeData(
        brightness: Brightness.light,
        cupertinoOverrideTheme: const CupertinoThemeData(
            barBackgroundColor: Color(0xF0F9F9F9),
            brightness: Brightness.light,
            textTheme:
                CupertinoTextThemeData(primaryColor: CupertinoColors.label)),
        colorScheme: ColorScheme.fromSeed(
          seedColor: CupertinoColors.activeBlue,
          surface: const Color(0xF0F9F9F9),
          onSurface: CupertinoColors.label,
          onBackground: CupertinoColors.label,
          background: const Color(0xF0F9F9F9),
          brightness: Brightness.light,
        ),
        dividerColor: CupertinoColors.secondarySystemFill,
      ),
darkTheme: ThemeData(
        cupertinoOverrideTheme: const CupertinoThemeData(
            barBackgroundColor: Color(0xFF1b1b1b),
            brightness: Brightness.dark,
            textTheme: CupertinoTextThemeData(primaryColor: Colors.white)),
        brightness: Brightness.dark,
        primaryColor: CupertinoColors.systemBackground,
        colorScheme: ColorScheme.fromSeed(
          seedColor: CupertinoColors.activeOrange,
          surface: CupertinoColors.black,
          onSurface: CupertinoColors.white,
          onBackground: CupertinoColors.white,
          background: CupertinoColors.black,
          brightness: Brightness.dark,
        ),
        scaffoldBackgroundColor: CupertinoColors.black,
        dialogBackgroundColor: CupertinoColors.black,
        dividerColor: CupertinoColors.systemFill,
      ),

相关问题