Merge branch 'develop' of github.com:alibaba/flutter-common-widgets-app into develop

ios/Runner.xcodeproj/project.pbxproj

@@ -8,9 +8,9 @@
 
 /* Begin PBXBuildFile section */
 		1498D2341E8E89220040F4C2 /* GeneratedPluginRegistrant.m in Sources */ = {isa = PBXBuildFile; fileRef = 1498D2331E8E89220040F4C2 /* GeneratedPluginRegistrant.m */; };
-		2D5378261FAA1A9400D5DBA9 /* flutter_assets in Resources */ = {isa = PBXBuildFile; fileRef = 2D5378251FAA1A9400D5DBA9 /* flutter_assets */; };
 		333E5DAE7FC10AC69FEC26C0 /* libPods-Runner.a in Frameworks */ = {isa = PBXBuildFile; fileRef = DDA792F029EDD7A11295D192 /* libPods-Runner.a */; };
 		3B3967161E833CAA004F5970 /* AppFrameworkInfo.plist in Resources */ = {isa = PBXBuildFile; fileRef = 3B3967151E833CAA004F5970 /* AppFrameworkInfo.plist */; };
+		2D5378261FAA1A9400D5DBA9 /* flutter_assets in Resources */ = {isa = PBXBuildFile; fileRef = 2D5378251FAA1A9400D5DBA9 /* flutter_assets */; };
 		3B80C3941E831B6300D905FE /* App.framework in Frameworks */ = {isa = PBXBuildFile; fileRef = 3B80C3931E831B6300D905FE /* App.framework */; };
 		3B80C3951E831B6300D905FE /* App.framework in Embed Frameworks */ = {isa = PBXBuildFile; fileRef = 3B80C3931E831B6300D905FE /* App.framework */; settings = {ATTRIBUTES = (CodeSignOnCopy, RemoveHeadersOnCopy, ); }; };
 		9705A1C61CF904A100538489 /* Flutter.framework in Frameworks */ = {isa = PBXBuildFile; fileRef = 9740EEBA1CF902C7004384FC /* Flutter.framework */; };
@@ -40,8 +40,8 @@
 /* Begin PBXFileReference section */
 		1498D2321E8E86230040F4C2 /* GeneratedPluginRegistrant.h */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.h; path = GeneratedPluginRegistrant.h; sourceTree = "<group>"; };
 		1498D2331E8E89220040F4C2 /* GeneratedPluginRegistrant.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = GeneratedPluginRegistrant.m; sourceTree = "<group>"; };
-		2D5378251FAA1A9400D5DBA9 /* flutter_assets */ = {isa = PBXFileReference; lastKnownFileType = folder; name = flutter_assets; path = Flutter/flutter_assets; sourceTree = SOURCE_ROOT; };
 		3B3967151E833CAA004F5970 /* AppFrameworkInfo.plist */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text.plist.xml; name = AppFrameworkInfo.plist; path = Flutter/AppFrameworkInfo.plist; sourceTree = "<group>"; };
+		2D5378251FAA1A9400D5DBA9 /* flutter_assets */ = {isa = PBXFileReference; lastKnownFileType = folder; name = flutter_assets; path = Flutter/flutter_assets; sourceTree = SOURCE_ROOT; };
 		3B80C3931E831B6300D905FE /* App.framework */ = {isa = PBXFileReference; lastKnownFileType = wrapper.framework; name = App.framework; path = Flutter/App.framework; sourceTree = "<group>"; };
 		7AFA3C8E1D35360C0083082E /* Release.xcconfig */ = {isa = PBXFileReference; lastKnownFileType = text.xcconfig; name = Release.xcconfig; path = Flutter/Release.xcconfig; sourceTree = "<group>"; };
 		7AFFD8ED1D35381100E5BB4D /* AppDelegate.h */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.h; path = AppDelegate.h; sourceTree = "<group>"; };
@@ -90,9 +90,9 @@
 		9740EEB11CF90186004384FC /* Flutter */ = {
 			isa = PBXGroup;
 			children = (
-				2D5378251FAA1A9400D5DBA9 /* flutter_assets */,
 				3B80C3931E831B6300D905FE /* App.framework */,
 				3B3967151E833CAA004F5970 /* AppFrameworkInfo.plist */,
+				2D5378251FAA1A9400D5DBA9 /* flutter_assets */,
 				9740EEBA1CF902C7004384FC /* Flutter.framework */,
 				9740EEB21CF90195004384FC /* Debug.xcconfig */,
 				7AFA3C8E1D35360C0083082E /* Release.xcconfig */,
@@ -209,8 +209,8 @@
 			files = (
 				97C147011CF9000F007C117D /* LaunchScreen.storyboard in Resources */,
 				3B3967161E833CAA004F5970 /* AppFrameworkInfo.plist in Resources */,
-				97C146FE1CF9000F007C117D /* Assets.xcassets in Resources */,
 				2D5378261FAA1A9400D5DBA9 /* flutter_assets in Resources */,
+				97C146FE1CF9000F007C117D /* Assets.xcassets in Resources */,
 				97C146FC1CF9000F007C117D /* Main.storyboard in Resources */,
 			);
 			runOnlyForDeploymentPostprocessing = 0;

lib/common/widget_demo.dart

@@ -154,7 +154,7 @@ class _WidgetDemoState extends State<WidgetDemo> {
           new IconButton(
             tooltip: 'goBack home',
             onPressed: () {
-              Navigator.popUntil(context, ModalRoute.withName('/'));
+              Navigator.popUntil(context, ModalRoute.withName('/home'));
             },
             icon: Icon(Icons.home),
           ),

lib/common/widget_name_to_icon.dart

@@ -145,6 +145,15 @@ class WidgetName2Icon {
     "SimpleDialog":Icons.message,
     "ScaffoldState":Icons.local_bar,
     "GridTile":Icons.apps,
-    "MergeableMaterialItem":Icons.view_list
+    "MergeableMaterialItem":Icons.view_list,
+    "CupertinoApp":Icons.face,
+    "CupertinoButton":Icons.crop_7_5,
+    "CupertinoColors":Icons.color_lens,
+    "CupertinoIcons":Icons.insert_emoticon,
+    "CupertinoNavigationBar":Icons.payment,
+    "CupertinoPageRoute":Icons.router,
+    "CupertinoPageScaffold":Icons.pages,
+    "CupertinoPicker":Icons.add_alarm,
+    "CupertinoPopupSurface":Icons.center_focus_weak,
   };
 }

lib/components/disclaimer_msg.dart

@@ -35,7 +35,7 @@ class DisclaimerMsgState extends State<DisclaimerMsg> {
     final SharedPreferences prefs = await _prefs;
     final bool unKnow = value;
     setState(() {
-      _unKnow = prefs.setBool("disclaimer", unKnow).then((bool success) {
+      _unKnow = prefs.setBool("disclaimer::Boolean", unKnow).then((bool success) {
         return unKnow;
       });
     });
@@ -46,7 +46,7 @@ class DisclaimerMsgState extends State<DisclaimerMsg> {
     super.initState();
     //获取SharedPreferences 存储结果
     _unKnow = _prefs.then((SharedPreferences prefs) {
-      return (prefs.getBool('disclaimer') ?? false);
+      return (prefs.getBool('disclaimer::Boolean') ?? false);
     });
     _unKnow.then((bool value) {
       _valBool = value;

lib/model/collection_general.dart

@@ -50,7 +50,6 @@ class CollectionControlModel {
     List list = await sql.getByCondition();
     List<CollectionGeneral> resultList = [];
     list.forEach((item){
-      print(item);
       resultList.add(CollectionGeneral.fromJSON(item));
     });
     return resultList;

lib/views/collection_page.dart

@@ -104,7 +104,7 @@ class _CollectionPageState extends State<CollectionPage> {
           color: Theme.of(context).primaryColor,
         ),
         title: Text(
-          _collectionList[index - 1].name,
+          Uri.decodeComponent(_collectionList[index - 1].name),
           overflow: TextOverflow.ellipsis,
           style: TextStyle(fontSize: 17.0),
         ),
@@ -112,8 +112,9 @@ class _CollectionPageState extends State<CollectionPage> {
             Icon(Icons.keyboard_arrow_right, color: Colors.grey, size: 30.0),
         onTap: () {
           if (_collectionList[index - 1].router.contains('http')) {
+            // 注意这里title已经转义过了
             Application.router.navigateTo(context,
-                '${Routes.webViewPage}?title=${Uri.encodeComponent(_collectionList[index - 1].name)}&url=${Uri.encodeComponent(_collectionList[index - 1].router)}');
+                '${Routes.webViewPage}?title=${_collectionList[index - 1].name}&url=${Uri.encodeComponent(_collectionList[index - 1].router)}');
           } else {
             Application.router
                 .navigateTo(context, "${_collectionList[index - 1].router}");

lib/views/first_page.dart

@@ -30,20 +30,22 @@ class FirstPageState extends State<FirstPage> with AutomaticKeepAliveClientMixin
     if (key == null) {
        key = GlobalKey<DisclaimerMsgState>();
       //获取sharePre
-      _unKnow = _prefs.then((SharedPreferences prefs) {
-        return (prefs.getBool('disclaimer') ?? false);
-      });
+       _unKnow = _prefs.then((SharedPreferences prefs) {
+         return (prefs.getBool('disclaimer::Boolean') ?? false);
+       });
+
       /**
        * 判断是否需要弹出免责声明,已经勾选过不在显示,就不会主动弹
        */
       _unKnow.then((bool value) {
          print("==========FirstPageState========_unKnow========${value}");
-        if (!value) {
-          key.currentState.showAlertDialog(context);
-        }
+         new Future.delayed(const Duration(seconds: 1),(){
+           if (!value) {
+            key.currentState.showAlertDialog(context);
+           }
+         });
       });
     }
-   
   }
 
 
@@ -51,12 +53,18 @@ class FirstPageState extends State<FirstPage> with AutomaticKeepAliveClientMixin
     const juejin_flutter = 'https://timeline-merger-ms.juejin.im/v1/get_tag_entry?src=web&tagId=5a96291f6fb9a0535b535438';
     var pageIndex = (params is Map) ? params['pageIndex'] : 0;
     final _param  = {'page':pageIndex,'pageSize':20,'sort':'rankIndex'};
+    var responseList = [];
+    var  pageTotal = 0;
+
+    try{
+      var response = await NetUtils.get(juejin_flutter, params: _param);
+      responseList = response['d']['entrylist'];
+      pageTotal = response['d']['total'];
+      if (!(pageTotal is int) || pageTotal <= 0) {
+        pageTotal = 0;
+      }
+    }catch(e){
 
-    var response = await NetUtils.get(juejin_flutter, params: _param);
-    var responseList = response['d']['entrylist'];
-    var  pageTotal = response['d']['total'];
-    if (!(pageTotal is int) || pageTotal <= 0) {
-      pageTotal = 0;
     }
     pageIndex += 1;
     List resultList = new List();

lib/views/home.dart

@@ -43,8 +43,8 @@ class _MyHomePageState extends State<AppPage>
   static List tabData = [
     {'text': '业界动态', 'icon': new Icon(Icons.language)},
     {'text': 'WIDGET', 'icon': new Icon(Icons.extension)},
-    {'text': '组件收藏', 'icon': new Icon(Icons.star)},
-    {'text': '关于手册', 'icon': new Icon(Icons.favorite)}
+    {'text': '组件收藏', 'icon': new Icon(Icons.favorite)},
+    {'text': '关于手册', 'icon': new Icon(Icons.import_contacts)}
   ];
 
   List<Widget> myTabs = [];
@@ -139,12 +139,7 @@ class _MyHomePageState extends State<AppPage>
               indicatorWeight: 3.0,
               labelColor: Theme.of(context).primaryColor,
               unselectedLabelColor: const Color(0xFF8E8E8E),
-              tabs: <Tab>[
-                Tab(text: '业界动态', icon: Icon(Icons.language)),
-                Tab(text: '组件', icon: Icon(Icons.extension)),
-                Tab(text: '组件收藏', icon: Icon(Icons.favorite)),
-                Tab(text: '关于手册', icon: Icon(Icons.line_weight)),
-              ],
+              tabs: myTabs
             ),
           ),
         ),

lib/views/web_view_page.dart

@@ -10,6 +10,7 @@ import '../model/collection.dart';
 import '../event/event-bus.dart';
 import '../event/event-model.dart';
 import 'package:fluttertoast/fluttertoast.dart';
+import 'dart:core';
 
 class WebViewPage extends StatefulWidget {
   final String url;
@@ -38,7 +39,7 @@ class _WebViewPageState extends State<WebViewPage> {
   @override
   void initState() {
     super.initState();
-    _collectionControl.getRouterByName(widget.title.trim()).then((list) {
+    _collectionControl.getRouterByName(Uri.encodeComponent(widget.title.trim())).then((list) {
       
       list.forEach((item) {
         if(widget.title.trim() == item['name']){
@@ -57,7 +58,7 @@ class _WebViewPageState extends State<WebViewPage> {
   _getCollection() {
     if (_hasCollected) {
       // 删除操作
-      _collectionControl.deleteByName(widget.title.trim()).then((result) {
+      _collectionControl.deleteByName(Uri.encodeComponent(widget.title.trim())).then((result) {
         if (result > 0 && this.mounted) {
           setState(() {
             _hasCollected = false;
@@ -75,7 +76,7 @@ class _WebViewPageState extends State<WebViewPage> {
     } else {
       // 插入操作
       _collectionControl
-          .insert(Collection(name: widget.title.trim(), router: widget.url))
+          .insert(Collection(name:Uri.encodeComponent(widget.title.trim()) , router: widget.url))
           .then((result) {
         if (this.mounted) {
           setState(() {

lib/widgets/components/Bar/AppBar/index.dart

@@ -48,7 +48,7 @@ class _DemoState extends State<Demo> {
   Widget build(BuildContext context) {
     return WidgetDemo(
       title: 'AppBar',
-      codeUrl: 'componentss/Bar/AppBar/demo.dart',
+      codeUrl: 'components/Bar/AppBar/demo.dart',
       contentList: [allDomes(context, this)],
       docUrl: 'https://docs.flutter.io/flutter/material/AppBar-class.html',
     );

lib/widgets/components/Navigation/BottomNavigationBar/demo.dart

@@ -45,6 +45,12 @@ class _BottomNavigationBarFullDefault extends State {
             title: new Text("List"), icon: new Icon(Icons.list)),
         BottomNavigationBarItem(
             title: new Text("Message"), icon: new Icon(Icons.message)),
+        BottomNavigationBarItem(
+            title: new Text("add"), icon: new Icon(Icons.add)),
+        BottomNavigationBarItem(
+            title: new Text("menu"), icon: new Icon(Icons.menu)),
+        BottomNavigationBarItem(
+            title: new Text("other"), icon: new Icon(Icons.devices_other)),
 
       ],
     );

lib/widgets/components/Navigation/BottomNavigationBar/index.dart

@@ -25,7 +25,7 @@ const String _text1 =
 """### **基本用法**
 > BottomNavigationBar 底部导航栏通常与Scaffold结合使用
 - 它作为 Scaffold.bottomNavigationBar 参数;
-- BottomNavigationBar 支持0-4个之间个底部按钮数量，超出4个系统将会报异常;
+- BottomNavigationBar 3-5个之间个底部按钮数量是合理的，理论上 icon 大小合适，可以支持更多;
 - 默认0-3个底部按钮数量时，BottomNavigationBar采用fixed的模式摆放底部按钮，当有4个时默认使用 BottomNavigationBarType.shifting 模式摆放底部按钮;
 - 下面的底部导航即是效果;
 """;

lib/widgets/themes/Cupertino/CupertinoApp/demo.dart

@@ -0,0 +1,172 @@
+/**
+ * Created with Android Studio.
+ * User: ryan
+ * Date: 2019/1/20
+ * Time: 上午11:34
+ * email: zhu.yan@alibaba-inc.com
+ * tartget: CupertinoApp 的示例
+ */
+
+import 'package:flutter/cupertino.dart';
+import 'package:flutter/material.dart';
+
+/*
+* Checkbox 默认按钮的实例
+* index 当前checkbox 的索引值
+* */
+class CupertinoAppFullDefault extends StatefulWidget {
+  const CupertinoAppFullDefault() : super();
+
+  @override
+  State<StatefulWidget> createState() => _CupertinoAppFullDefault();
+}
+
+/*
+* CupertinoApp 默认的实例,有状态
+* */
+class _CupertinoAppFullDefault extends State {
+
+  RouterHandler(setting){
+    //setting.isInitialRoute; bool类型 是否初始路由
+    //setting.name; 要跳转的路由名key
+    return PageRouteBuilder(
+        pageBuilder: (BuildContext context, _, __) {
+          //这里为返回的Widget
+          return HomePage();
+        },
+        opaque: false,
+        //跳转动画
+        transitionDuration: Duration(milliseconds: 200),
+        transitionsBuilder: (___, Animation<double> animation, ____, Widget child) {
+          return FadeTransition(
+            opacity: animation,
+            child: new ScaleTransition(
+              scale: new Tween<double>(begin: 0.5, end: 1.0)
+                  .animate(animation),
+              child: child,
+            ),
+          );
+        }
+      );
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return SizedBox(
+        height: MediaQuery.of(context).size.height,
+        width: MediaQuery.of(context).size.width,
+        //height: 500.0,
+        child: CupertinoApp(
+          title: '这里是标题',// 设备用于识别用户的应用程序的单行描述
+          builder: (BuildContext context,Widget child) { // 覆盖下面的所有界面,一般当作追加属性用
+            //return Container(child:Text('这里是内容1',style:TextStyle(color:Colors.black)));
+            return MediaQuery(// 当构建一个Widget前,调用一般做字体大小，方向，主题颜色等配置
+              //字体大小
+              data: MediaQuery.of(context).copyWith(textScaleFactor: 1.4),
+              child: child
+            );
+          },
+          checkerboardOffscreenLayers:false, // 打开渲染到屏幕外位图的图层的checkerboarding
+          checkerboardRasterCacheImages:false, // 打开光栅缓存图像的检查板。
+          debugShowCheckedModeBanner:true,// 在debug模式下打开一个小“DEBUG”横幅，表示该应用程序处于检查模式
+          color: Colors.red, // 该颜色为程序切换中应用图标背景的颜色，当应用图标背景为透明时
+//          home: HomePage(),// 进入程序后显示的第一个页面,传入的是一个Widget，但实际上这个Widget需要包裹一个Scaffold
+          home: CupertinoPageScaffold(// 进入程序后显示的第一个页面,传入的是一个Widget，但实际上这个Widget需要包裹一个Scaffold
+            navigationBar: CupertinoNavigationBar(
+              leading: Icon(CupertinoIcons.back),
+              middle: Text('Title'),
+              trailing: Icon(CupertinoIcons.share),
+            ),
+            child:Container( // home 对应的内容和 router对应的内容，同时存在
+                padding: const EdgeInsets.only(bottom: 60.0),
+                alignment: Alignment.center,
+                child:Text('这里是 home 属性对应的内容',style:TextStyle(color:Colors.black))
+            ), // 应用程序默认路由,（Navigator.defaultRouteName，即/）
+         ),
+          initialRoute:'/home',// 如果构建了导航器，则显示的第一条路径的名称,初始路由，当用户进入程序时，自动打开对应的路由。(home还是位于一级)传入的是上面routes的key
+          locale:Locale('zh', 'CH'),// 本地化初始值
+          localeResolutionCallback: (local,support){// 区域分辨回调,当传入的是不支持的语种，可以根据这个回调，返回相近,并且支持的语种
+            return const Locale('us','uk');
+          },
+          localizationsDelegates:[], // 本地化委托，用于更改Flutter Widget默认的提示语，按钮text等,返回一个 继承自 LocalizationsDelegate 的对象
+          navigatorKey:GlobalKey(), // 导航主键 GlobalKey<NavigatorState>
+          navigatorObservers: [ // 路由观察器，当调用Navigator的相关方法时，会回调相关的操作
+            MyObserver(),
+          ],
+          onGenerateRoute: (setting){ // 当通过Navigation.of(context).pushNamed跳转路由时，在routes查找不到时，会调用该方法
+            RouterHandler(setting);
+          },
+          onGenerateTitle: (context){ // 跟上面的tiitle一样，但含有一个context参数用于做本地化
+            return 'Flutter应用';
+          },
+          onUnknownRoute: (setting){ // 效果跟onGenerateRoute一样调用顺序为onGenerateRoute ==> onUnknownRoute
+            //RouterHandler(setting);
+          },
+          routes: { // 声明程序中有哪个通过Navigation.of(context).pushNamed跳转的路由参数以键值对的形式传递key:路由名字value:对应的Widget
+            '/home':(BuildContext context) => HomePage(),
+            '/home/one':(BuildContext context) => OnePage(),
+          },
+          showPerformanceOverlay:false, // 当为true时应用程序顶部覆盖一层GPU和UI曲线图，可即时查看当前流畅度情况
+          showSemanticsDebugger:false, // 当为true时，打开Widget边框，类似Android开发者模式中显示布局边界
+          supportedLocales:[// 传入支持的语种数组
+            const Locale('uok'),
+            const Locale('meg'),
+          ],
+        )
+    );
+  }
+
+  Widget homeBuild(BuildContext context) {
+    return CupertinoTabScaffold(
+        tabBar: CupertinoTabBar(
+            backgroundColor: CupertinoColors.white,
+            items: const <BottomNavigationBarItem>[
+              BottomNavigationBarItem(
+                icon: ImageIcon(
+                    AssetImage('assets/images/btn_icon_dingyuehao_normal.png')),
+                title: Text('Tab 1'),
+              ),
+              BottomNavigationBarItem(
+                icon: ImageIcon(
+                    AssetImage('assets/images/btn_icon_dingyuehao_normal.png')),
+                title: Text('Tab 2'),
+              ),
+            ]),
+        tabBuilder: (BuildContext context, int index) {
+          return CupertinoPageScaffold(
+            navigationBar: CupertinoNavigationBar(
+              backgroundColor: CupertinoColors.destructiveRed,
+              middle: Text('这里是标题', style: TextStyle(color: Colors.white)),
+            ),
+            child: Center(child: Text('这里是内容', style: TextStyle(color: Colors.black))),
+            backgroundColor: CupertinoColors.extraLightBackgroundGray,
+          );
+        }
+    );
+  }
+}
+
+class MyObserver extends NavigatorObserver{
+  @override
+  void didPush(Route route, Route previousRoute) {
+    // 当调用Navigator.push时回调
+    super.didPush(route, previousRoute);
+    //可通过route.settings获取路由相关内容
+    //route.currentResult获取返回内容
+    print('MyObserver 路由观察器:${route.settings.name}');
+  }
+}
+
+class HomePage extends StatelessWidget{
+  @override
+  Widget build(BuildContext context){
+    return Center(child:Text('HomePage',style:TextStyle(color:Colors.black)));
+  }
+}
+
+class OnePage extends StatelessWidget{
+  @override
+  Widget build(BuildContext context){
+    return Center(child:Text('OnePage',style:TextStyle(color:Colors.red)));
+  }
+}

lib/widgets/themes/Cupertino/CupertinoApp/index.dart

@@ -0,0 +1,53 @@
+/*
+ * @Author: 一凨 
+ * @Date: 2018-12-27 16:25:22 
+ * @Last Modified by: 一凨
+ * @Last Modified time: 2019-01-07 15:52:45
+ */
+import 'package:flutter/material.dart';
+import '../../../../common/widget_demo.dart';
+import './demo.dart' as demoBox;
+
+const String content0 = '''
+### **简介**
+> Cupertino 苹果设计风格的应用,用于创建 iOS 风格应用的顶层组件( Cupertino 苹果电脑的全球总公司所在地，位于美国旧金山 )
+- 它包含了 iOS 应用程序，通常需要的许多 widget;
+- 它的构建于基于 iOS 的 WidgetsApp 特定的默认值，如字体和物理滚动;
+''';
+
+const String content1 = '''
+### **基本用法**
+> CupertinoApp 的主要特性
+- top 级别的 Navigator 搜索的配置，需要遵循以下规则优先级
+  - 首先,对于 根路由 "/", 使用 home 属性，前提是 home 属性不为空; 
+  - 如果没设置home，则使用 routes 属性，它应用程序的顶级路由表；
+  - 如果 home 和 routes 都没有做有效配置，则调用onGenerateRoute（如果提供），并且返回非null值；
+  - 最后，如果所有其他方法都失败onUnknownRoute被调用；
+  - 如果 home，routes，onGenerateRoute和onUnknownRoute 都为null，并且builder不为null，则不会创建任何Navigator；
+  - 如果配置了顶级 Navigator 的 observer，则可以做 Hero 动画；
+- 在 Android 上谨慎使用此 widget，因为它可能会产生 Android 用户不同的行为，例如：
+  - 通过反向滑动可以禁用页面；
+  - 滚动到底或者顶，会触发 ios 风格的弹性效果；
+  - 某些苹果字体系列在 Android上 不可用，可能导致未定义的字体提示。
+''';
+
+class Demo extends StatefulWidget {
+  static const String routeName = '/themes/Cupertino/CupertinoApp';
+  _DemoState createState() => _DemoState();
+}
+
+class _DemoState extends State<Demo> {
+  @override
+  Widget build(BuildContext context) {
+    return WidgetDemo(
+      contentList: [
+        content0,
+        content1,
+        demoBox.CupertinoAppFullDefault()
+      ],
+      title: 'CupertinoApp',
+      docUrl: 'https://docs.flutter.io/flutter/cupertino/CupertinoApp-class.html',
+      codeUrl: '/themes/Cupertino/CupertinoApp/demo.dart',
+    );
+  }
+}

lib/widgets/themes/Cupertino/CupertinoButton/demo.dart

@@ -0,0 +1,41 @@
+/**
+ * Created with Android Studio.
+ * User: ryan
+ * Date: 2019/1/20
+ * Time: 上午11:34
+ * email: zhu.yan@alibaba-inc.com
+ * tartget: CupertinoButton 的示例
+ */
+
+import 'package:flutter/cupertino.dart';
+import 'package:flutter/material.dart';
+
+/*
+* Checkbox 默认按钮的实例
+* index 当前checkbox 的索引值
+* */
+class CupertinoButtonFullDefault extends StatefulWidget {
+  const CupertinoButtonFullDefault() : super();
+
+  @override
+  State<StatefulWidget> createState() => _CupertinoButtonFullDefault();
+}
+
+/*
+* CupertinoButton 默认的实例,有状态
+* */
+class _CupertinoButtonFullDefault extends State {
+
+  @override
+  Widget build(BuildContext context) {
+    return CupertinoButton(
+      borderRadius: BorderRadius.all(Radius.circular(15.0)),
+      onPressed: () {
+        print('on Pressed!');
+      },
+      pressedOpacity:0.5,// 按下后的按钮不透明度
+      color:CupertinoColors.darkBackgroundGray,
+      child: new Text('CupertinoButton'),
+    );
+  }
+}

lib/widgets/themes/Cupertino/CupertinoButton/index.dart

@@ -0,0 +1,45 @@
+/**
+ * Created with Android Studio.
+ * User: 一晟
+ * Date: 2019/1/20
+ * Time: 下午10:57
+ * email: zhu.yan@alibaba-inc.com
+ * tartget: CupertinoButton 的示例
+ */
+import 'package:flutter/material.dart';
+import '../../../../common/widget_demo.dart';
+import './demo.dart' as demoBox;
+
+const String content0 = '''
+### **简介**
+> ios 风格的 button
+- 与普通的 button 一样，需要设置 text 或者 icon, 不同的是带有 fades out 效果;
+- 同时可以设置一个背景颜色;
+''';
+
+const String content1 = '''
+### **基本用法**
+> CupertinoButton 的一个是示例
+- 属性基本和 flatButton,raisedButton 类似
+''';
+
+class Demo extends StatefulWidget {
+  static const String routeName = '/themes/Cupertino/CupertinoButton';
+  _DemoState createState() => _DemoState();
+}
+
+class _DemoState extends State<Demo> {
+  @override
+  Widget build(BuildContext context) {
+    return WidgetDemo(
+      contentList: [
+        content0,
+        content1,
+        demoBox.CupertinoButtonFullDefault()
+      ],
+      title: 'CupertinoButton',
+      docUrl: 'https://docs.flutter.io/flutter/cupertino/CupertinoButton-class.html',
+      codeUrl: '/themes/Cupertino/CupertinoButton/demo.dart',
+    );
+  }
+}

lib/widgets/themes/Cupertino/CupertinoColors/demo.dart

@@ -0,0 +1,51 @@
+/**
+ * Created with Android Studio.
+ * User: ryan
+ * Date: 2019/1/20
+ * Time: 上午11:34
+ * email: zhu.yan@alibaba-inc.com
+ * tartget: CupertinoColors 的示例
+ */
+
+import 'package:flutter/cupertino.dart';
+import 'package:flutter/material.dart';
+
+/*
+* Checkbox 默认按钮的实例
+* index 当前checkbox 的索引值
+* */
+class CupertinoColorsFullDefault extends StatefulWidget {
+  const CupertinoColorsFullDefault() : super();
+
+  @override
+  State<StatefulWidget> createState() => _CupertinoColorsFullDefault();
+}
+
+/*
+* CupertinoColors 默认的实例,有状态
+* */
+class _CupertinoColorsFullDefault extends State {
+
+  Widget setColorsView(Cupertino_colors){
+    return Container(
+        width: MediaQuery.of(context).size.width-100,
+        padding: const EdgeInsets.all(10.0),
+        child:Text('activeBlue',style:TextStyle(color:Colors.white)),
+        decoration:BoxDecoration(color: Cupertino_colors)
+    );
+  }
+  @override
+  Widget build(BuildContext context) {
+    return Column(
+      children: <Widget>[
+        setColorsView(CupertinoColors.activeBlue),
+        setColorsView(CupertinoColors.activeGreen),
+        setColorsView(CupertinoColors.black),
+        setColorsView(CupertinoColors.destructiveRed),
+        setColorsView(CupertinoColors.inactiveGray),
+        setColorsView(CupertinoColors.lightBackgroundGray),
+        setColorsView(CupertinoColors.white)
+      ],
+    );
+  }
+}

lib/widgets/themes/Cupertino/CupertinoColors/index.dart

@@ -0,0 +1,42 @@
+/**
+ * Created with Android Studio.
+ * User: 一晟
+ * Date: 2019/1/20
+ * Time: 下午10:57
+ * email: zhu.yan@alibaba-inc.com
+ * tartget: CupertinoButton 的示例
+ */
+import 'package:flutter/material.dart';
+import '../../../../common/widget_demo.dart';
+import './demo.dart' as demoBox;
+
+const String content0 = '''
+### **简介**
+> iOS平台常用的颜色
+''';
+
+const String content1 = '''
+### **基本用法**
+> CupertinoColors 的一个是示例
+''';
+
+class Demo extends StatefulWidget {
+  static const String routeName = '/themes/Cupertino/CupertinoColors';
+  _DemoState createState() => _DemoState();
+}
+
+class _DemoState extends State<Demo> {
+  @override
+  Widget build(BuildContext context) {
+    return WidgetDemo(
+      contentList: [
+        content0,
+        content1,
+        demoBox.CupertinoColorsFullDefault()
+      ],
+      title: 'CupertinoColors',
+      docUrl: 'https://docs.flutter.io/flutter/cupertino/CupertinoColors-class.html',
+      codeUrl: '/themes/Cupertino/CupertinoColor/demo.dart',
+    );
+  }
+}

lib/widgets/themes/Cupertino/CupertinoIcons/demo.dart

@@ -0,0 +1,88 @@
+/**
+ * Created with Android Studio.
+ * User: ryan
+ * Date: 2019/1/20
+ * Time: 上午11:34
+ * email: zhu.yan@alibaba-inc.com
+ * tartget: CupertinoIcons 的示例
+ */
+
+import 'package:flutter/cupertino.dart';
+import 'package:flutter/material.dart';
+import 'package:flutter_go/common/icon_names.dart' as icon_names;
+
+/*
+* CupertinoIcons 默认的实例
+* */
+class CupertinoIconsFullDefault extends StatefulWidget {
+  const CupertinoIconsFullDefault() : super();
+
+  @override
+  State<StatefulWidget> createState() => _CupertinoIconsFullDefault();
+}
+
+/*
+* CupertinoIcons 默认的实例,有状态
+* */
+class _CupertinoIconsFullDefault extends State {
+
+  final colorsList = [];
+  final List<Widget> widgetList = [];
+
+  Widget rowView(IconData itA,IconData itB){
+    //print('itA=====>${itA.fontPackage}');
+    return Row(
+      //mainAxisSize:MainAxisSize.max,
+      //crossAxisAlignment: CrossAxisAlignment.start,
+      //mainAxisAlignment: MainAxisAlignment.start,
+      children: <Widget>[
+        Expanded(
+          flex:1,
+          child: CupertinoButton(
+            padding: EdgeInsets.only(left: 0),
+            child:FlatButton.icon(
+                label: Text('默认按钮', semanticsLabel: 'Add'),
+                icon:Icon(itA,
+                semanticLabel: 'Add',
+            ),
+            onPressed: () { },
+        ))),
+        Expanded(
+            flex:1,
+            child: CupertinoButton(
+                padding: EdgeInsets.zero,
+                child:FlatButton.icon(
+                  label: Text('默认按钮', semanticsLabel: 'Add'),
+                  icon:Icon(itB,
+                    semanticLabel: 'Add',
+                  ),
+                  onPressed: () { },
+                ))),
+      ],
+    );
+  }
+
+  @override
+  void initState() {
+    super.initState();
+
+    final names = icon_names.CupertinoIIconNames.names;
+    for(var i=0;i<names.length-2;i++){
+      if(i%2 == 0){
+        widgetList.add(rowView(names[i],names[i+1]));
+      }
+    }
+  }
+
+  Widget build(BuildContext context) {
+    return
+      Align(
+          //alignment: Alignment.center,
+          //width: MediaQuery.of(context).size.width,
+          child:Column(
+          //verticalDirection: VerticalDirection.down,
+          mainAxisAlignment: MainAxisAlignment.spaceBetween,
+          children: widgetList
+      ));
+  }
+}

lib/widgets/themes/Cupertino/CupertinoIcons/index.dart

@@ -0,0 +1,44 @@
+/**
+ * Created with Android Studio.
+ * User: 一晟
+ * Date: 2019/1/20
+ * Time: 下午10:57
+ * email: zhu.yan@alibaba-inc.com
+ * tartget: CupertinoButton 的示例
+ */
+import 'package:flutter/material.dart';
+import '../../../../common/widget_demo.dart';
+import './demo.dart' as demoBox;
+
+const String content0 = '''
+### **简介**
+> Cupertino图标的标识符
+- 与Icon类一起使用以显示特定图标;
+- 请确保cupertino_icons在项目的pubspec.yaml文件中添加依赖项。这可确保CupertinoIcons字体包含在您的应用程序中;
+''';
+
+const String content1 = '''
+### **基本用法**
+> CupertinoIcons 的一个示例
+''';
+
+class Demo extends StatefulWidget {
+  static const String routeName = '/themes/Cupertino/CupertinoIcons';
+  _DemoState createState() => _DemoState();
+}
+
+class _DemoState extends State<Demo> {
+  @override
+  Widget build(BuildContext context) {
+    return WidgetDemo(
+      contentList: [
+        content0,
+        content1,
+        demoBox.CupertinoIconsFullDefault()
+      ],
+      title: 'CupertinoIcons',
+      docUrl: 'https://docs.flutter.io/flutter/cupertino/CupertinoIcons-class.html',
+      codeUrl: '/themes/Cupertino/CupertinoColor/demo.dart',
+    );
+  }
+}

lib/widgets/themes/Cupertino/CupertinoNavigationBar/demo.dart

@@ -0,0 +1,138 @@
+/**
+ * Created with Android Studio.
+ * User: ryan
+ * Date: 2019/1/20
+ * Time: 上午11:34
+ * email: zhu.yan@alibaba-inc.com
+ * tartget: CupertinoNavigationBar 的示例
+ */
+
+import 'package:flutter/cupertino.dart';
+import 'package:flutter/material.dart';
+
+/*
+* CupertinoNavigationBar 默认的实例
+* */
+class CupertinoNavigationBarFullDefault extends StatefulWidget {
+  const CupertinoNavigationBarFullDefault() : super();
+
+  @override
+  State<StatefulWidget> createState() => _CupertinoNavigationBarFullDefault();
+}
+
+/*
+* CupertinoNavigationBar 默认的实例,有状态
+* */
+class _CupertinoNavigationBarFullDefault extends State {
+
+  @override
+  Widget build2(BuildContext context) {
+    return SizedBox(
+      height: MediaQuery.of(context).size.height,
+      width: MediaQuery.of(context).size.width,
+      //height: 500.0,
+      child:CupertinoApp(
+      home: CupertinoTabScaffold(
+        tabBar: CupertinoTabBar(
+          items: const <BottomNavigationBarItem>[
+            BottomNavigationBarItem(
+              icon: Icon(CupertinoIcons.share),
+              title: Text('Tab 1'),
+            ),
+            BottomNavigationBarItem(
+              icon: Icon(CupertinoIcons.share),
+              title: Text('Tab 2'),
+            ),
+          ],
+        ),
+        tabBuilder: (BuildContext context, int index) {
+          // For 1-indexed readability.
+          ++index;
+          return CupertinoTabView(
+            builder: (BuildContext context) {
+              return CupertinoPageScaffold(
+                navigationBar: CupertinoNavigationBar(
+                  middle: Text('Page 1 of tab $index'),
+                ),
+                child: Center(
+                  child: CupertinoButton(
+                    child: const Text('Next'),
+                    onPressed: () {
+                      Navigator.of(context).push(
+                        CupertinoPageRoute<void>(
+                          builder: (BuildContext context) {
+                            return CupertinoPageScaffold(
+                              navigationBar: CupertinoNavigationBar(
+                                middle: Text('Page 2 of tab $index'),
+                              ),
+                              child: Center(
+                                child: CupertinoButton(
+                                  child: const Text('Back'),
+                                  onPressed: () {
+                                    Navigator.of(context).pop();
+                                  },
+                                ),
+                              ),
+                            );
+                          },
+                        ),
+                      );
+                    },
+                  ),
+                ),
+              );
+            },
+          );
+        },
+      ),
+     )
+    );
+  }
+
+  Widget build(BuildContext context) {
+    return SizedBox(
+        height: MediaQuery.of(context).size.height/1.5,
+        child: navigationBar(context)
+    );
+  }
+
+  Widget navigationBar(BuildContext context) {
+    return CupertinoPageScaffold( // 进入程序后显示的第一个页面,传入的是一个Widget，但实际上这个Widget需要包裹一个Scaffold
+      navigationBar: CupertinoNavigationBar(
+        leading: Icon(CupertinoIcons.back),// 放置在导航栏的开头。通常是正常页面的后退按钮或完整页面对话框的取消按钮
+        middle: Text('Title'),// 放置在导航栏的中间。通常是标题或分段控件
+        trailing: Icon(CupertinoIcons.share),// 放置在导航栏的末尾。通常在页面上执行其他操作，例如搜索或编辑功能
+        actionsForegroundColor:CupertinoColors.white,// 用于 导航栏中前导和尾随小部件的文本和图标的默认颜色。
+        backgroundColor:CupertinoColors.activeOrange,// 导航栏的背景颜色。如果它包含透明度，标签栏将自动对其背后的内容产生模糊效果
+        border:Border( // 边框样式
+          bottom: BorderSide(color: CupertinoColors.inactiveGray, width: 1.0),
+        ),
+        //heroTag :null,
+        previousPageTitle:'???',// 自动隐含前导按钮时手动指定上一个路线的标题
+        transitionBetweenRoutes:true // 是否在导航栏之间转换
+      ),
+      child: Center(
+          child: Text('这里是内容', style: TextStyle(color: Colors.black))
+      ), // 应用程序默认路由,（Navigator.defaultRouteName，即/）
+    );
+  }
+
+  Widget tabBar(BuildContext context){
+    return CupertinoTabBar(
+        items: const <BottomNavigationBarItem>[
+          BottomNavigationBarItem(
+            icon: Icon(CupertinoIcons.home),
+            title: Text('Home'),
+          ),
+          BottomNavigationBarItem(
+            icon: Icon(CupertinoIcons.conversation_bubble),
+            title: Text('Support'),
+          ),
+          BottomNavigationBarItem(
+            icon: Icon(CupertinoIcons.profile_circled),
+            title: Text('Profile'),
+          ),
+        ]
+    );
+  }
+}

lib/widgets/themes/Cupertino/CupertinoNavigationBar/index.dart

@@ -0,0 +1,54 @@
+/**
+ * Created with Android Studio.
+ * User: 一晟
+ * Date: 2019/1/20
+ * Time: 下午10:57
+ * email: zhu.yan@alibaba-inc.com
+ * tartget: CupertinoNavigationBar 的示例
+ */
+import 'package:flutter/material.dart';
+import '../../../../common/widget_demo.dart';
+import './demo.dart' as demoBox;
+
+const String content0 = '''
+### **简介**
+> ios 风格的 导航栏
+- 构成 toolbar 的最基本 widget,常规页面的 title,在 toolbar 居中显示;
+- 当居中显示时,它支持通过设置 leading 和 trailing 属性对应的 widget，来决定是在中间 widget 前面还是后面显示;
+- leading widget 将自动的成为一个返回 chevron icon button（或全屏对话框的关闭按钮）,如果没有提供，则弹出当前路由，并且automaticallyImplyLeading为true（默认为true）;
+- 如果没有提供，并且 automaticallyImplyIdle 为true,则中间的 widget 将自动成为当前 CupertinoPageRoute 中的 title。
+- 它应该被放在屏幕的顶部，并自动占据操作系统的状态栏。
+- 如果给定 backgroundColor 的不透明度不是1.0（默认情况下为1.0），它将对其后面的内容产生模糊效果。
+- 当路 transitionBetweenRoutes 为 true，如果被切换的路由还拥有一个 CupertinaVigationBar 或一个 CupertinoSiverNavigationBar，并且 transitionBetweenRoutes 设置为 true，则此导航栏将在路由顶部而不是在路由内部进行切换。
+- 如果 transitionBetweenRoutes 为 true，则任何 widget 的参数，都不能在其子树中包含 key，因为该 widget 将同时存在于树中的多个位置。
+- 默认情况下，每个页面路由中只应存在一个 CupertinaVigationBar 或 CupertinoSiverNavigationBar，以支持默认切换。
+- 使用 transitionBetweenRoutes 或 Herotag 可自定义每个路由的多个导航栏的切换行为。
+''';
+
+const String content1 = '''
+### **基本用法**
+> CupertinoNavigationBar 的一个示例
+- 通常被 CupertinoPageScaffold 包裹
+''';
+
+class Demo extends StatefulWidget {
+  static const String routeName = '/themes/Cupertino/CupertinoNavigationBar';
+  _DemoState createState() => _DemoState();
+}
+
+class _DemoState extends State<Demo> {
+  @override
+  Widget build(BuildContext context) {
+    return WidgetDemo(
+      contentList: [
+        content0,
+        content1,
+        demoBox.CupertinoNavigationBarFullDefault(),
+        SizedBox(height:50)
+      ],
+      title: 'CupertinoApp',
+      docUrl: 'https://docs.flutter.io/flutter/cupertino/CupertinoNavigationBar-class.html',
+      codeUrl: '/themes/Cupertino/CupertinoNavigationBar/demo.dart',
+    );
+  }
+}

lib/widgets/themes/Cupertino/CupertinoPageRoute/demo.dart

@@ -0,0 +1,96 @@
+/**
+ * Created with Android Studio.
+ * User: ryan
+ * Date: 2019/1/20
+ * Time: 上午11:34
+ * email: zhu.yan@alibaba-inc.com
+ * tartget: CupertinoPageRoute 的示例
+ */
+
+import 'package:flutter/cupertino.dart';
+import 'package:flutter/material.dart';
+
+/*
+* CupertinoPageRoute 默认的实例
+* */
+class CupertinoPageRouteFullDefault extends StatefulWidget {
+  const CupertinoPageRouteFullDefault() : super();
+
+  @override
+  State<StatefulWidget> createState() => _CupertinoPageRouteFullDefault();
+}
+
+/*
+* CupertinoPageRoute 默认的实例,有状态
+* */
+class _CupertinoPageRouteFullDefault extends State {
+
+  Widget pageRoute(BuildContext context,int index){
+    return CupertinoPageScaffold(
+          navigationBar: CupertinoNavigationBar(
+            middle: Text('Page 2 of tab $index'),
+          ),
+          child: Center(
+            child: CupertinoButton(
+              child: const Text('Back'),
+              onPressed: () {
+                Navigator.of(context).pop();
+              },
+            ),
+          ),
+        );
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return SizedBox(
+      height: MediaQuery.of(context).size.height,
+      width: MediaQuery.of(context).size.width,
+      //height: 500.0,
+      child:CupertinoApp(
+      home: CupertinoTabScaffold(
+        tabBar: CupertinoTabBar(
+          items: const <BottomNavigationBarItem>[
+            BottomNavigationBarItem(
+              icon: Icon(CupertinoIcons.share),
+              title: Text('无滑动的切换1'),
+            ),
+            BottomNavigationBarItem(
+              icon: Icon(CupertinoIcons.share),
+              title: Text('无滑动的切换2'),
+            ),
+          ],
+        ),
+        tabBuilder: (BuildContext context, int index) {
+          // For 1-indexed readability.
+          ++index;
+          return CupertinoTabView(
+            builder: (BuildContext context) {
+              return CupertinoPageScaffold(
+                navigationBar: CupertinoNavigationBar(
+                  middle: Text('Page 1 of tab $index'),
+                ),
+                child: Center(
+                  child: CupertinoButton(
+                    child: const Text('点击我，看滑动动画'),
+                    onPressed: () {
+                      Navigator.of(context).push(
+                        CupertinoPageRoute<void>(
+                          maintainState:false, //  是否前一个路由将保留在内存中
+                          builder: (BuildContext context) { // 生成器
+                            return pageRoute(context,index);
+                          }
+                        )
+                      );
+                    },
+                  ),
+                ),
+              );
+            },
+          );
+        },
+      ),
+     )
+    );
+  }
+}

lib/widgets/themes/Cupertino/CupertinoPageRoute/index.dart

@@ -0,0 +1,47 @@
+/**
+ * Created with Android Studio.
+ * User: 一晟
+ * Date: 2019/1/20
+ * Time: 下午10:57
+ * email: zhu.yan@alibaba-inc.com
+ * tartget: CupertinoPageRoute 的示例
+ */
+import 'package:flutter/material.dart';
+import '../../../../common/widget_demo.dart';
+import './demo.dart' as demoBox;
+
+const String content0 = '''
+### **简介**
+> ios 风格全屏切换路由的滑动动画
+- 页面从右侧滑入，然后反向退出。当另一页进入覆盖它时，视差中的页面也会向左移动;
+- 页面从底部滑入，然后反向退出，全屏 dialogs 没有视差效果;
+- 默认情况下，当切换路由被其他路由替换时，前一个路由将保留在内存中。若要在不需要时释放所有资源，请将 maintainstate 设置为 false;
+''';
+
+const String content1 = '''
+### **基本用法**
+> CupertinoPageRoute 的一个示例
+- 通常被 CupertinoPageScaffold 包裹
+''';
+
+class Demo extends StatefulWidget {
+  static const String routeName = '/themes/Cupertino/CupertinoPageRoute';
+  _DemoState createState() => _DemoState();
+}
+
+class _DemoState extends State<Demo> {
+  @override
+  Widget build(BuildContext context) {
+    return WidgetDemo(
+      contentList: [
+        content0,
+        content1,
+        demoBox.CupertinoPageRouteFullDefault(),
+        SizedBox(height:50)
+      ],
+      title: 'CupertinoPageRoute',
+      docUrl: 'https://docs.flutter.io/flutter/cupertino/CupertinoPageRoute-class.html',
+      codeUrl: '/themes/Cupertino/CupertinoPageRoute/demo.dart',
+    );
+  }
+}

lib/widgets/themes/Cupertino/CupertinoPageScaffold/demo.dart

@@ -0,0 +1,49 @@
+/**
+ * Created with Android Studio.
+ * User: ryan
+ * Date: 2019/1/20
+ * Time: 上午11:34
+ * email: zhu.yan@alibaba-inc.com
+ * tartget: CupertinoPageScaffold 的示例
+ */
+
+import 'package:flutter/cupertino.dart';
+import 'package:flutter/material.dart';
+
+/*
+* CupertinoPageScaffold 默认的实例
+* */
+class CupertinoPageScaffoldFullDefault extends StatefulWidget {
+  const CupertinoPageScaffoldFullDefault() : super();
+
+  @override
+  State<StatefulWidget> createState() => _CupertinoPageScaffoldFullDefault();
+}
+
+/*
+* CupertinoPageScaffold 默认的实例,有状态
+* */
+class _CupertinoPageScaffoldFullDefault extends State {
+  @override
+  Widget build(BuildContext context) {
+    return SizedBox(
+        height: MediaQuery.of(context).size.height/1.5,
+        child: navigationBar(context)
+    );
+  }
+
+  Widget navigationBar(BuildContext context) {
+    return CupertinoPageScaffold( // 进入程序后显示的第一个页面,传入的是一个Widget，但实际上这个Widget需要包裹一个Scaffold
+        backgroundColor:CupertinoColors.extraLightBackgroundGray,// 整个脚手架下面的 widget 的颜色
+        navigationBar: CupertinoNavigationBar(
+          leading: Icon(CupertinoIcons.back),// 放置在导航栏的开头。通常是正常页面的后退按钮或完整页面对话框的取消按钮
+          middle: Text('这里是标题'),// 放置在导航栏的中间。通常是标题或分段控件
+          trailing: Icon(CupertinoIcons.share),// 放置在导航栏的末尾。通常在页面上执行其他操作，例如搜索或编辑功能
+      ),
+      child: Center(
+          child: Text('这里是内容', style: TextStyle(color: Colors.black))
+      ), // 应用程序默认路由,（Navigator.defaultRouteName，即/）
+      resizeToAvoidBottomInset:false // child 是否应该调整自己的大小以避免窗口的底部插入
+    );
+  }
+}

lib/widgets/themes/Cupertino/CupertinoPageScaffold/index.dart

@@ -0,0 +1,45 @@
+/**
+ * Created with Android Studio.
+ * User: 一晟
+ * Date: 2019/1/20
+ * Time: 下午10:57
+ * email: zhu.yan@alibaba-inc.com
+ * tartget: CupertinoPageScaffold 的示例
+ */
+import 'package:flutter/material.dart';
+import '../../../../common/widget_demo.dart';
+import './demo.dart' as demoBox;
+
+const String content0 = '''
+### **简介**
+> 实现单个 iOS 应用程序页的页面布局
+- 一个 CupertinoPage 重要布局;
+- 脚手架在顶部设置导航栏，在导航栏之间或之后设置内容;
+''';
+
+const String content1 = '''
+### **基本用法**
+> CupertinoPageScaffold 的一个示例
+''';
+
+class Demo extends StatefulWidget {
+  static const String routeName = '/themes/Cupertino/CupertinoPageScaffold';
+  _DemoState createState() => _DemoState();
+}
+
+class _DemoState extends State<Demo> {
+  @override
+  Widget build(BuildContext context) {
+    return WidgetDemo(
+      contentList: [
+        content0,
+        content1,
+        demoBox.CupertinoPageScaffoldFullDefault(),
+        SizedBox(height:50)
+      ],
+      title: 'CupertinoPageScaffold',
+      docUrl: 'https://docs.flutter.io/flutter/cupertino/CupertinoPageScaffold-class.html',
+      codeUrl: '/themes/Cupertino/CupertinoPageScaffold/demo.dart',
+    );
+  }
+}

lib/widgets/themes/Cupertino/CupertinoPicker/demo.dart

@@ -0,0 +1,291 @@
+/**
+ * Created with Android Studio.
+ * User: ryan
+ * Date: 2019/1/20
+ * Time: 上午11:34
+ * email: zhu.yan@alibaba-inc.com
+ * tartget: CupertinoPageScaffold 的示例
+ */
+
+import 'package:flutter/cupertino.dart';
+import 'package:intl/intl.dart';
+
+//import '../../gallery/demo.dart';
+//import 'cupertino_navigation_demo.dart' show coolColorNames;
+
+const double _kPickerSheetHeight = 216.0;
+const double _kPickerItemHeight = 32.0;
+
+const List<String> coolColorNames = <String>[
+  'Sarcoline', 'Coquelicot', 'Smaragdine', 'Mikado', 'Glaucous', 'Wenge',
+  'Fulvous', 'Xanadu', 'Falu', 'Eburnean', 'Amaranth', 'Australien',
+  'Banan', 'Falu', 'Gingerline', 'Incarnadine', 'Labrador', 'Nattier',
+  'Pervenche', 'Sinoper', 'Verditer', 'Watchet', 'Zaffre',
+];
+
+class CupertinoPickerDemo extends StatefulWidget {
+  static const String routeName = '/cupertino/picker';
+
+  @override
+  _CupertinoPickerDemoState createState() => _CupertinoPickerDemoState();
+}
+
+class _CupertinoPickerDemoState extends State<CupertinoPickerDemo> {
+  int _selectedColorIndex = 0;
+
+  Duration timer = const Duration();
+
+  // Value that is shown in the date picker in date mode.
+  DateTime date = DateTime.now();
+
+  // Value that is shown in the date picker in time mode.
+  DateTime time = DateTime.now();
+
+  // Value that is shown in the date picker in dateAndTime mode.
+  DateTime dateTime = DateTime.now();
+
+  Widget _buildMenu(List<Widget> children) {
+    return Container(
+      decoration: BoxDecoration(
+        color: CupertinoTheme.of(context).scaffoldBackgroundColor,
+        border: const Border(
+          top: BorderSide(color: Color(0xFFBCBBC1), width: 0.0),
+          bottom: BorderSide(color: Color(0xFFBCBBC1), width: 0.0),
+        ),
+      ),
+      height: 44.0,
+      child: Padding(
+        padding: const EdgeInsets.symmetric(horizontal: 16.0),
+        child: SafeArea(
+          top: false,
+          bottom: false,
+          child: Row(
+            mainAxisAlignment: MainAxisAlignment.spaceBetween,
+            children: children,
+          ),
+        ),
+      ),
+    );
+  }
+
+  Widget _buildBottomPicker(Widget picker) {
+    return Container(
+      height: _kPickerSheetHeight,
+      padding: const EdgeInsets.only(top: 6.0),
+      color: CupertinoColors.white,
+      child: DefaultTextStyle(
+        style: const TextStyle(
+          color: CupertinoColors.black,
+          fontSize: 22.0,
+        ),
+        child: GestureDetector(
+          // Blocks taps from propagating to the modal sheet and popping.
+          onTap: () {},
+          child: SafeArea(
+            top: false,
+            child: picker,
+          ),
+        ),
+      ),
+    );
+  }
+
+  Widget _buildColorPicker(BuildContext context) {
+    final FixedExtentScrollController scrollController =
+    FixedExtentScrollController(initialItem: _selectedColorIndex);
+
+    return GestureDetector(
+      onTap: () async {
+        await showCupertinoModalPopup<void>(
+          context: context,
+          builder: (BuildContext context) {
+            return _buildBottomPicker(
+              CupertinoPicker(
+                  magnification:1.0, // 整体放大率
+                  //offAxisFraction:10.0,// 球面效果的透视系数,消失点位置
+                  scrollController: scrollController,// 用于读取和控制当前项的FixedxtentScrollController
+                  itemExtent: _kPickerItemHeight,// 所以子节点 统一高度
+                  backgroundColor: CupertinoColors.white,// 所有子节点下面的背景颜色
+                  useMagnifier:true,// 是否使用放大效果
+                  onSelectedItemChanged: (int index) { // 当正中间选项改变时的回调
+                    setState(() => _selectedColorIndex = index);
+                  },
+                  children: List<Widget>.generate(coolColorNames.length, (int index) {
+                return Center(child:
+                Text(coolColorNames[index]),
+                );
+              }),
+            ),
+            );
+          },
+        );
+      },
+      child: _buildMenu(
+        <Widget>[
+          const Text('Favorite Color'),
+          Text(
+            coolColorNames[_selectedColorIndex],
+            style: const TextStyle(
+                color: CupertinoColors.inactiveGray
+            ),
+          ),
+        ],
+      ),
+    );
+  }
+
+  Widget _buildCountdownTimerPicker(BuildContext context) {
+    return GestureDetector(
+      onTap: () {
+        showCupertinoModalPopup<void>(
+          context: context,
+          builder: (BuildContext context) {
+            return _buildBottomPicker(
+              CupertinoTimerPicker(
+                initialTimerDuration: timer,
+                onTimerDurationChanged: (Duration newTimer) {
+                  setState(() => timer = newTimer);
+                },
+              ),
+            );
+          },
+        );
+      },
+      child: _buildMenu(
+        <Widget>[
+          const Text('Countdown Timer'),
+          Text(
+            '${timer.inHours}:'
+                '${(timer.inMinutes % 60).toString().padLeft(2,'0')}:'
+                '${(timer.inSeconds % 60).toString().padLeft(2,'0')}',
+            style: const TextStyle(color: CupertinoColors.inactiveGray),
+          ),
+        ],
+      ),
+    );
+  }
+
+  Widget _buildDatePicker(BuildContext context) {
+    return GestureDetector(
+      onTap: () {
+        showCupertinoModalPopup<void>(
+          context: context,
+          builder: (BuildContext context) {
+            return _buildBottomPicker(
+              CupertinoDatePicker(
+                mode: CupertinoDatePickerMode.date,
+                initialDateTime: date,
+                onDateTimeChanged: (DateTime newDateTime) {
+                  setState(() => date = newDateTime);
+                },
+              ),
+            );
+          },
+        );
+      },
+      child: _buildMenu(
+          <Widget>[
+            const Text('Date'),
+            Text(
+              DateFormat.yMMMMd().format(date),
+              style: const TextStyle(color: CupertinoColors.inactiveGray),
+            ),
+          ]
+      ),
+    );
+  }
+
+  Widget _buildTimePicker(BuildContext context) {
+    return GestureDetector(
+      onTap: () {
+        showCupertinoModalPopup<void>(
+          context: context,
+          builder: (BuildContext context) {
+            return _buildBottomPicker(
+              CupertinoDatePicker(
+                mode: CupertinoDatePickerMode.time,
+                initialDateTime: time,
+                onDateTimeChanged: (DateTime newDateTime) {
+                  setState(() => time = newDateTime);
+                },
+              ),
+            );
+          },
+        );
+      },
+      child: _buildMenu(
+        <Widget>[
+          const Text('Time'),
+          Text(
+            DateFormat.jm().format(time),
+            style: const TextStyle(color: CupertinoColors.inactiveGray),
+          ),
+        ],
+      ),
+    );
+  }
+
+  Widget _buildDateAndTimePicker(BuildContext context) {
+    return GestureDetector(
+      onTap: () {
+        showCupertinoModalPopup<void>(
+          context: context,
+          builder: (BuildContext context) {
+            return _buildBottomPicker(
+              CupertinoDatePicker(
+                mode: CupertinoDatePickerMode.dateAndTime,
+                initialDateTime: dateTime,
+                onDateTimeChanged: (DateTime newDateTime) {
+                  setState(() => dateTime = newDateTime);
+                },
+              ),
+            );
+          },
+        );
+      },
+      child: _buildMenu(
+        <Widget>[
+          const Text('Date and Time'),
+          Text(
+            DateFormat.yMMMd().add_jm().format(dateTime),
+            style: const TextStyle(color: CupertinoColors.inactiveGray),
+          ),
+        ],
+      ),
+    );
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return SizedBox(
+        height:MediaQuery.of(context).size.height,
+        child:CupertinoPageScaffold(
+//        navigationBar: CupertinoNavigationBar(
+//          middle: const Text('Picker'),
+//          previousPageTitle: 'Cupertino'
+//          ),
+          child: DefaultTextStyle(
+          style: CupertinoTheme.of(context).textTheme.textStyle,
+          child: DecoratedBox(
+          decoration: BoxDecoration(
+          color: CupertinoTheme.of(context).brightness == Brightness.light
+          ? CupertinoColors.extraLightBackgroundGray
+              : CupertinoColors.darkBackgroundGray,
+          ),
+          child: ListView(
+            children: <Widget>[
+              const Padding(padding: EdgeInsets.only(top: 32.0)),
+              _buildColorPicker(context),
+              _buildCountdownTimerPicker(context),
+              _buildDatePicker(context),
+              _buildTimePicker(context),
+              _buildDateAndTimePicker(context),
+              ],
+            ),
+          ),
+        ),
+      )
+    );
+
+  }
+}

lib/widgets/themes/Cupertino/CupertinoPicker/index.dart

@@ -0,0 +1,45 @@
+/**
+ * Created with Android Studio.
+ * User: 一晟
+ * Date: 2019/1/20
+ * Time: 下午10:57
+ * email: zhu.yan@alibaba-inc.com
+ * tartget: CupertinoPicker 的示例
+ */
+import 'package:flutter/material.dart';
+import '../../../../common/widget_demo.dart';
+import './demo.dart' as demoBox;
+
+const String content0 = '''
+### **简介**
+> iOS风格的选择器
+- 以 wheel 的方式显示子 widget，选择发生改变后的回调; 
+- 通常和 showModalBottomSheet 搭配在屏幕底部显示 picker 选择器;
+''';
+
+const String content1 = '''
+### **基本用法**
+> CupertinoPicker 的一个示例
+''';
+
+class Demo extends StatefulWidget {
+  static const String routeName = '/themes/Cupertino/CupertinoPicker';
+  _DemoState createState() => _DemoState();
+}
+
+class _DemoState extends State<Demo> {
+  @override
+  Widget build(BuildContext context) {
+    return WidgetDemo(
+      contentList: [
+        content0,
+        content1,
+        demoBox.CupertinoPickerDemo(),
+        SizedBox(height:50)
+      ],
+      title: 'CupertinoPicker',
+      docUrl: 'https://docs.flutter.io/flutter/cupertino/CupertinoPicker-class.html',
+      codeUrl: '/themes/Cupertino/CupertinoPicker/demo.dart',
+    );
+  }
+}

lib/widgets/themes/Cupertino/CupertinoPopupSurface/demo.dart

@@ -0,0 +1,45 @@
+/**
+ * Created with Android Studio.
+ * User: ryan
+ * Date: 2019/1/20
+ * Time: 上午11:34
+ * email: zhu.yan@alibaba-inc.com
+ * tartget: CupertinoPopupSurface 的示例
+ */
+
+import 'package:flutter/cupertino.dart';
+import 'package:flutter/material.dart';
+
+/*
+* CupertinoPopupSurface 默认的实例
+* */
+class CupertinoPopupSurfaceFullDefault extends StatefulWidget {
+  const CupertinoPopupSurfaceFullDefault() : super();
+
+  @override
+  State<StatefulWidget> createState() => _CupertinoPopupSurfaceFullDefault();
+}
+
+/*
+* CupertinoPopupSurface 默认的实例,有状态
+* */
+class _CupertinoPopupSurfaceFullDefault extends State {
+  @override
+  Widget build(BuildContext context) {
+    return SizedBox(
+        height: MediaQuery.of(context).size.height/5,
+        child: CupertinoPopupSurfaceBar(context)
+    );
+  }
+
+  Widget CupertinoPopupSurfaceBar(BuildContext context) {
+    return CupertinoPopupSurface(
+      isSurfacePainted:false,
+      child: Container(
+          color: CupertinoColors.inactiveGray,
+          alignment: Alignment.center,
+          child: Text('这里是内容', style: TextStyle(color: Colors.white))
+      ), // 应用程序默认路由,（Navigator.defaultRouteName，即/）
+    );
+  }
+}

lib/widgets/themes/Cupertino/CupertinoPopupSurface/index.dart

@@ -0,0 +1,44 @@
+/**
+ * Created with Android Studio.
+ * User: 一晟
+ * Date: 2019/1/20
+ * Time: 下午10:57
+ * email: zhu.yan@alibaba-inc.com
+ * tartget: CupertinoPopupSurface 的示例
+ */
+import 'package:flutter/material.dart';
+import '../../../../common/widget_demo.dart';
+import './demo.dart' as demoBox;
+
+const String content0 = '''
+### **简介**
+> 像iOS弹出式表面
+- 快速实现一个圆角弹框,类似 alert dialog 和 sheet;
+''';
+
+const String content1 = '''
+### **基本用法**
+> CupertinoPopupSurface 的一个示例
+''';
+
+class Demo extends StatefulWidget {
+  static const String routeName = '/themes/Cupertino/CupertinoPopupSurface';
+  _DemoState createState() => _DemoState();
+}
+
+class _DemoState extends State<Demo> {
+  @override
+  Widget build(BuildContext context) {
+    return WidgetDemo(
+      contentList: [
+        content0,
+        content1,
+        demoBox.CupertinoPopupSurfaceFullDefault(),
+        SizedBox(height:50)
+      ],
+      title: 'CupertinoPopupSurface',
+      docUrl: 'https://docs.flutter.io/flutter/cupertino/CupertinoPopupSurface-class.html',
+      codeUrl: '/themes/Cupertino/CupertinoPopupSurface/demo.dart',
+    );
+  }
+}

lib/widgets/themes/Cupertino/index.dart

@@ -1,14 +1,73 @@
 import "package:flutter/material.dart";
 import '../../../model/widget.dart';
+
+
+import './CupertinoApp/index.dart' as CupertinoApp;
+import './CupertinoButton/index.dart' as CupertinoButton;
+import './CupertinoColors/index.dart' as CupertinoColors;
+import './CupertinoIcons/index.dart' as CupertinoIcons;
+import './CupertinoNavigationBar/index.dart' as CupertinoNavigationBar;
+import './CupertinoPageRoute/index.dart' as CupertinoPageRoute;
+import './CupertinoPageScaffold/index.dart' as CupertinoPageScaffold;
+import './CupertinoPicker/index.dart' as CupertinoPicker;
+import './CupertinoPopupSurface/index.dart' as CupertinoPopupSurface;
+
 import './CupertinoScrollbar/index.dart' as CupertinoScrollbar;
 import './CupertinoSlider/index.dart' as CupertinoSlider;
 import './CupertinoSegmentedControl/index.dart' as CupertinoSegmentedControl;
 import './CupertinoSliverNavigationBar/index.dart' as CupertinoSliverNavigationBar;
 import './CupertinoSwitch/index.dart' as CupertinoSwitch;
+
 import './CupertinoTabBar/index.dart' as CupertinoTabBar;
 import './CupertinoTabScaffold/index.dart' as CupertinoTabScaffold;
 import './CupertinoTabView/index.dart' as CupertinoTabView;
+
 List<WidgetPoint> widgetPoints = [
+  WidgetPoint(
+    name: 'CupertinoPopupSurface',
+    routerName: CupertinoPopupSurface.Demo.routeName,
+    buildRouter: (BuildContext context) => CupertinoPopupSurface.Demo(),
+  ),
+  WidgetPoint(
+    name: 'CupertinoPicker',
+    routerName: CupertinoPicker.Demo.routeName,
+    buildRouter: (BuildContext context) => CupertinoPicker.Demo(),
+  ),
+  WidgetPoint(
+    name: 'CupertinoPageScaffold',
+    routerName: CupertinoPageScaffold.Demo.routeName,
+    buildRouter: (BuildContext context) => CupertinoPageScaffold.Demo(),
+  ),
+  WidgetPoint(
+    name: 'CupertinoPageRoute',
+    routerName: CupertinoPageRoute.Demo.routeName,
+    buildRouter: (BuildContext context) => CupertinoPageRoute.Demo(),
+  ),
+  WidgetPoint(
+    name: 'CupertinoNavigationBar',
+    routerName: CupertinoNavigationBar.Demo.routeName,
+    buildRouter: (BuildContext context) => CupertinoNavigationBar.Demo(),
+  ),
+  WidgetPoint(
+    name: 'CupertinoIcons',
+    routerName: CupertinoIcons.Demo.routeName,
+    buildRouter: (BuildContext context) => CupertinoIcons.Demo(),
+  ),
+  WidgetPoint(
+    name: 'CupertinoColors',
+    routerName: CupertinoColors.Demo.routeName,
+    buildRouter: (BuildContext context) => CupertinoColors.Demo(),
+  ),
+  WidgetPoint(
+    name: 'CupertinoButton',
+    routerName: CupertinoButton.Demo.routeName,
+    buildRouter: (BuildContext context) => CupertinoButton.Demo(),
+  ),
+  WidgetPoint(
+    name: 'CupertinoApp',
+    routerName: CupertinoApp.Demo.routeName,
+    buildRouter: (BuildContext context) => CupertinoApp.Demo(),
+  ),
   WidgetPoint(
     name: 'CupertinoScrollbar',
     routerName: CupertinoScrollbar.Demo.routeName,
@@ -55,3 +114,4 @@ List<WidgetPoint> widgetPoints = [
     buildRouter: (BuildContext context) => CupertinoTabView.Demo(),
   ),
 ];
+

lib/widgets/themes/index.dart

@@ -6,10 +6,11 @@
  */
 
 import './Material/index.dart' as Material;
-import './Cupertino/index.dart' as Cupertion;
+import './Cupertino/index.dart' as Cupertino;
+
 List getWidgets() {
   List result = [];
   result.addAll(Material.widgetPoints);
-  result.addAll(Cupertion.widgetPoints);
+  result.addAll(Cupertino.widgetPoints);
   return result;
 }

pubspec.yaml

@@ -30,6 +30,8 @@ dependencies:
   shared_preferences: ^0.4.3
   dio: ^1.0.6
   flutter_webview_plugin: ^0.3.0+2
+  # 日期格式化
+  intl: 0.15.7
 
 dev_dependencies:
   flutter_test:
@@ -171,10 +173,17 @@ flutter:
     - lib/widgets/themes/Cupertino/CupertinoTabView/demo.dart
     - assets/app.db
     - assets/images/
+    - assets/fonts/
     - lib/common/example_code_parser.dart
     - lib/common/syntax_highlighter.dart
 
-
+  fonts:
+  - family: FlamanteRoma
+    fonts:
+    - asset: assets/fonts/Flamante-Roma-Medium.ttf
+    - asset: assets/fonts/Lato-Bold.ttf
+    - asset: assets/fonts/Flamante-Roma-MediumItalic.ttf
+      style: italic
 
   # To add assets to your application, add an assets section, like this:
   # assets: