From 7d688b08ac237c6215fcb9a9ec5acdb1b3f97305 Mon Sep 17 00:00:00 2001 From: laiiihz Date: Fri, 5 Mar 2021 17:10:52 +0800 Subject: [PATCH] migrate some widget from statefulWidget to statelessWidget to enhance performance --- .vscode/settings.json | 2 +- lib/ansu_ui.dart | 4 +- lib/buttons/as_button.dart | 45 ++++++++---------- ...entbutton.dart => as_gradient_button.dart} | 47 +++++++++---------- ...as_longbutton.dart => as_long_button.dart} | 37 +++++++-------- lib/dialog/as_bottom_dialog.dart | 13 ++--- lib/dialog/as_dialog.dart | 19 +++----- lib/dialog/as_dialog_button.dart | 2 +- lib/drawer/as_drawer.dart | 17 +++---- lib/list_tile/as_edit_tile.dart | 19 +++----- lib/list_tile/as_list_tile.dart | 24 ++++------ lib/pickers/as_two_date_picker.dart | 2 +- lib/refresh/as_refresh.dart | 23 ++++----- lib/tag/as_tag.dart | 26 +++++----- 14 files changed, 115 insertions(+), 165 deletions(-) rename lib/buttons/{as_gradientbutton.dart => as_gradient_button.dart} (70%) rename lib/buttons/{as_longbutton.dart => as_long_button.dart} (70%) diff --git a/.vscode/settings.json b/.vscode/settings.json index 660b6ae..d8b2ffb 100644 --- a/.vscode/settings.json +++ b/.vscode/settings.json @@ -1,3 +1,3 @@ { - "dart.flutterSdkPath": "/Users/akufe/apps/flutter" + "dart.flutterSdkPath": "/Users/akufe/fvm/versions/1.22.6" } \ No newline at end of file diff --git a/lib/ansu_ui.dart b/lib/ansu_ui.dart index 87c5e85..7d76823 100644 --- a/lib/ansu_ui.dart +++ b/lib/ansu_ui.dart @@ -2,11 +2,11 @@ library ansu_ui; //buttons export 'buttons/as_button.dart'; -export 'buttons/as_longbutton.dart'; +export 'buttons/as_long_button.dart'; export 'buttons/as_back_button.dart'; export 'buttons/as_numeric_button.dart'; export 'buttons/as_bottom_button.dart'; -export 'buttons/as_gradientbutton.dart'; +export 'buttons/as_gradient_button.dart'; export 'buttons/as_radio_button.dart'; export 'buttons/as_material_button.dart'; diff --git a/lib/buttons/as_button.dart b/lib/buttons/as_button.dart index 08dce3c..6c13740 100644 --- a/lib/buttons/as_button.dart +++ b/lib/buttons/as_button.dart @@ -3,7 +3,7 @@ import 'package:flutter_screenutil/flutter_screenutil.dart'; import 'package:ansu_ui/styles/as_colors.dart'; ///安速按钮 -class ASButton extends StatefulWidget { +class ASButton extends StatelessWidget { ///按钮颜色 final Color bgcolor; @@ -143,40 +143,33 @@ class ASButton extends StatefulWidget { padding = EdgeInsets.symmetric(vertical: 8.w), super(key: key); - @override - _ASButtonState createState() => _ASButtonState(); -} - -class _ASButtonState extends State { @override Widget build(BuildContext context) { return MaterialButton( - disabledColor: widget.disableColor, - disabledTextColor: widget.disableTextColor, - textColor: widget.textColor ?? kLightPrimaryColor, - minWidth: widget.width, + disabledColor: disableColor, + disabledTextColor: disableTextColor, + textColor: textColor ?? kLightPrimaryColor, + minWidth: width, materialTapTargetSize: MaterialTapTargetSize.shrinkWrap, - onPressed: widget.onPressed, - child: widget.title is String - ? Text(widget.title, - style: widget.textStyle ?? TextStyle(fontSize: 13.sp)) - : widget.title, - padding: widget.padding ?? - EdgeInsets.symmetric(vertical: 6.w, horizontal: 12.w), - shape: widget.radius == null + onPressed: onPressed, + child: title is String + ? Text(title, style: textStyle ?? TextStyle(fontSize: 13.sp)) + : title, + padding: padding ?? EdgeInsets.symmetric(vertical: 6.w, horizontal: 12.w), + shape: radius == null ? StadiumBorder( - side: widget.outline - ? BorderSide(color: widget.outlineColor, width: 0.5.w) + side: outline + ? BorderSide(color: outlineColor, width: 0.5.w) : BorderSide.none, ) : RoundedRectangleBorder( - side: widget.outline - ? BorderSide(color: widget.outlineColor, width: 0.5.w) + side: outline + ? BorderSide(color: outlineColor, width: 0.5.w) : BorderSide.none, - borderRadius: BorderRadius.circular(widget.radius ?? 15.5.w)), - color: widget.bgcolor ?? kForegroundColor, - splashColor: widget.splashColor, - highlightColor: widget.splashColor?.withOpacity(0.3), + borderRadius: BorderRadius.circular(radius ?? 15.5.w)), + color: bgcolor ?? kForegroundColor, + splashColor: splashColor, + highlightColor: splashColor?.withOpacity(0.3), elevation: 0, focusElevation: 0, highlightElevation: 0, diff --git a/lib/buttons/as_gradientbutton.dart b/lib/buttons/as_gradient_button.dart similarity index 70% rename from lib/buttons/as_gradientbutton.dart rename to lib/buttons/as_gradient_button.dart index 9a34bd3..9f382a7 100644 --- a/lib/buttons/as_gradientbutton.dart +++ b/lib/buttons/as_gradient_button.dart @@ -2,7 +2,7 @@ import 'package:flutter/material.dart'; import 'package:flutter_screenutil/flutter_screenutil.dart'; import 'package:ansu_ui/styles/as_colors.dart'; -class ASGradientButton extends StatefulWidget { +class ASGradientButton extends StatelessWidget { ///按钮文字 ///动态类型，可以是string或者widget final dynamic title; @@ -90,19 +90,14 @@ class ASGradientButton extends StatefulWidget { colors = [Color(0xFFFFA700), Color(0xFFFFBD00)], super(key: key); - @override - _ASGradientButtonState createState() => _ASGradientButtonState(); -} - -class _ASGradientButtonState extends State { - bool get isNullFunc => widget.onPressed == null; - List get colors { - if (widget.colors == null) + bool get isNullFunc => onPressed == null; + List get _colors { + if (colors == null) return null; else { return List.generate( - widget.colors.length, - (index) => widget.colors[index].withOpacity(isNullFunc ? 0.5 : 1), + colors.length, + (index) => colors[index].withOpacity(isNullFunc ? 0.5 : 1), ); } } @@ -112,32 +107,32 @@ class _ASGradientButtonState extends State { return AnimatedContainer( curve: Curves.easeInOutCirc, duration: Duration(milliseconds: 300), - width: widget.width ?? 110.w, + width: width ?? 110.w, decoration: BoxDecoration( gradient: LinearGradient( - begin: widget.begin ?? Alignment.topCenter, - end: widget.end ?? Alignment.bottomCenter, - colors: colors ?? + begin: begin ?? Alignment.topCenter, + end: end ?? Alignment.bottomCenter, + colors: _colors ?? [ kDarkPrimaryColor.withOpacity(isNullFunc ? 0.5 : 1), kLightPrimaryColor.withOpacity(isNullFunc ? 0.5 : 1), ], ), - borderRadius: BorderRadius.circular(widget.radius ?? 20.w), + borderRadius: BorderRadius.circular(radius ?? 20.w), ), child: MaterialButton( - disabledColor: widget.disableColor, - textColor: widget.textColor ?? Color(0xD9FFFFFF), - disabledTextColor: widget.disableTextColor, + disabledColor: disableColor, + textColor: textColor ?? Color(0xD9FFFFFF), + disabledTextColor: disableTextColor, materialTapTargetSize: MaterialTapTargetSize.shrinkWrap, - onPressed: widget.onPressed, - child: widget.title is String - ? Text(widget.title, - style: widget.textStyle ?? TextStyle(fontSize: 18.sp)) - : widget.title, - padding: widget.padding ?? EdgeInsets.symmetric(vertical: 10.w), + onPressed: onPressed, + child: title is String + ? Text(title, + style: textStyle ?? TextStyle(fontSize: 18.sp)) + : title, + padding: padding ?? EdgeInsets.symmetric(vertical: 10.w), shape: RoundedRectangleBorder( - borderRadius: BorderRadius.circular(widget.radius ?? 20.w)), + borderRadius: BorderRadius.circular(radius ?? 20.w)), elevation: 0, ), ); diff --git a/lib/buttons/as_longbutton.dart b/lib/buttons/as_long_button.dart similarity index 70% rename from lib/buttons/as_longbutton.dart rename to lib/buttons/as_long_button.dart index 75f64e6..757fed4 100644 --- a/lib/buttons/as_longbutton.dart +++ b/lib/buttons/as_long_button.dart @@ -2,7 +2,7 @@ import 'package:flutter/material.dart'; import 'package:flutter_screenutil/flutter_screenutil.dart'; import 'package:ansu_ui/styles/as_colors.dart'; -class ASLongButton extends StatefulWidget { +class ASLongButton extends StatelessWidget { ///按钮文字 ///动态类型，可以是string或者widget final dynamic title; @@ -87,35 +87,30 @@ class ASLongButton extends StatefulWidget { outline = true, outlineColor = kDarkPrimaryColor, super(key: key); - @override - _ASLongButtonState createState() => _ASLongButtonState(); -} - -class _ASLongButtonState extends State { @override Widget build(BuildContext context) { return MaterialButton( - minWidth: widget.width ?? 280.w, - disabledColor: widget.disableColor, - textColor: widget.textColor ?? kLightTextColor, - disabledTextColor: widget.disableTextColor, + minWidth: width ?? 280.w, + disabledColor: disableColor, + textColor: textColor ?? kLightTextColor, + disabledTextColor: disableTextColor, materialTapTargetSize: MaterialTapTargetSize.shrinkWrap, - onPressed: widget.onPressed, - child: widget.title is String - ? Text(widget.title, - style: widget.textStyle ?? TextStyle(fontSize: 20.sp)) - : widget.title, - padding: widget.padding ?? EdgeInsets.symmetric(vertical: 8.w), + onPressed: onPressed, + child: title is String + ? Text(title, + style: textStyle ?? TextStyle(fontSize: 20.sp)) + : title, + padding: padding ?? EdgeInsets.symmetric(vertical: 8.w), shape: RoundedRectangleBorder( - side: widget.outline - ? BorderSide(color: widget.outlineColor, width: 1.w) + side: outline + ? BorderSide(color: outlineColor, width: 1.w) : BorderSide.none, - borderRadius: BorderRadius.circular(widget.radius ?? 22.5.w)), - color: widget.bgColor ?? kForegroundColor, + borderRadius: BorderRadius.circular(radius ?? 22.5.w)), + color: bgColor ?? kForegroundColor, elevation: 0, highlightElevation: 0, - splashColor: ColorTool.getSplashColor(widget.bgColor), + splashColor: ColorTool.getSplashColor(bgColor), ); } } diff --git a/lib/dialog/as_bottom_dialog.dart b/lib/dialog/as_bottom_dialog.dart index 4ae4ff2..2a60935 100644 --- a/lib/dialog/as_bottom_dialog.dart +++ b/lib/dialog/as_bottom_dialog.dart @@ -10,16 +10,11 @@ import 'package:velocity_x/velocity_x.dart'; ///`items` /// ///with auto cancel -class ASBottomDialog extends StatefulWidget { +class ASBottomDialog extends StatelessWidget { final List items; ASBottomDialog({Key key, @required this.items}) : super(key: key); - @override - _ASBottomDialogState createState() => _ASBottomDialogState(); -} - -class _ASBottomDialogState extends State { - _buildCancel() { + _buildCancel(BuildContext context) { return ASMaterialButton( color: kForegroundColor, onPressed: () { @@ -37,9 +32,9 @@ class _ASBottomDialogState extends State { crossAxisAlignment: CrossAxisAlignment.stretch, mainAxisSize: MainAxisSize.min, children: [ - ...widget.items.sepWidget(separate: ASDivider()), + ...items.sepWidget(separate: ASDivider()), 10.hb, - _buildCancel(), + _buildCancel(context), ], ), ); diff --git a/lib/dialog/as_dialog.dart b/lib/dialog/as_dialog.dart index 9857edf..3148e5c 100644 --- a/lib/dialog/as_dialog.dart +++ b/lib/dialog/as_dialog.dart @@ -5,7 +5,7 @@ import 'package:ansu_ui/styles/as_colors.dart'; import 'package:ansu_ui/extension/num_extension.dart'; import 'package:ansu_ui/extension/list_extension.dart'; -class ASDialog extends StatefulWidget { +class ASDialog extends StatelessWidget { final bool close; ///按钮组 @@ -30,21 +30,16 @@ class ASDialog extends StatefulWidget { this.childPadding, }) : super(key: key); - @override - _ASDialogState createState() => _ASDialogState(); -} - -class _ASDialogState extends State { - double get _widgetSpacer => widget.spacer ?? 20.w; + double get _widgetSpacer => spacer ?? 20.w; EdgeInsets get _widgetPadding => - widget.padding ?? + padding ?? EdgeInsets.only( top: 13.w, bottom: 20.w, ); EdgeInsets get _childPadding => - widget.childPadding ?? + childPadding ?? EdgeInsets.only( top: 40.w, bottom: 50.w, @@ -75,16 +70,16 @@ class _ASDialogState extends State { ), child: Padding( padding: _childPadding, - child: widget.child, + child: child, ), ), ), - ...widget.items + ...items .sepWidget(separate: SizedBox(height: _widgetSpacer)), ], ), ), - widget.close + close ? Positioned( right: 0, top: 0, diff --git a/lib/dialog/as_dialog_button.dart b/lib/dialog/as_dialog_button.dart index 747710d..de943dd 100644 --- a/lib/dialog/as_dialog_button.dart +++ b/lib/dialog/as_dialog_button.dart @@ -1,6 +1,6 @@ import 'package:flutter/material.dart'; import 'package:flutter_screenutil/flutter_screenutil.dart'; -import 'package:ansu_ui/buttons/as_longbutton.dart'; +import 'package:ansu_ui/buttons/as_long_button.dart'; class ASDialogButton extends StatelessWidget { final String title; diff --git a/lib/drawer/as_drawer.dart b/lib/drawer/as_drawer.dart index c23fe3d..d225c92 100644 --- a/lib/drawer/as_drawer.dart +++ b/lib/drawer/as_drawer.dart @@ -5,7 +5,7 @@ import 'package:get/get.dart'; ///打开抽屉 /// -///pass a value through navigator. +///pass a value through navigator. /// ///example `Navigator.pop(context,true)` or `Get.back(result:true)` Future showASDrawer(Widget drawer) async { @@ -35,7 +35,7 @@ Future showASDrawer(Widget drawer) async { ///安速抽屉 /// ///使用`showASDrawer`打开抽屉，不推荐使用`Scaffold`的`drawer`和`endDrawer`打开抽屉。 -class ASDrawer extends StatefulWidget { +class ASDrawer extends StatelessWidget { ///子组件List Children /// ///内部为ListView实现 @@ -85,11 +85,6 @@ class ASDrawer extends StatefulWidget { 'child or children cant be null'), super(key: key); - @override - _ASDrawerState createState() => _ASDrawerState(); -} - -class _ASDrawerState extends State { @override Widget build(BuildContext context) { return Align( @@ -100,15 +95,15 @@ class _ASDrawerState extends State { height: screenHeight - statusBarHeight, width: screenWidth - 44.w, child: Material( - child: widget.child ?? + child: child ?? Stack( children: [ ListView( - padding: widget.padding, - children: widget.children, + padding: padding, + children: children, ), Positioned( - child: widget.bottom ?? SizedBox(), + child: bottom ?? SizedBox(), bottom: 45.w, left: 26.w, right: 26.w, diff --git a/lib/list_tile/as_edit_tile.dart b/lib/list_tile/as_edit_tile.dart index fbc21e9..a6bab67 100644 --- a/lib/list_tile/as_edit_tile.dart +++ b/lib/list_tile/as_edit_tile.dart @@ -3,7 +3,7 @@ import 'package:flutter_screenutil/flutter_screenutil.dart'; import 'package:ansu_ui/styles/as_colors.dart'; import 'package:ansu_ui/extension/num_extension.dart'; -class ASEditTile extends StatefulWidget { +class ASEditTile extends StatelessWidget { final Widget title; final FocusNode node; final String hintText; @@ -16,18 +16,13 @@ class ASEditTile extends StatefulWidget { this.controller, }) : super(key: key); - @override - _ASEditTileState createState() => _ASEditTileState(); -} - -class _ASEditTileState extends State { FocusNode _node; @override Widget build(BuildContext context) { return GestureDetector( onTap: () { - if (widget.node != null) { - widget.node?.requestFocus(); + if (node != null) { + node?.requestFocus(); } else { _node?.requestFocus(); } @@ -43,13 +38,13 @@ class _ASEditTileState extends State { color: Colors.black.withOpacity(0.65), fontSize: 14.sp, ), - child: widget.title ?? Text(''), + child: title ?? Text(''), ), ), Expanded( child: TextField( - focusNode: widget.node ?? _node, - controller: widget.controller, + focusNode: node ?? _node, + controller: controller, textAlign: TextAlign.end, style: TextStyle( fontSize: 14.sp, @@ -60,7 +55,7 @@ class _ASEditTileState extends State { border: InputBorder.none, isDense: true, contentPadding: EdgeInsets.zero, - hintText: widget.hintText, + hintText: hintText, hintStyle: TextStyle( color: kTextSubColor, fontSize: 14.sp, diff --git a/lib/list_tile/as_list_tile.dart b/lib/list_tile/as_list_tile.dart index b713ce3..4ce5b92 100644 --- a/lib/list_tile/as_list_tile.dart +++ b/lib/list_tile/as_list_tile.dart @@ -2,7 +2,7 @@ import 'package:flutter/material.dart'; import 'package:flutter_screenutil/flutter_screenutil.dart'; import 'package:ansu_ui/styles/as_colors.dart'; -class ASListTile extends StatefulWidget { +class ASListTile extends StatelessWidget { ///主标题 final String title; @@ -33,27 +33,23 @@ class ASListTile extends StatefulWidget { }) : height = 32.w, crossAxisAlignment = CrossAxisAlignment.center, super(key: key); - @override - _ASListTileState createState() => _ASListTileState(); -} -class _ASListTileState extends State { @override Widget build(BuildContext context) { return Container( - margin: widget.height == null + margin: height == null ? EdgeInsets.symmetric(vertical: 8.w, horizontal: 10.w) : EdgeInsets.symmetric(horizontal: 10.w), - height: widget.height, + height: height, alignment: Alignment.centerLeft, child: Row( crossAxisAlignment: - widget.crossAxisAlignment ?? CrossAxisAlignment.start, + crossAxisAlignment ?? CrossAxisAlignment.start, children: [ Container( width: 85.w, child: Text( - widget.title, + title, maxLines: 1, overflow: TextOverflow.visible, softWrap: false, @@ -61,17 +57,17 @@ class _ASListTileState extends State { ), ), Expanded( - child: widget.text == null + child: text == null ? Text('') - : widget.text is String + : text is String ? Text( - widget.text, + text, maxLines: 2, style: TextStyle(color: kTextSubColor, fontSize: 14.sp), ) - : widget.text, + : text, ), - widget.trail ?? SizedBox() + trail ?? SizedBox() ], ), ); diff --git a/lib/pickers/as_two_date_picker.dart b/lib/pickers/as_two_date_picker.dart index ff1b2ca..a04d351 100644 --- a/lib/pickers/as_two_date_picker.dart +++ b/lib/pickers/as_two_date_picker.dart @@ -4,7 +4,7 @@ import 'package:ansu_ui/styles/as_colors.dart'; import 'package:ansu_ui/extension/num_extension.dart'; import 'package:ansu_ui/extension/text_style_extension.dart'; import 'package:ansu_ui/pickers/as_date_range_picker_part.dart'; -import 'package:ansu_ui/buttons/as_longbutton.dart'; +import 'package:ansu_ui/buttons/as_long_button.dart'; import 'package:velocity_x/velocity_x.dart'; class AS2DatePicker extends StatefulWidget { diff --git a/lib/refresh/as_refresh.dart b/lib/refresh/as_refresh.dart index 7d2c57c..0624a3c 100644 --- a/lib/refresh/as_refresh.dart +++ b/lib/refresh/as_refresh.dart @@ -2,7 +2,7 @@ import 'package:flutter/material.dart'; import 'package:flutter_easyrefresh/easy_refresh.dart'; import 'package:ansu_ui/styles/as_colors.dart'; -class ASRefresh extends StatefulWidget { +class ASRefresh extends StatelessWidget { final Widget child; final Future Function() onLoad; final Future Function() onRefresh; @@ -23,22 +23,17 @@ class ASRefresh extends StatefulWidget { this.scrollController, }) : super(key: key); - @override - _ASRefreshState createState() => _ASRefreshState(); -} - -class _ASRefreshState extends State { @override Widget build(BuildContext context) { return EasyRefresh( - scrollController: widget.scrollController, - child: widget.child, - onRefresh: widget.onRefresh, - onLoad: widget.onLoad, - controller: widget.controller, - firstRefresh: widget.firstRefresh, - emptyWidget: widget.emptyWidget, - firstRefreshWidget: widget.firstRefreshWidget, + scrollController: scrollController, + child: child, + onRefresh: onRefresh, + onLoad: onLoad, + controller: controller, + firstRefresh: firstRefresh, + emptyWidget: emptyWidget, + firstRefreshWidget: firstRefreshWidget, header: MaterialHeader( valueColor: AlwaysStoppedAnimation(kPrimaryColor), ), diff --git a/lib/tag/as_tag.dart b/lib/tag/as_tag.dart index 73bb3d2..c018132 100644 --- a/lib/tag/as_tag.dart +++ b/lib/tag/as_tag.dart @@ -3,7 +3,7 @@ import 'package:flutter_screenutil/flutter_screenutil.dart'; import 'package:ansu_ui/styles/as_colors.dart'; import 'package:ansu_ui/extension/num_extension.dart'; -class ASTag extends StatefulWidget { +class ASTag extends StatelessWidget { ///宽度 final double width; @@ -108,37 +108,33 @@ class ASTag extends StatefulWidget { width = 38.w, height = 19.w, super(key: key); - @override - _ASTagState createState() => _ASTagState(); -} -class _ASTagState extends State { @override Widget build(BuildContext context) { return Container( - padding: widget.padding ?? + padding: padding ?? EdgeInsets.symmetric( horizontal: 6.w, vertical: 2.w, ), - width: widget.width, - height: widget.height ?? 19.w, + width: width, + height: height ?? 19.w, decoration: BoxDecoration( - color: widget.bgColor ?? kDarkPrimaryColor, - border: widget.outline + color: bgColor ?? kDarkPrimaryColor, + border: outline ? Border.all( width: 1.w, - color: widget.outlineColor ?? kSecondaryColor, + color: outlineColor ?? kSecondaryColor, ) : Border.fromBorderSide(BorderSide.none), - borderRadius: (widget.radius ?? 9.w).radius, + borderRadius: (radius ?? 9.w).radius, ), alignment: Alignment.center, child: Text( - widget.text, - style: widget.textStyle ?? + text, + style: textStyle ?? TextStyle( - color: widget.textColor, + color: textColor, fontSize: 10.sp, ), ),