status_banner.dart 1.7 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465
  1. import 'package:flutter/material.dart';
  2. import '../../core/theme/app_colors.dart';
  3. /// Pencil Component/StatusBanner — 状态横幅
  4. ///
  5. /// 垂直居中排列:大图标(40x40)、状态文字(16号/600字重)、副文字(13号)。
  6. /// 圆角8,高度120,padding (20,16),gap 8。
  7. class StatusBanner extends StatelessWidget {
  8. final IconData icon;
  9. final String statusText;
  10. final String subText;
  11. final Color color;
  12. const StatusBanner({
  13. super.key,
  14. required this.icon,
  15. required this.statusText,
  16. required this.subText,
  17. this.color = AppColors.success,
  18. });
  19. @override
  20. Widget build(BuildContext context) {
  21. final backgroundColor = _lighten(color, 0.88);
  22. return Container(
  23. width: double.infinity,
  24. padding: const EdgeInsets.fromLTRB(16, 24, 16, 24),
  25. decoration: BoxDecoration(
  26. color: backgroundColor,
  27. borderRadius: BorderRadius.circular(8),
  28. ),
  29. child: Column(
  30. mainAxisSize: MainAxisSize.min,
  31. children: [
  32. Icon(icon, size: 40, color: color),
  33. const SizedBox(height: 8),
  34. Text(
  35. statusText,
  36. style: TextStyle(
  37. fontSize: AppFontSizes.subtitle,
  38. fontWeight: FontWeight.w600,
  39. color: color,
  40. ),
  41. ),
  42. if (subText.isNotEmpty) ...[
  43. const SizedBox(height: 4),
  44. Text(
  45. subText,
  46. style: TextStyle(
  47. fontSize: 13,
  48. color: color,
  49. ),
  50. ),
  51. ],
  52. ],
  53. ),
  54. );
  55. }
  56. /// 将颜色变浅,用于计算背景色
  57. static Color _lighten(Color color, double amount) {
  58. return Color.lerp(color, Colors.white, amount)!;
  59. }
  60. }