diff --git a/example/lib/example_button.dart b/example/lib/example_button.dart index 62b1e17..134e003 100644 --- a/example/lib/example_button.dart +++ b/example/lib/example_button.dart @@ -10,6 +10,7 @@ class ExampleButton extends StatefulWidget { } class _ExampleButtonState extends State { + int groupValue = 0; @override Widget build(BuildContext context) { return ASScaffold( @@ -125,6 +126,37 @@ class _ExampleButtonState extends State { onPressed: () {}, ), ), + ListTile( + title: Text('Radio Button'), + ), + Wrap( + children: [ + ASRadioButton( + groupValue: groupValue, + value: 0, + title: '候选0', + onTap: (_) => setState(() => groupValue = 0), + ), + ASRadioButton( + groupValue: groupValue, + value: 1, + title: '候选1', + onTap: (_) => setState(() => groupValue = 1), + ), + ASRadioButton( + groupValue: groupValue, + value: 2, + title: '候选2', + onTap: (_) => setState(() => groupValue = 2), + ), + ASRadioButton( + groupValue: groupValue, + value: 3, + title: '候选3', + onTap: (_) => setState(() => groupValue = 3), + ), + ], + ), ], ), ); diff --git a/lib/ansu_ui.dart b/lib/ansu_ui.dart index a3d65b1..194a57a 100644 --- a/lib/ansu_ui.dart +++ b/lib/ansu_ui.dart @@ -1,11 +1,15 @@ library ansu_ui; +//buttons export 'buttons/as_button.dart'; export 'buttons/as_longbutton.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_radio_button.dart'; + +//scaffold export 'scaffold/as_scaffold.dart'; export 'styles/as_colors.dart'; diff --git a/lib/buttons/as_radio_button.dart b/lib/buttons/as_radio_button.dart new file mode 100644 index 0000000..94719df --- /dev/null +++ b/lib/buttons/as_radio_button.dart @@ -0,0 +1,63 @@ +import 'package:ansu_ui/styles/as_colors.dart'; +import 'package:flutter/material.dart'; +import 'package:flutter_screenutil/flutter_screenutil.dart'; +import 'package:ansu_ui/extension/num_extension.dart'; + +class ASRadioButton extends StatefulWidget { + /// 选中的值 + final T groupValue; + + ///按钮标题 + final String title; + + /// 该按钮的值 + final T value; + + ///按钮回调 + final Function(T value) onTap; + ASRadioButton({ + Key key, + this.groupValue, + this.title, + this.value, + this.onTap, + }) : super(key: key); + + @override + _ASRadioButtonState createState() => _ASRadioButtonState(); +} + +class _ASRadioButtonState extends State { + bool get _selected => widget.value == widget.groupValue; + @override + Widget build(BuildContext context) { + return InkWell( + onTap: () => widget.onTap(widget.value), + borderRadius: 13.radius, + child: AnimatedContainer( + padding: EdgeInsets.symmetric( + horizontal: _selected ? 17.w : 16.w, + vertical: _selected ? 5.w : 4.w, + ), + child: AnimatedDefaultTextStyle( + child: Text(widget.title), + style: TextStyle( + color: _selected ? kLightTextColor : kTextSubColor, + ), + duration: Duration(milliseconds: 300), + ), + duration: Duration(milliseconds: 300), + decoration: BoxDecoration( + color: _selected ? kPrimaryColor : Colors.transparent, + borderRadius: 13.radius, + border: _selected + ? null + : Border.all( + width: 1.w, + color: Color(0xFF979797), + ), + ), + ), + ); + } +}