Merge pull request #38 from efoxTeam/dev

merge dev

Author: wanwusangzhi

docs/widget/navigator/bottomnavigationbar/index.md

@@ -1 +1,40 @@
-## **文档完善中**
+## **BottomNavigationBar**
+> Scaffold的属性，增加底部导航栏tab
+
+### 构造函数
+```
+BottomNavigationBar({
+  Key key,
+  @required this.items,
+  this.onTap,
+  this.currentIndex = 0,
+  BottomNavigationBarType type,
+  this.fixedColor,
+  this.iconSize = 24.0,
+})
+```
+
+### 属性介绍
+- items: 数组类型，tab，通过BottomNavigationBarItem实现
+- onTap: 点击后回调函数，返回点击的数组下标，从0开始
+- currentIndex：当前激活的下标值
+- type: BottomNavigationBarType类型，默认fixed（固定位置大小，点击无动画效果），还有shifting（点击时有动画效果）
+  > fixed: 固定大小，无动画效果。
+  > shifting: 带有动画效果，只有激活的标签带有主题颜色，可自行增加默认颜色
+- fixedColor: 图标与字体颜色，当type的值为BottomNavigationBarType.shifting时，级别比较低。
+- iconSize：double类型，图标大小。
+
+### 高级用法
+- 可以定义一个变量，通过setState方法改变currentIndex的值。Scaffold中的body属性可以使用PageView，实现body页面切换带动导航栏切换，可导航栏触发body页面切换。
+- BottomNavigationBarItem：属性items中的组件
+  ```
+    BottomNavigationBarItem({
+      @required this.icon,
+      this.title,
+      Widget activeIcon,
+      this.backgroundColor,
+    }) 
+  ```
+  > title: 定义标题
+  > icon: 图标
+  > activeIcon: 选中时图标

docs/widget/navigator/floatingactionbutton/index.md

@@ -1 +1,35 @@
-## **文档完善中**
+## **FloatingActionButton**
+> 在Scaffold中属性floatingActionButton实现FloatingActionButton，该组件是个圆形的浮层按钮，一般情况下child可用icon进行绘画。
+
+### 构造函数
+```
+FloatingActionButton({
+  Key key,
+  this.child,
+  this.tooltip,
+  this.foregroundColor,
+  this.backgroundColor,
+  this.heroTag = const _DefaultHeroTag(),
+  this.elevation = 6.0,
+  this.highlightElevation = 12.0,
+  double disabledElevation,
+  @required this.onPressed,
+  this.mini = false,
+  this.shape = const CircleBorder(),
+  this.clipBehavior = Clip.none,
+  this.materialTapTargetSize,
+  this.isExtended = false,
+})
+```
+
+### 属性介绍
+- onPressed： 必填属性，函数调用，点击按钮后回调事件
+- child: 组件子组件内容，可通过Icon简单的增加图标
+- elevation：图标下阴影大小
+- highlightElevation: 点击后阴影扩散范围
+- tooltip：长按提示
+- foregroundColor：前景色，如图标、文字的颜色
+- backgroundColor：背景填充色
+- mini: 默认false，true时为迷你按钮
+
+

lib/components/widgetComp.dart

@@ -63,7 +63,7 @@ class IndexState extends State<Index> {
   void init() async {
     this._bodyList.length = 0;
     String mdText = await this.getMdFile(this.mdUrl);
-    if (mdText.length > 30) {
+    if (mdText.length > 30 || !this.model.config.state.isPro) {
       this
         ._bodyList
         .add(await MarkDownComp.Index(mdText));

lib/config/index.dart

@@ -1,6 +1,6 @@
 import 'development.dart' as Development;
 import 'production.dart' as Production;
 
-const bool isPro = true;
+const bool isPro = false;
 
 Object env = isPro ? Production.Config() : Development.Config();

lib/page/mine/index.dart

@@ -3,12 +3,9 @@ import 'package:efox_flutter/lang/index.dart' show AppLocalizations;
 import 'package:efox_flutter/router/index.dart' show FluroRouter;
 
 class _IndexState extends State<Index> {
-  static String _version = '';
-
   @override
   void initState() {
     super.initState();
-    _version = widget.model.config.state.version;
   }
 
   List<dynamic> _getList() {
@@ -19,16 +16,9 @@ class _IndexState extends State<Index> {
         'index': 0
       },
       {
-        'name': AppLocalizations.$t('common.changeVersion') + '  ' + _version,
-        'icon': 58919, // sync
-        'index': 1,
-        'show': !widget.model.config.state.isPro
-      },
-      {
-        'name': AppLocalizations.$t('common.changeEnvironment'),
+        'name': widget.model.config.state.isPro ? AppLocalizations.$t('mine.loadLocal') : AppLocalizations.$t('mine.loadNetwork'),
         'icon': 57539, // import_export
         'index': 2,
-        'show': !widget.model.config.state.isPro
       },
       {
         'name': AppLocalizations.$t('common.compProgress'),
@@ -43,11 +33,6 @@ class _IndexState extends State<Index> {
       case 0:
         AppLocalizations.changeLanguage();
         break;
-      case 1:
-        widget.model.dispatch('config', 'setVersion').then((resp) {
-          _version = widget.model.config.state.version;
-        });
-        break;
       case 2:
         widget.model.dispatch('config', 'setEnv');
         break;

lib/widget/navigator/bottomnavigationbar/demo.dart

@@ -11,14 +11,80 @@ class _IndexState extends State<Index> {
     super.initState();
   }
 
+  int _index = 0;
   @override
   Widget build(BuildContext context) {
     return Scaffold(
       appBar: AppBar(
         title: Text('BottomNavigationBar'),
       ),
       body: Center(
-        child: Text('更新中'),
+        child: Column(
+          mainAxisAlignment: MainAxisAlignment.center,
+          children: <Widget>[
+            Divider(),
+            Text(
+              '在Scaffold的bottomNavigationBar属性，增加BottomNavigationBar组件，实现底部导航栏。',
+              textAlign: TextAlign.center,
+            ),
+            Divider(),
+            Text(
+              '属性children通过BottomNavigationBarItem定义。',
+              textAlign: TextAlign.center,
+            ),
+            Divider(),
+            Text(
+              'BottomNavigationBar能通过onTap增加点击事件',
+              textAlign: TextAlign.center,
+            ),
+          ],
+        ),
+      ),
+      bottomNavigationBar: BottomNavigationBar(
+        currentIndex: _index,
+        onTap: (index) {
+          setState(() {
+            _index = index;
+          });
+        },
+        fixedColor: Colors.purple,
+        // type: BottomNavigationBarType.shifting,
+        items: [
+          BottomNavigationBarItem(
+            title: Text(
+              '导航一',
+              style: TextStyle(
+                color: Colors.blue,
+              ),
+            ),
+            icon: Icon(
+              Icons.play_circle_filled,
+              color: Colors.blue,
+            ),
+          ),
+          BottomNavigationBarItem(
+            title: Text(
+              '导航二',
+              style: TextStyle(
+                color: Colors.blue,
+              ),
+            ),
+            icon: Icon(
+              Icons.pause_circle_filled,
+              color: Colors.blue,
+            ),
+          ),
+          BottomNavigationBarItem(
+            title: Text(
+              '导航三',
+              style: TextStyle(
+                color: Colors.blue,
+              ),
+            ),
+            icon: Icon(Icons.cloud_circle,
+              color: Colors.blue,),
+          ),
+        ],
       ),
     );
   }

lib/widget/navigator/bottomnavigationbar/demo_with_pageview.dart

@@ -0,0 +1,100 @@
+import 'package:flutter/material.dart';
+
+class Index extends StatefulWidget {
+  @override
+  State<StatefulWidget> createState() => _IndexState();
+}
+
+class _IndexState extends State<Index> {
+  @override
+  void initState() {
+    super.initState();
+  }
+
+  int _index = 0;
+  @override
+  Widget build(BuildContext context) {
+    return Scaffold(
+      appBar: AppBar(
+        title: Text('BottomNavigationBar'),
+      ),
+      body: PageView(
+          onPageChanged: (index) {
+            setState(() {
+              _index = index;
+            });
+          },
+          children: [
+            Center(
+              child: Column(
+                children: [
+                  Text('页面一'),
+                  Text('左右滑动切换页面哦~~~'),
+                ],
+              ),
+            ),
+            Center(
+              child: Column(
+                mainAxisAlignment: MainAxisAlignment.center,
+                children: [
+                  Text('页面二'),
+                  Text('左右滑动切换页面哦~~~'),
+                ],
+              ),
+            ),
+            Center(
+              child: Column(
+                mainAxisAlignment: MainAxisAlignment.end,
+                children: [
+                  Text('页面三'),
+                  Text('左右滑动切换页面哦~~~'),
+                ],
+              ),
+            ),
+          ]),
+      bottomNavigationBar: BottomNavigationBar(
+        currentIndex: _index,
+        type: BottomNavigationBarType.shifting,
+        onTap: (index) {
+          setState(() {
+            _index = index;
+          });
+        },
+        fixedColor: Colors.red,
+        iconSize: 28,
+        items: [
+          BottomNavigationBarItem(
+            title: Text(
+              '导航一',
+              style: TextStyle(color: Colors.red),
+            ),
+            icon: Icon(
+              Icons.navigate_before,
+              color: Colors.redAccent,
+            ),
+          ),
+          BottomNavigationBarItem(
+            title: Text(
+              '导航二',
+              style: TextStyle(color: Colors.red),
+            ),
+            icon: Icon(
+              Icons.notifications_active,
+              color: Colors.redAccent,
+            ),
+          ),
+          BottomNavigationBarItem(
+            title: Text(
+              '导航三',
+              style: TextStyle(color: Colors.red),
+            ),
+            icon: Icon(
+              Icons.navigate_next,
+              color: Colors.redAccent,
+            ),
+          ),
+        ],
+      ),
+    );
+  }
+}

lib/widget/navigator/bottomnavigationbar/index.dart

@@ -1,11 +1,12 @@
 import 'package:flutter/material.dart';
 import 'package:efox_flutter/components/widgetComp.dart' as WidgetComp;
 import 'demo.dart' as Demo;
+import 'demo_with_pageview.dart' as DemoWithPageView;
 
 class Index extends StatefulWidget {
   static String title = 'BottomNavigationBar';
   static String mdUrl = 'docs/widget/navigator/bottomnavigationbar/index.md';
-  static String originCodeUrl = 'https://docs.flutter.io/flutter/widgets/BottomNavigationBar-class.html';
+  static String originCodeUrl = 'https://docs.flutter.io/flutter/material/BottomNavigationBar-class.html';
 
   @override
   _IndexState createState() => new _IndexState();
@@ -20,6 +21,7 @@ class _IndexState extends State<Index> {
       mdUrl: Index.mdUrl,
       demoChild: [
         Demo.Index(),
+        DemoWithPageView.Index(),
       ],
     );
   }

lib/widget/navigator/floatingactionbutton/demo.dart

@@ -6,6 +6,7 @@ class Index extends StatefulWidget {
 }
 
 class _IndexState extends State<Index> {
+  int count = 0;
   @override
   void initState() {
     super.initState();
@@ -16,9 +17,40 @@ class _IndexState extends State<Index> {
     return Scaffold(
       appBar: AppBar(
         title: Text('FloatingActionButton'),
+        automaticallyImplyLeading: false,
       ),
       body: Center(
-        child: Text('更新中'),
+        child: Column(
+          mainAxisAlignment: MainAxisAlignment.center,
+          children: <Widget>[
+            Text(
+              'Click FloatingActionButton to add Count',
+              style: TextStyle(fontSize: 16),
+            ),
+            Text(
+              'count: $count',
+              style: TextStyle(fontSize: 24),
+            )
+          ],
+        ),
+      ),
+      floatingActionButton: FloatingActionButton(
+        clipBehavior: Clip.antiAliasWithSaveLayer,
+        tooltip: '长按后的提示',
+        foregroundColor:Colors.blue, // 该颜色被Icon覆盖
+        backgroundColor: Colors.red, // 背景填充色
+        elevation: 10, // 下阴影大小
+        highlightElevation: 50, // 阴影扩散范围
+        mini: true,
+        child: Icon(
+          Icons.notifications_active,
+          color: Colors.white,
+        ),
+        onPressed: () {
+          setState(() {
+            count++;
+          });
+        },
       ),
     );
   }