From f2eac8911d91aa2376f7400bb96fb14bc83471b4 Mon Sep 17 00:00:00 2001 From: zhang <494089941@qq.com> Date: Tue, 24 Nov 2020 16:28:55 +0800 Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E6=8C=89=E9=92=AE=EF=BC=8Cad?= =?UTF-8?q?d=20bottom=20button?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- example/lib/example_bottom_button.dart | 49 +++++++++ example/lib/main.dart | 2 + lib/buttons/as_bottom_button.dart | 142 +++++++++++++++++++++++++ lib/buttons/as_button.dart | 16 ++- lib/buttons/as_gradientbutton.dart | 12 +-- lib/buttons/as_longbutton.dart | 4 +- 6 files changed, 207 insertions(+), 18 deletions(-) create mode 100644 example/lib/example_bottom_button.dart create mode 100644 lib/buttons/as_bottom_button.dart diff --git a/example/lib/example_bottom_button.dart b/example/lib/example_bottom_button.dart new file mode 100644 index 0000000..25566ac --- /dev/null +++ b/example/lib/example_bottom_button.dart @@ -0,0 +1,49 @@ +import 'package:ansu_ui/ansu_ui.dart'; +import 'package:ansu_ui/buttons/as_bottom_button.dart'; +import 'package:flutter/material.dart'; + +class ExampleBottomButton extends StatefulWidget { + ExampleBottomButton({Key key}) : super(key: key); + + @override + _ExampleBottomButtonState createState() => _ExampleBottomButtonState(); +} + +class _ExampleBottomButtonState extends State { + @override + Widget build(BuildContext context) { + return ASScaffold( + title: 'BottomButton', + body: Center(), + bottomNavigationBar: Column( + mainAxisSize: MainAxisSize.min, + children: [ + ASBottomButton.infinity( + title: 'null', + onPressed: () {}, + ), + ASBottomButton.gradient( + title: '新增地址', + onPressed: () {}, + ), + Row( + children: [ + SizedBox( + width: 112.w, + child: ASBottomButton.shortWhite( + title: 'null', + onPressed: () {}, + ), + ), + Expanded( + child: ASBottomButton.gradient( + title: 'null', + onPressed: () {}, + )) + ], + ) + ], + ), + ); + } +} diff --git a/example/lib/main.dart b/example/lib/main.dart index 051ebc0..3735365 100644 --- a/example/lib/main.dart +++ b/example/lib/main.dart @@ -1,4 +1,5 @@ import 'package:ansu_ui/ansu_ui.dart'; +import 'package:example/example_bottom_button.dart'; import 'package:flutter/material.dart'; import 'package:get/get.dart'; @@ -44,6 +45,7 @@ class _MyHomePageState extends State { children: [ ASButton.info(title:'Button',onPressed: () => Get.to(ExampleButton())), ASButton.info(title:'Scaffold', onPressed:() => Get.to(ExampleScaffold())), + ASButton.info(title: 'BottomBottun',onPressed: () => Get.to(ExampleBottomButton()),), ], ), ); diff --git a/lib/buttons/as_bottom_button.dart b/lib/buttons/as_bottom_button.dart new file mode 100644 index 0000000..d42984a --- /dev/null +++ b/lib/buttons/as_bottom_button.dart @@ -0,0 +1,142 @@ +import 'package:flutter/material.dart'; +import 'package:flutter_screenutil/flutter_screenutil.dart'; + +class ASBottomButton extends StatefulWidget { + ///动态组件，可以是字符或组件 + final dynamic title; + + ///颜色 + final Color bgcolor; + + ///文字颜色 + final Color textColor; + + ///文字风格 + final TextStyle textStyle; + + ///内边距 + final EdgeInsetsGeometry padding; + + ///不可点击时颜色 + final Color disableColor; + + ///不可点击时文字颜色 + final Color disableTextColor; + + ///宽度 + final double width; + + ///渐变起始位置 + final AlignmentGeometry begin; + + ///渐变结束位置 + final AlignmentGeometry end; + + ///渐变颜色 + final List colors; + + ///点击事件 + final VoidCallback onPressed; + + ASBottomButton( + {Key key, + this.title, + this.bgcolor, + this.textColor, + this.textStyle, + this.padding, + this.disableColor, + this.disableTextColor, + this.width, + this.begin, + this.end, + this.colors, + this.onPressed}) + : super(key: key); + + ASBottomButton.infinity({ + Key key, + @required this.title, + this.onPressed, + this.textStyle, + this.padding, + this.disableColor, + this.disableTextColor, + this.begin, + this.end, + this.colors, + }) : bgcolor = Color(0xFFF6B72D), + textColor = Color(0xFFFFFFFF), + width = double.infinity, + super(key: key); + + ASBottomButton.gradient( + {Key key, + @required this.title, + this.onPressed, + this.bgcolor, + this.textStyle, + this.padding, + this.disableColor, + this.disableTextColor, + this.begin, + this.end}) + : colors = [Color(0xFFFFA700), Color(0xFFFFBD00)], + textColor = Color(0xFFFFFFFF), + width = double.infinity, + super(key: key); + ASBottomButton.shortWhite({ + Key key, + @required this.title, + this.onPressed, + this.bgcolor, + this.textStyle, + this.padding, + this.disableColor, + this.disableTextColor, + this.begin, + this.end, + }) : colors = [Color(0xFFFBFBFB), Color(0xFFFFFFFF)], + textColor = Color(0xFFFFB800), + width = double.infinity, + super(key: key); + + @override + _ASBottomButtonState createState() => _ASBottomButtonState(); +} + +class _ASBottomButtonState extends State { + @override + Widget build(BuildContext context) { + return Container( + padding: EdgeInsets.only(bottom: MediaQuery.of(context).padding.bottom), + width: widget.width ?? double.infinity, + decoration: BoxDecoration( + gradient: LinearGradient( + begin: widget.begin ?? Alignment.bottomRight, + end: widget.end ?? Alignment.topLeft, + colors: widget.colors ?? [widget.bgcolor, widget.bgcolor]), + ), + child: MaterialButton( + onPressed: widget.onPressed, + textColor: widget.textColor ?? Color(0xFFFFFFFF), + disabledColor: widget.disableColor, + disabledTextColor: widget.disableTextColor, + padding: widget.padding ?? + EdgeInsets.symmetric( + vertical: 13.w, + ), + elevation: 0, + hoverElevation: 0, + highlightElevation: 0, + focusElevation: 0, + materialTapTargetSize: MaterialTapTargetSize.shrinkWrap, + child: widget.title is String + ? Text(widget.title, + style: widget.textStyle ?? + TextStyle(fontSize: 20.sp, fontWeight: FontWeight.bold)) + : widget.title, + ), + ); + } +} diff --git a/lib/buttons/as_button.dart b/lib/buttons/as_button.dart index 1d4ecc2..3c0d252 100644 --- a/lib/buttons/as_button.dart +++ b/lib/buttons/as_button.dart @@ -125,15 +125,13 @@ class ASButton extends StatefulWidget { this.outlineColor, this.width, }) : bgcolor = Color(0xFFFFBD32), - textColor=Color(0xFF0000000), - textStyle = TextStyle( - fontSize: 14.sp, - fontWeight: FontWeight.bold), + textColor = Color(0xFF0000000), + textStyle = TextStyle(fontSize: 14.sp, fontWeight: FontWeight.bold), radius = 5.w, outline = false, disableColor = Color(0xFFFFDF9B), disableTextColor = Color(0x73000000), - padding=EdgeInsets.symmetric(vertical: 8.w), + padding = EdgeInsets.symmetric(vertical: 8.w), super(key: key); @override @@ -144,17 +142,15 @@ class _ASButtonState extends State { @override Widget build(BuildContext context) { return MaterialButton( - disabledColor: widget.disableColor ?? widget.bgcolor, - disabledTextColor: widget.disableTextColor ?? Color(0x73000000), + disabledColor: widget.disableColor, + disabledTextColor: widget.disableTextColor, textColor: widget.textColor ?? Color(0xFFFFB600), minWidth: widget.width ?? 75.w, materialTapTargetSize: MaterialTapTargetSize.shrinkWrap, onPressed: widget.onPressed, child: widget.title is String ? Text(widget.title, - style: widget.textStyle ?? - TextStyle( - fontSize: 13.sp)) + style: widget.textStyle ?? TextStyle(fontSize: 13.sp)) : widget.title, padding: widget.padding ?? EdgeInsets.symmetric(vertical: 6.w), shape: RoundedRectangleBorder( diff --git a/lib/buttons/as_gradientbutton.dart b/lib/buttons/as_gradientbutton.dart index a0080dd..fc8656b 100644 --- a/lib/buttons/as_gradientbutton.dart +++ b/lib/buttons/as_gradientbutton.dart @@ -65,8 +65,8 @@ class ASGradientButton extends StatefulWidget { radius = 19.w, colors = [Color(0xFFF89B14), Color(0xFFF86B14)], width = 100.w, - begin = Alignment.centerLeft, - end = Alignment.centerRight, + begin = Alignment.topCenter, + end = Alignment.bottomCenter, padding = EdgeInsets.symmetric(vertical: 8.w), super(key: key); @@ -100,16 +100,16 @@ class _ASGradientButtonState extends State { width: widget.width ?? 110.w, decoration: BoxDecoration( gradient: LinearGradient( - begin: widget.begin ?? Alignment.centerLeft, - end: widget.end ?? Alignment.centerRight, + begin: widget.begin ?? Alignment.topCenter, + end: widget.end ?? Alignment.bottomCenter, colors: widget.colors ?? [Color(0xFFFFA700), Color(0xFFFFBD00)], ), borderRadius: BorderRadius.circular(widget.radius ?? 20.w), ), child: MaterialButton( - disabledColor: widget.disableColor ?? Colors.grey, + disabledColor: widget.disableColor, textColor: widget.textColor ?? Color(0xD9FFFFFF), - disabledTextColor: widget.disableTextColor ?? Color(0x73000000), + disabledTextColor: widget.disableTextColor, materialTapTargetSize: MaterialTapTargetSize.shrinkWrap, onPressed: widget.onPressed, child: widget.title is String diff --git a/lib/buttons/as_longbutton.dart b/lib/buttons/as_longbutton.dart index 7f6454c..28ca19c 100644 --- a/lib/buttons/as_longbutton.dart +++ b/lib/buttons/as_longbutton.dart @@ -95,9 +95,9 @@ class _ASLongButtonState extends State { Widget build(BuildContext context) { return MaterialButton( minWidth: widget.width ?? 280.w, - disabledColor: widget.disableColor ?? widget.bgColor, + disabledColor: widget.disableColor, textColor: widget.textColor ?? Color(0xFFFFFFFF), - disabledTextColor: widget.disableTextColor ?? Color(0x73000000), + disabledTextColor: widget.disableTextColor, materialTapTargetSize: MaterialTapTargetSize.shrinkWrap, onPressed: widget.onPressed, child: widget.title is String