2025-07-11 11:03:21 +08:00
|
|
|
|
import 'package:flutter/material.dart';
|
2025-09-05 09:16:54 +08:00
|
|
|
|
|
|
|
|
|
|
/// 自定义默认按钮(支持不可点击/禁用状态和防连点功能)
|
|
|
|
|
|
class CustomButton extends StatefulWidget {
|
2025-07-11 11:03:21 +08:00
|
|
|
|
final String text; // 按钮文字
|
|
|
|
|
|
final Color backgroundColor; // 按钮背景色
|
|
|
|
|
|
final double borderRadius; // 圆角半径(默认5)
|
|
|
|
|
|
final VoidCallback? onPressed; // 点击事件回调
|
|
|
|
|
|
final EdgeInsetsGeometry? padding; // 内边距
|
|
|
|
|
|
final EdgeInsetsGeometry? margin; // 外边距
|
|
|
|
|
|
final double? height; // 按钮高度
|
|
|
|
|
|
final TextStyle? textStyle; // 文字样式
|
|
|
|
|
|
|
2025-08-27 16:14:50 +08:00
|
|
|
|
/// 新增:是否可点击(true 可点,false 禁用)
|
|
|
|
|
|
/// 注意:如果 onPressed 为 null,也会被视为不可点击
|
|
|
|
|
|
final bool enabled;
|
|
|
|
|
|
|
|
|
|
|
|
/// 新增:禁用时的背景色(可选)
|
|
|
|
|
|
final Color? disabledBackgroundColor;
|
|
|
|
|
|
|
|
|
|
|
|
/// 新增:禁用时的文字颜色(可选)
|
|
|
|
|
|
final Color? disabledTextColor;
|
|
|
|
|
|
|
2025-09-05 09:16:54 +08:00
|
|
|
|
/// 新增:防连点间隔时间(毫秒)
|
|
|
|
|
|
final int debounceInterval;
|
|
|
|
|
|
|
2025-07-11 11:03:21 +08:00
|
|
|
|
const CustomButton({
|
|
|
|
|
|
super.key,
|
|
|
|
|
|
required this.text,
|
|
|
|
|
|
required this.backgroundColor,
|
|
|
|
|
|
this.borderRadius = 5.0,
|
|
|
|
|
|
this.onPressed,
|
|
|
|
|
|
this.padding,
|
|
|
|
|
|
this.margin,
|
|
|
|
|
|
this.height,
|
|
|
|
|
|
this.textStyle,
|
2025-08-27 16:14:50 +08:00
|
|
|
|
this.enabled = true,
|
|
|
|
|
|
this.disabledBackgroundColor,
|
|
|
|
|
|
this.disabledTextColor,
|
2025-09-05 09:16:54 +08:00
|
|
|
|
this.debounceInterval = 1000, // 默认1秒防连点
|
2025-07-11 11:03:21 +08:00
|
|
|
|
});
|
|
|
|
|
|
|
2025-09-05 09:16:54 +08:00
|
|
|
|
@override
|
|
|
|
|
|
State<CustomButton> createState() => _CustomButtonState();
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
class _CustomButtonState extends State<CustomButton> {
|
|
|
|
|
|
// 记录最后一次点击时间
|
|
|
|
|
|
DateTime _lastClickTime = DateTime(0);
|
|
|
|
|
|
|
2025-07-11 11:03:21 +08:00
|
|
|
|
@override
|
|
|
|
|
|
Widget build(BuildContext context) {
|
2025-08-27 16:14:50 +08:00
|
|
|
|
// 如果 enabled 为 false 或 onPressed 为 null,则视为不可点击
|
2025-09-05 09:16:54 +08:00
|
|
|
|
final bool isEnabled = widget.enabled && widget.onPressed != null;
|
2025-08-27 16:14:50 +08:00
|
|
|
|
|
|
|
|
|
|
// 计算展示用背景色与文字样式
|
|
|
|
|
|
final Color bgColor = isEnabled
|
2025-09-05 09:16:54 +08:00
|
|
|
|
? widget.backgroundColor
|
|
|
|
|
|
: (widget.disabledBackgroundColor ?? Colors.grey.shade400);
|
2025-08-27 16:14:50 +08:00
|
|
|
|
|
|
|
|
|
|
TextStyle finalTextStyle;
|
2025-09-05 09:16:54 +08:00
|
|
|
|
if (widget.textStyle != null) {
|
2025-08-27 16:14:50 +08:00
|
|
|
|
finalTextStyle = isEnabled
|
2025-09-05 09:16:54 +08:00
|
|
|
|
? widget.textStyle!
|
|
|
|
|
|
: widget.textStyle!.copyWith(
|
|
|
|
|
|
color: widget.disabledTextColor ?? widget.textStyle!.color?.withOpacity(0.8) ?? Colors.white70,
|
2025-08-27 16:14:50 +08:00
|
|
|
|
);
|
|
|
|
|
|
} else {
|
|
|
|
|
|
finalTextStyle = TextStyle(
|
2025-09-05 09:16:54 +08:00
|
|
|
|
color: isEnabled ? Colors.white : (widget.disabledTextColor ?? Colors.white70),
|
2025-09-02 16:22:17 +08:00
|
|
|
|
fontSize: 14,
|
2025-08-27 16:14:50 +08:00
|
|
|
|
fontWeight: FontWeight.bold,
|
|
|
|
|
|
);
|
|
|
|
|
|
}
|
|
|
|
|
|
|
2025-09-05 09:16:54 +08:00
|
|
|
|
// 处理点击事件(添加防连点逻辑)
|
|
|
|
|
|
void handleOnPressed() {
|
|
|
|
|
|
final now = DateTime.now();
|
|
|
|
|
|
if (now.difference(_lastClickTime).inMilliseconds < widget.debounceInterval) {
|
|
|
|
|
|
// 在防连点间隔内,不执行操作
|
|
|
|
|
|
return;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
_lastClickTime = now;
|
|
|
|
|
|
|
|
|
|
|
|
if (widget.onPressed != null) {
|
|
|
|
|
|
widget.onPressed!();
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
2025-08-27 16:14:50 +08:00
|
|
|
|
// 点击拦截器 + 视觉反馈(禁用时降低不透明度)
|
|
|
|
|
|
return Opacity(
|
|
|
|
|
|
opacity: isEnabled ? 1.0 : 0.65,
|
|
|
|
|
|
child: AbsorbPointer(
|
|
|
|
|
|
absorbing: !isEnabled,
|
|
|
|
|
|
child: GestureDetector(
|
2025-09-05 09:16:54 +08:00
|
|
|
|
onTap: isEnabled ? handleOnPressed : null,
|
2025-08-27 16:14:50 +08:00
|
|
|
|
child: Container(
|
2025-09-05 09:16:54 +08:00
|
|
|
|
height: widget.height ?? 45, // 默认高度45
|
|
|
|
|
|
padding: widget.padding ?? const EdgeInsets.all(6), // 默认内边距
|
|
|
|
|
|
margin: widget.margin ?? const EdgeInsets.symmetric(horizontal: 5), // 默认外边距
|
2025-08-27 16:14:50 +08:00
|
|
|
|
decoration: BoxDecoration(
|
2025-09-05 09:16:54 +08:00
|
|
|
|
borderRadius: BorderRadius.circular(widget.borderRadius),
|
2025-08-27 16:14:50 +08:00
|
|
|
|
color: bgColor,
|
|
|
|
|
|
),
|
|
|
|
|
|
child: Center(
|
|
|
|
|
|
child: Text(
|
2025-09-05 09:16:54 +08:00
|
|
|
|
widget.text,
|
2025-08-27 16:14:50 +08:00
|
|
|
|
style: finalTextStyle,
|
|
|
|
|
|
),
|
2025-07-11 11:03:21 +08:00
|
|
|
|
),
|
|
|
|
|
|
),
|
|
|
|
|
|
),
|
|
|
|
|
|
),
|
|
|
|
|
|
);
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|