feat: IconButton

Author: sam

docs/widget/common/iconbutton/index.md

@@ -1 +1,32 @@
-## **文档完善中**
+## **IconButton**
+>
+图标按钮，通过填充颜色（墨水）对触摸做出反应
+
+### 构造方法
+``` dart
+IconButton({
+    Key key,
+    this.iconSize = 24.0,
+    this.padding = const EdgeInsets.all(8.0),
+    this.alignment = Alignment.center,
+    @required this.icon,
+    this.color,
+    this.highlightColor,
+    this.splashColor,
+    this.disabledColor,
+    @required this.onPressed,
+    this.tooltip
+  })
+```
+
+### 属性介绍
+* iconSize = 24.0：图标大小
+* padding = const EdgeInsets.all(8.0)：按钮图标周围的填充
+* alignment = Alignment.center：图标对齐方式
+* icon：图标
+* color：图标颜色
+* highlightColor：按钮处于按下时按钮的辅助颜色
+* splashColor：按钮处于按下状态时按钮颜色
+* disabledColor：图标被禁用时按钮内图标的颜色
+* onPressed：点击回调
+* tooltip：长按文本提示

lib/widget/common/iconbutton/demo.dart

@@ -6,6 +6,8 @@ class Index extends StatefulWidget {
 }
 
 class _IndexState extends State<Index> {
+  List data = [58273,58275,59493,57903,58283,58284,57771,58285];
+  int index = 0;
   @override
   void initState() {
     super.initState();
@@ -17,9 +19,49 @@ class _IndexState extends State<Index> {
       appBar: AppBar(
         title: Text('IconButton'),
       ),
-      body: Center(
-        child: Text('更新中'),
-      ),
+      body: Container(
+        padding: EdgeInsets.fromLTRB(20.0, 0, 20.0, 0),
+        child: ListView(
+          children: <Widget>[
+            IconButton(
+              iconSize: 30.0,
+              padding: EdgeInsets.all(8.0),
+              alignment: Alignment.center,
+              icon: Icon(IconData(
+                data[index],
+                fontFamily: 'MaterialIcons',
+                matchTextDirection: true
+              )),
+              color: Theme.of(context).primaryColor,
+              highlightColor: Colors.black12,
+              splashColor: Theme.of(context).primaryColorLight,
+              onPressed: (){
+                if (index < 7) {
+                  this.setState(() {
+                    index = index + 1;
+                  });
+                } else {
+                  this.setState(() {
+                    index = 0;
+                  });
+                }
+              },
+              tooltip: '长按文本提示',
+            ),
+            IconButton(
+              iconSize: 30.0,
+              padding: EdgeInsets.all(8.0),
+              alignment: Alignment.center,
+              icon: Icon(Icons.sync_disabled),
+              color: Theme.of(context).primaryColor,
+              highlightColor: Colors.black12,
+              splashColor: Theme.of(context).primaryColorLight,
+              tooltip: '长按文本提示',
+              disabledColor: Colors.grey
+            )
+          ],
+        ),
+      )
     );
   }
 }

readme/widget_progress.md

@@ -54,7 +54,7 @@ Flutter UI
           │  ├─divider 【✔️ v1.0】
           │  ├─flatbutton 【✔️ v1.0】
           │  ├─icon 【✔️ v1.0】
-          │  ├─iconbutton
+          │  ├─iconbutton 【✔️ v1.0】
           │  ├─image 【✔️ v1.0】
           │  ├─listtile 【✔️ v1.0】
           │  ├─placeholder