Flutter开发之CupertinoApp

Flutter开发之CupertinoApp

最近由于使用Flutter编程更多,使用Flutter更顺手,相对于其他前端框架来说,Flutter在跨平台、响应式UI、自绘引擎、即插即用的组件和庞大的社区生态支持方面有更大的优势;Flutter拥有更低的学习成本,更高的开发效率和比SwiftUI稍低的渲染性能。

在使用Flutter开发iOS风格的应用时,不可避免的使用到的组件就是CupertinoApp,它一般是应用的入口组件。

一、CupertinoApp基础

CupertinoApp在Flutter中时继承自StatefulWidget,为状态可变的组件,初始化方法为:

dart 复制代码
const CupertinoApp({
    super.key,
    this.navigatorKey,
    this.home,
    this.theme,
    Map<String, Widget Function(BuildContext)> this.routes = const <String, WidgetBuilder>{},
    this.initialRoute,
    this.onGenerateRoute,
    this.onGenerateInitialRoutes,
    this.onUnknownRoute,
    List<NavigatorObserver> this.navigatorObservers = const <NavigatorObserver>[],
    this.builder,
    this.title = '',
    this.onGenerateTitle,
    this.color,
    this.locale,
    this.localizationsDelegates,
    this.localeListResolutionCallback,
    this.localeResolutionCallback,
    this.supportedLocales = const <Locale>[Locale('en', 'US')],
    this.showPerformanceOverlay = false,
    this.checkerboardRasterCacheImages = false,
    this.checkerboardOffscreenLayers = false,
    this.showSemanticsDebugger = false,
    this.debugShowCheckedModeBanner = true,
    this.shortcuts,
    this.actions,
    this.restorationScopeId,
    this.scrollBehavior,
    @Deprecated(
      'Remove this parameter as it is now ignored. '
      'CupertinoApp never introduces its own MediaQuery; the View widget takes care of that. '
      'This feature was deprecated after v3.7.0-29.0.pre.'
    )
    this.useInheritedMediaQuery = false,
  }) : routeInformationProvider = null,
       routeInformationParser = null,
       routerDelegate = null,
       backButtonDispatcher = null,
       routerConfig = null;

const CupertinoApp.router({
    super.key,
    this.routeInformationProvider,
    this.routeInformationParser,
    this.routerDelegate,
    this.backButtonDispatcher,
    this.routerConfig,
    this.theme,
    this.builder,
    this.title = '',
    this.onGenerateTitle,
    this.color,
    this.locale,
    this.localizationsDelegates,
    this.localeListResolutionCallback,
    this.localeResolutionCallback,
    this.supportedLocales = const <Locale>[Locale('en', 'US')],
    this.showPerformanceOverlay = false,
    this.checkerboardRasterCacheImages = false,
    this.checkerboardOffscreenLayers = false,
    this.showSemanticsDebugger = false,
    this.debugShowCheckedModeBanner = true,
    this.shortcuts,
    this.actions,
    this.restorationScopeId,
    this.scrollBehavior,
    @Deprecated(
      'Remove this parameter as it is now ignored. '
      'CupertinoApp never introduces its own MediaQuery; the View widget takes care of that. '
      'This feature was deprecated after v3.7.0-29.0.pre.'
    )
    this.useInheritedMediaQuery = false,
  }) : assert(routerDelegate != null || routerConfig != null),
       navigatorObservers = null,
       navigatorKey = null,
       onGenerateRoute = null,
       home = null,
       onGenerateInitialRoutes = null,
       onUnknownRoute = null,
       routes = null,
       initialRoute = null;

组件中可以设置主题、路由、国际化等基础功能,已经满足了绝大部分应用开发的需求。

二、CupertinoApp中的属性

dart 复制代码
/// 全局的导航组件key
final GlobalKey<NavigatorState>? navigatorKey;
/// 入口页面
final Widget? home;
/// iOS风格主题,可设置对应的主题参数控制页面展示
final CupertinoThemeData? theme;
/// 顶级路由表,通过字符串定位路由
final Map<String, WidgetBuilder>? routes;
/// 初始路由
final String? initialRoute;
/// 路由封装
final RouteFactory? onGenerateRoute;
final InitialRouteListFactory? onGenerateInitialRoutes;
final RouteFactory? onUnknownRoute;
/// 导航监听
final List<NavigatorObserver>? navigatorObservers;
/// 路由状态变化
final RouteInformationProvider? routeInformationProvider;
/// 路由状态解析
final RouteInformationParser<Object>? routeInformationParser;
/// 路由代理
final RouterDelegate<Object>? routerDelegate;
/// 返回按钮调度,控制返回按钮优先级
final BackButtonDispatcher? backButtonDispatcher;
/// 路由配置,与路由代理互斥
final RouterConfig<Object>? routerConfig;
/// 路由过渡动画
final TransitionBuilder? builder;
/// 标题
final String title;
final GenerateAppTitle? onGenerateTitle;
/// 颜色
final Color? color;
/// 本地语言
final Locale? locale;
/// 国际化代理
final Iterable<LocalizationsDelegate<dynamic>>? localizationsDelegates;
/// 国际化解析回调
final LocaleListResolutionCallback? localeListResolutionCallback;
final LocaleResolutionCallback? localeResolutionCallback;
/// 支持的语言
final Iterable<Locale> supportedLocales;
/// 是否打开性能监测
final bool showPerformanceOverlay;
/// 是否打开栅格化缓存图片
final bool checkerboardRasterCacheImages;
/// 是否打开离屏渲染
final bool checkerboardOffscreenLayers;
/// 调试信息展示
final bool showSemanticsDebugger;
final bool debugShowCheckedModeBanner;
/// 组件快捷方式,可以在子组件之间共享
final Map<ShortcutActivator, Intent>? shortcuts;
/// 触发快捷方式,可以在子组件之间共享
final Map<Type, Action<Intent>>? actions;
/// 恢复id,与状态管理相关
final String? restorationScopeId;
/// 滚动行为
final ScrollBehavior? scrollBehavior;
/// MediaQuery相关,状态开关,可用于拦截
final bool useInheritedMediaQuery;
/// iOS风格Hero动画控制器
static HeroController createCupertinoHeroController() =>
      HeroController();
相关推荐
小孔龙2 分钟前
GraphicBuffer 跨进程共享
android
行业研究员29 分钟前
Android内置GPS与腾讯地图定位技术对比分析
android·android定位·腾讯地图定位
Android-Flutter1 小时前
android WMS 详解(二)
android·kotlin
stringwu1 小时前
Flutter Generative UI 深度架构剖析与官方 SDK 实战
flutter
游戏开发爱好者82 小时前
App Store 上传 IPA 自动化,.p8 密钥认证与 CI/CD 接入实战
android·运维·ci/cd·小程序·uni-app·自动化·iphone
游戏开发爱好者83 小时前
iOS 推送怎么配置,APNs 推送证书、设备库与群发
android·ios·小程序·https·uni-app·iphone·webview
唐诺3 小时前
flutter StreamController 完全使用指南
flutter·stream
wxson728218 小时前
【Android视频监控系统技术总结】
android·音视频
GitLqr18 小时前
玩转 Flutter 中的 Stack 与 Positioned:解决 UI 重叠问题的实战指南
flutter·面试·全栈