Merge from fork origin develop

.github/pull_request_template.md

@@ -5,11 +5,17 @@
 
 ## CheckList
 
-
 Thanks for considering to this repository. Before you submit your issue, please confirm these boxes are checked.
 
 - [ ] I have read [《[EN]Style guide for Flutter repo [CN]Flutter项目代码规范、规约选型》](https://github.com/iteatimeteam/tap_water/issues/1).
-- [ ] 我遵守以下 Merge 规则：PR提交后，邀请群组中任意一人进行 review，即可合并。让 reviewer 在 PR 所在页面写下 review 意见表示通过，即可合并。最简单写一句 LGTM 也可以。不按照本规则执行，自己 PR 自己 Merge 并引入问题，会被收回 Merge 权限。
+- [ ] [EN]I have added screenshots for main devices if this PR includes UI updates. [CN]UI改动，需要将主要设备截图，表明本此 PR 的 UI 改动。
+- [ ] [CN]我遵守以下 Merge 规则：PR 提交后，邀请群组中任意一人进行 review，即可合并。让 reviewer 在 PR 所在页面写下 review 意见表示通过，即可合并。最简单写一句 LGTM 也可以。不按照本规则执行，自己 PR 自己 Merge 并引入问题，会被收回 Merge 权限。如无 merge 权限，请联系 @ChenYilong 执行 merge 操作。
+
+##  screenshots
+
+ iPhoneX+ | iPhone (except for iPhoneX+) | android 
+ :-------------:|:-------------:|:-------------:
+![](http://ww2.sinaimg.cn/large/006tNc79gy1g544k1fcdjg30b20kzn2q.gif)  | ![](http://ww1.sinaimg.cn/large/006tNc79gy1g5bvpae0u8j30ku112dj9.jpg) | ![](http://ww3.sinaimg.cn/large/006tNc79gy1g5bv6com75j30ks11sjsh.jpg)
 
 
 

README.md

@@ -42,6 +42,6 @@ updated
 
  演示 |  主要代码贡献方及介绍
 :-------------:|:-------------:
-| ![](http://ww2.sinaimg.cn/large/006tNc79gy1g544k1fcdjg30b20kzn2q.gif) | <a href="https://github.com/DargonLee"><img src="https://avatars1.githubusercontent.com/u/13093607?s=400&v=4"></a> </p>[**@DargonLee**]( https://github.com/DargonLee ) </p>[《TabBar基础版本，不带加号按钮 issue#11》]( https://github.com/iteatimeteam/tap_water/issues/11 ) 
-![](http://ww4.sinaimg.cn/large/006tNc79gy1g59kad16rdg30b20kzn29.gif) | <a href="https://github.com/SuXiaoya"><img src="https://avatars1.githubusercontent.com/u/11497470?s=400&v=4"></a></p> [@苏筱雅]( https://github.com/SuXiaoya ) </p> [《TabBar 加号按钮未封装版本，带加号按钮 #8》]( https://github.com/iteatimeteam/tap_water/issues/8 ) 
+![](http://ww2.sinaimg.cn/large/006tNc79gy1g544k1fcdjg30b20kzn2q.gif) | <a href="https://github.com/DargonLee"><img src="https://avatars1.githubusercontent.com/u/13093607?s=400&v=4"></a> </p>[**@DargonLee**]( https://github.com/DargonLee ) </p>[《TabBar基础版本，不带加号按钮 issue#11》]( https://github.com/iteatimeteam/tap_water/issues/11) 
+![](http://ww2.sinaimg.cn/large/006tNc79gy1g5by04hgd9g30b20kz786.gif) | <a href="https://github.com/SuXiaoya"><img src="https://avatars1.githubusercontent.com/u/11497470?s=400&v=4"></a></p> [@苏筱雅]( https://github.com/SuXiaoya ) </p> [《TabBar 加号按钮未封装版本，带加号按钮 #8》]( https://github.com/iteatimeteam/tap_water/issues/8 ) 
 

lib/main.dart

@@ -1,24 +1,100 @@
 import 'package:flutter/material.dart';
-
-import 'TapWaterTabbar.dart';
+import 'widget/navigation_bar.dart';
+// import 'TapWaterTabbar.dart';
+import 'tap_water_tab_bar.dart';
 
 void main() => runApp(MyApp());
 
 class MyApp extends StatelessWidget {
   // This widget is the root of your application.
+
   @override
   Widget build(BuildContext context) {
     return MaterialApp(
-      title: 'Flutter Demo',
-      theme: ThemeData(
-        primarySwatch: Colors.blue,
-      ),
-      home: TapWaterTabbar(isButton: true, btmNavbar: [
-              {'title': '微信', 'icon': Icon(Icons.ac_unit)},
-              {'title': '微信', 'icon': Icon(Icons.ac_unit)},
-              {'title': '微信', 'icon': Icon(Icons.ac_unit)},
-              {'title': '微信', 'icon': Icon(Icons.ac_unit)}
-            ]),
-    );
+        title: 'Flutter Demo',
+        theme: ThemeData(
+          primarySwatch: Colors.blue,
+        ),
+        home: _MyAppPage());
+  }
+}
+
+class _MyAppPage extends StatefulWidget {
+  _MyAppPage({Key key}) : super(key: key);
+
+  @override
+  _MyAppPageState createState() => new _MyAppPageState();
+}
+
+class _MyAppPageState extends State<_MyAppPage> {
+  int _index = 0;
+  var _pages = [
+    Align(
+      alignment: Alignment.center,
+      child: Text('页面1'),
+    ),
+    Align(
+      alignment: Alignment.center,
+      child: Text('页面2'),
+    ),
+    Align(
+      alignment: Alignment.center,
+      child: Text('页面3'),
+    ),
+    Align(
+      alignment: Alignment.center,
+      child: Text('页面4'),
+    ),
+    Align(
+      alignment: Alignment.center,
+      child: Text('页面5'),
+    ),
+    Align(
+      alignment: Alignment.center,
+      child: Text('页面6'),
+    ),
+  ];
+  @override
+  Widget build(BuildContext context) {
+    return WaterTabBar(
+        isButton: true,
+        selectedColor: Colors.green,
+        appBar: NavigationBar(),
+        body: _pages[_index],
+        btmNavbar: <NavigationIconView>[
+          NavigationIconView(
+            title: '微信1',
+            icon: Icon(Icons.ac_unit),
+            activeIcon: Icon(Icons.backspace),
+          ),
+          NavigationIconView(
+            title: '微信2',
+            icon: Icon(Icons.ac_unit),
+            activeIcon: Icon(Icons.cached),
+          ),
+          NavigationIconView(
+            title: '微信3',
+            icon: Icon(Icons.ac_unit),
+            activeIcon: Icon(Icons.edit),
+          ),
+          NavigationIconView(
+            title: '微信4',
+            icon: Icon(Icons.ac_unit),
+            activeIcon: Icon(Icons.cached),
+          ),
+          // NavigationIconView(
+          //   title: '微信6',
+          //   icon: Icon(Icons.ac_unit),
+          //   activeIcon: Icon(Icons.cached),
+          // ),
+        ],
+        onTabClick: onTabClick);
+  }
+
+  void onTabClick(int index) {
+    setState(() {
+      _index = index;
+    });
+    print('$index');
   }
 }