diff --git a/assets/flutter.db b/assets/flutter.db index d44af11..929bf87 100644 Binary files a/assets/flutter.db and b/assets/flutter.db differ diff --git a/lib/views/widgets/MultiChildRenderObjectWidget/Stack/node1_base.dart b/lib/views/widgets/MultiChildRenderObjectWidget/Stack/node1_base.dart index 6ade34a..ce16eaf 100644 --- a/lib/views/widgets/MultiChildRenderObjectWidget/Stack/node1_base.dart +++ b/lib/views/widgets/MultiChildRenderObjectWidget/Stack/node1_base.dart @@ -48,7 +48,7 @@ class CustomStack extends StatelessWidget { textDirection: TextDirection.rtl, fit: StackFit.loose, alignment: Alignment.topRight, - // overflow: Overflow.clip, // 1.22.0-10.0.pre.251被去除 + // overflow: Overflow.clip, // 1.22.0 被去除 children: [yellowBox, redBox, greenBox, cyanBox], ), ); diff --git a/lib/views/widgets/StatefulWidget/ElevatedButton/node1_base.dart b/lib/views/widgets/StatefulWidget/ElevatedButton/node1_base.dart new file mode 100644 index 0000000..6a13290 --- /dev/null +++ b/lib/views/widgets/StatefulWidget/ElevatedButton/node1_base.dart @@ -0,0 +1,42 @@ +import 'package:flutter/material.dart'; + +/// create by 张风捷特烈 on 2020/9/21 +/// contact me by email 1981462002@qq.com +/// 说明: 354 ElevatedButton Material风格的升起按钮，表现和RaisedButton类似。可通过样式更改边框、颜色、阴影等属性。 +// { +// "widgetId": 354, +// "name": 'ElevatedButton基本使用', +// "priority": 1, +// "subtitle": +// "【child】 : 是否具有滚动主体 【Widget】\n" +// "【onPressed】 : 点击事件 【VoidCallback】\n" +// "【onLongPress】 : 长按事件 【VoidCallback】", +// } + +class ElevatedButtonDemo extends StatelessWidget { + @override + Widget build(BuildContext context) { + return Container( + alignment: Alignment.center, + height: 60, + child: Wrap( + spacing: 20, + children: [ + ElevatedButton( + child: Text('ElevatedButton'), + onPressed: _onPressed, + onLongPress: _onLongPress, + ), + ElevatedButton( + child: Text('禁用按钮'), + onPressed: null, + onLongPress: null, + ), + ], + )); + } + + _onPressed() {} + + _onLongPress() {} +} diff --git a/lib/views/widgets/StatefulWidget/ElevatedButton/node2_style.dart b/lib/views/widgets/StatefulWidget/ElevatedButton/node2_style.dart new file mode 100644 index 0000000..d4d6100 --- /dev/null +++ b/lib/views/widgets/StatefulWidget/ElevatedButton/node2_style.dart @@ -0,0 +1,58 @@ +import 'package:flutter/material.dart'; + +/// create by 张风捷特烈 on 2020/9/21 +/// contact me by email 1981462002@qq.com +/// 说明: +// { +// "widgetId": 354, +// "name": 'ElevatedButton样式', +// "priority": 2, +// "subtitle": +// "【style】 : 按钮样式 【ButtonStyle】\n" +// "【focusNode】 : 焦点 【FocusNode】\n" +// "【clipBehavior】 : 裁剪行为 【Clip】\n" +// "【autofocus】 : 自动聚焦 【bool】", +// } + +class ElevatedButtonStyleDemo extends StatelessWidget { + @override + Widget build(BuildContext context) { + return Container( + alignment: Alignment.center, + child: Wrap( + spacing: 10, + children: [ + ElevatedButton( + style: TextButton.styleFrom( + backgroundColor: Colors.orange, + primary: Colors.white, + elevation: 2, + shadowColor: Colors.orangeAccent), + child: Text('ElevatedButton样式'), + onPressed: _onPressed, + onLongPress: _onLongPress, + ), + ElevatedButton( + style: TextButton.styleFrom( + backgroundColor: Colors.white, + primary: Colors.black, + side: BorderSide(color: Colors.blue,width: 1), + shape: RoundedRectangleBorder( + borderRadius: BorderRadius.all(Radius.circular(10)) + ), + // elevation: 2, + shadowColor: Colors.orangeAccent), + child: Text('ElevatedButton边线'), + autofocus: false, + onPressed: _onPressed, + onLongPress: _onLongPress, + ), + ], + ), + ); + } + + _onPressed() {} + + _onLongPress() {} +} diff --git a/lib/views/widgets/StatefulWidget/OutlinedButton/node1_base.dart b/lib/views/widgets/StatefulWidget/OutlinedButton/node1_base.dart new file mode 100644 index 0000000..27498b8 --- /dev/null +++ b/lib/views/widgets/StatefulWidget/OutlinedButton/node1_base.dart @@ -0,0 +1,42 @@ +import 'package:flutter/material.dart'; + +/// create by 张风捷特烈 on 2020/9/21 +/// contact me by email 1981462002@qq.com +/// 说明: 355 OutlinedButton Material风格的边线按钮，表现和OutlineButton类似。可通过样式更改边框、颜色、阴影等属性。 +// { +// "widgetId": 355, +// "name": 'OutlinedButton基本使用', +// "priority": 1, +// "subtitle": +// "【child】 : 是否具有滚动主体 【Widget】\n" +// "【onPressed】 : 点击事件 【VoidCallback】\n" +// "【onLongPress】 : 长按事件 【VoidCallback】", +// } + +class OutlinedButtonDemo extends StatelessWidget { + @override + Widget build(BuildContext context) { + return Container( + alignment: Alignment.center, + height: 60, + child: Wrap( + spacing: 20, + children: [ + OutlinedButton( + child: Text('OutlinedButton'), + onPressed: _onPressed, + onLongPress: _onLongPress, + ), + OutlinedButton( + child: Text('禁用按钮'), + onPressed: null, + onLongPress: null, + ), + ], + )); + } + + _onPressed() {} + + _onLongPress() {} +} diff --git a/lib/views/widgets/StatefulWidget/OutlinedButton/node2_style.dart b/lib/views/widgets/StatefulWidget/OutlinedButton/node2_style.dart new file mode 100644 index 0000000..48a97a9 --- /dev/null +++ b/lib/views/widgets/StatefulWidget/OutlinedButton/node2_style.dart @@ -0,0 +1,58 @@ +import 'package:flutter/material.dart'; + +/// create by 张风捷特烈 on 2020/9/21 +/// contact me by email 1981462002@qq.com +/// 说明: +// { +// "widgetId": 355, +// "name": 'OutlinedButton样式', +// "priority": 2, +// "subtitle": +// "【style】 : 按钮样式 【ButtonStyle】\n" +// "【focusNode】 : 焦点 【FocusNode】\n" +// "【clipBehavior】 : 裁剪行为 【Clip】\n" +// "【autofocus】 : 自动聚焦 【bool】", +// } + +class OutlinedButtonStyleDemo extends StatelessWidget { + @override + Widget build(BuildContext context) { + return Container( + alignment: Alignment.center, + child: Wrap( + spacing: 10, + children: [ + OutlinedButton( + style: TextButton.styleFrom( + backgroundColor: Colors.orange, + primary: Colors.white, + elevation: 2, + shadowColor: Colors.orangeAccent), + child: Text('ElevatedButton样式'), + onPressed: _onPressed, + onLongPress: _onLongPress, + ), + OutlinedButton( + style: TextButton.styleFrom( + backgroundColor: Colors.white, + primary: Colors.black, + side: BorderSide(color: Colors.blue,width: 1), + shape: RoundedRectangleBorder( + borderRadius: BorderRadius.all(Radius.circular(10)) + ), + // elevation: 2, + shadowColor: Colors.orangeAccent), + child: Text('ElevatedButton边线'), + autofocus: false, + onPressed: _onPressed, + onLongPress: _onLongPress, + ), + ], + ), + ); + } + + _onPressed() {} + + _onLongPress() {} +} diff --git a/lib/views/widgets/StatefulWidget/TextButton/node1_base.dart b/lib/views/widgets/StatefulWidget/TextButton/node1_base.dart new file mode 100644 index 0000000..0a07887 --- /dev/null +++ b/lib/views/widgets/StatefulWidget/TextButton/node1_base.dart @@ -0,0 +1,43 @@ +import 'package:flutter/material.dart'; + + +/// create by 张风捷特烈 on 2020/9/21 +/// contact me by email 1981462002@qq.com +/// 说明: 353 TextButton Material风格的文字按钮，默认只有文字，点击时有水波纹。可通过样式更改边框、颜色、阴影等属性。 +// { +// "widgetId": 353, +// "name": 'TextButton基本使用', +// "priority": 1, +// "subtitle": +// "【child】 : 是否具有滚动主体 【Widget】\n" +// "【onPressed】 : 点击事件 【VoidCallback】\n" +// "【onLongPress】 : 长按事件 【VoidCallback】", +// } + +class TextButtonDemo extends StatelessWidget { + @override + Widget build(BuildContext context) { + return Container( + alignment: Alignment.center, + height: 60, + child: Wrap( + spacing: 20, + children: [ + TextButton( + child: Text('TextButton 文字'), + onPressed: _onPressed, + onLongPress: _onLongPress, + ), + TextButton( + child: Text('TextButton 禁用'), + onPressed: null, + onLongPress: null, + ), + ], + )); + } + + _onPressed() {} + + _onLongPress() {} +} diff --git a/lib/views/widgets/StatefulWidget/TextButton/node2_style.dart b/lib/views/widgets/StatefulWidget/TextButton/node2_style.dart new file mode 100644 index 0000000..8d3fe3f --- /dev/null +++ b/lib/views/widgets/StatefulWidget/TextButton/node2_style.dart @@ -0,0 +1,59 @@ +import 'package:flutter/material.dart'; + +/// create by 张风捷特烈 on 2020/9/21 +/// contact me by email 1981462002@qq.com +/// 说明: +// { +// "widgetId": 353, +// "name": 'TextButton样式', +// "priority": 2, +// "subtitle": +// "【style】 : 按钮样式 【ButtonStyle】\n" +// "【focusNode】 : 焦点 【FocusNode】\n" +// "【clipBehavior】 : 裁剪行为 【Clip】\n" +// "【autofocus】 : 自动聚焦 【bool】", +// } + +class TextButtonStyleDemo extends StatelessWidget { + @override + Widget build(BuildContext context) { + return Container( + alignment: Alignment.center, + child: Wrap( + spacing: 10, + children: [ + TextButton( + style: TextButton.styleFrom( + backgroundColor: Colors.blue, + padding: EdgeInsets.symmetric(horizontal: 8), + primary: Colors.white, + elevation: 2, + shadowColor: Colors.orangeAccent), + child: Text('TextButton 样式'), + onPressed: _onPressed, + onLongPress: _onLongPress, + ), + TextButton( + style: TextButton.styleFrom( + backgroundColor: Colors.white, + primary: Colors.black, + side: BorderSide(color: Colors.blue,width: 1), + shape: RoundedRectangleBorder( + borderRadius: BorderRadius.all(Radius.circular(10)) + ), + // elevation: 2, + shadowColor: Colors.orangeAccent), + child: Text('TextButton 边线'), + autofocus: false, + onPressed: _onPressed, + onLongPress: _onLongPress, + ), + ], + ), + ); + } + + _onPressed() {} + + _onLongPress() {} +} diff --git a/lib/views/widgets/exp/stateful_unit.dart b/lib/views/widgets/exp/stateful_unit.dart index d648a68..057b17f 100644 --- a/lib/views/widgets/exp/stateful_unit.dart +++ b/lib/views/widgets/exp/stateful_unit.dart @@ -145,3 +145,12 @@ export '../StatefulWidget/WidgetsApp/node1_base.dart' hide HomePage; export '../StatefulWidget/WidgetInspector/node1_base.dart' hide HomePage; export '../StatefulWidget/AnimatedTheme/node1_base.dart'; export '../StatefulWidget/AnimatedPhysicalModel/node1_base.dart'; + +export '../StatefulWidget/TextButton/node1_base.dart'; +export '../StatefulWidget/TextButton/node2_style.dart'; + +export '../StatefulWidget/ElevatedButton/node1_base.dart'; +export '../StatefulWidget/ElevatedButton/node2_style.dart'; + +export '../StatefulWidget/OutlinedButton//node1_base.dart'; +export '../StatefulWidget/OutlinedButton/node2_style.dart'; \ No newline at end of file diff --git a/lib/views/widgets/widgets_map.dart b/lib/views/widgets/widgets_map.dart index a4b691d..521db88 100644 --- a/lib/views/widgets/widgets_map.dart +++ b/lib/views/widgets/widgets_map.dart @@ -42,6 +42,21 @@ class WidgetsMap { CustomCard(), ShapeCard(), ]; + case "ElevatedButton": + return [ + ElevatedButtonDemo(), + ElevatedButtonStyleDemo(), + ]; + case "TextButton": + return [ + TextButtonDemo(), + TextButtonStyleDemo(), + ]; + case "OutlinedButton": + return [ + OutlinedButtonDemo(), + OutlinedButtonStyleDemo(), + ]; case "FlutterLogo": return [ CustomFlutterLogo(),