action_bar.dart 3.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114
  1. import 'package:flutter/material.dart';
  2. import '../../core/theme/app_colors.dart';
  3. import '../../core/theme/app_colors_extension.dart';
  4. /// Pencil Component/ActionBar — 底部操作栏
  5. ///
  6. /// 水平排列三个按钮:重置(可选)、存草稿、提交。
  7. /// 所有按钮圆角22,总高度72,padding 16,gap 12,背景bgCard。
  8. class ActionBar extends StatelessWidget {
  9. final String? leftLabel;
  10. final String centerLabel;
  11. final String rightLabel;
  12. final VoidCallback? onLeftTap;
  13. final VoidCallback? onCenterTap;
  14. final VoidCallback? onRightTap;
  15. final bool showLeft;
  16. const ActionBar({
  17. super.key,
  18. this.leftLabel,
  19. required this.centerLabel,
  20. required this.rightLabel,
  21. this.onLeftTap,
  22. this.onCenterTap,
  23. this.onRightTap,
  24. this.showLeft = true,
  25. });
  26. @override
  27. Widget build(BuildContext context) {
  28. final colors = Theme.of(context).extension<AppColorsExtension>()!;
  29. return Container(
  30. height: 72,
  31. padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 16),
  32. decoration: BoxDecoration(
  33. color: colors.bgCard,
  34. ),
  35. child: Row(
  36. children: [
  37. // 左侧重置按钮(可选显示)
  38. if (showLeft && leftLabel != null) ...[
  39. Expanded(
  40. child: _ActionButton(
  41. label: leftLabel!,
  42. backgroundColor: colors.bgCard,
  43. textColor: colors.textSecondary,
  44. onTap: onLeftTap,
  45. ),
  46. ),
  47. const SizedBox(width: 12),
  48. ],
  49. // 中间存草稿按钮
  50. Expanded(
  51. child: _ActionButton(
  52. label: centerLabel,
  53. backgroundColor: colors.primaryLight,
  54. textColor: colors.primary,
  55. onTap: onCenterTap,
  56. ),
  57. ),
  58. const SizedBox(width: 12),
  59. // 右侧提交按钮
  60. Expanded(
  61. child: _ActionButton(
  62. label: rightLabel,
  63. backgroundColor: colors.primary,
  64. textColor: colors.bgCard,
  65. onTap: onRightTap,
  66. ),
  67. ),
  68. ],
  69. ),
  70. );
  71. }
  72. }
  73. class _ActionButton extends StatelessWidget {
  74. final String label;
  75. final Color backgroundColor;
  76. final Color textColor;
  77. final VoidCallback? onTap;
  78. const _ActionButton({
  79. required this.label,
  80. required this.backgroundColor,
  81. required this.textColor,
  82. this.onTap,
  83. });
  84. @override
  85. Widget build(BuildContext context) {
  86. return SizedBox(
  87. height: 40,
  88. child: Material(
  89. color: backgroundColor,
  90. borderRadius: BorderRadius.circular(22),
  91. child: InkWell(
  92. onTap: onTap,
  93. borderRadius: BorderRadius.circular(22),
  94. child: Center(
  95. child: Text(
  96. label,
  97. style: TextStyle(
  98. fontSize: AppFontSizes.body,
  99. fontWeight: FontWeight.w500,
  100. color: textColor,
  101. ),
  102. ),
  103. ),
  104. ),
  105. ),
  106. );
  107. }
  108. }