49d4aa36a7
- feat(sync): SyncEngine 接入 EditorPage, 保存时 enqueue + 网络恢复自动 trySync - fix(editor): authorId 从 AuthBloc 获取, 替代硬编码 'local' - fix(bloc): class_bloc/calendar/profile/parent catch(_).全部改为 debugPrint - feat(editor): 编辑器工具栏拆分 (brush_panel/tag_panel/text_format_bar/dot_grid_painter) - feat(editor): EditorBloc 扩展 + EditorPage 增强 - feat(search): SearchBloc 扩展搜索功能 - feat(home): HomeBloc/HomePage 增强 - feat(auth): LoginPage 增强 - feat(templates): TemplateGalleryPage 重构 - fix(web): 管理端班级/日记页面修复 - fix(server): comment_service + theme_handler 修复 - docs: 添加全链路审计报告和验证截图
104 lines
3.2 KiB
Dart
104 lines
3.2 KiB
Dart
// 编辑器工具栏 — 底部单行 6 按钮面板
|
||
//
|
||
// 精简布局：
|
||
// - 单行 6 个工具按钮（贴纸/模板/画笔/照片/文字/更多）
|
||
// - 高度 72px + 底部安全区
|
||
// - 每个按钮：Column(icon 20px + label 10px)，最小 36x36
|
||
//
|
||
// 详细选项已移至独立面板：
|
||
// - 画笔选项 → BrushPanel（底部抽屉）
|
||
// - 撤销/重做 → 顶栏
|
||
// - 清除 → 顶栏
|
||
//
|
||
// 设计规范：触摸目标 ≥ 44px，圆角 22px (pill)
|
||
|
||
import 'package:flutter/material.dart';
|
||
|
||
import '../bloc/editor_bloc.dart';
|
||
|
||
/// 编辑器工具栏 — 精简版
|
||
class EditorToolbar extends StatelessWidget {
|
||
final EditorState state;
|
||
final ValueChanged<EditorEvent> onEvent;
|
||
|
||
const EditorToolbar({
|
||
super.key,
|
||
required this.state,
|
||
required this.onEvent,
|
||
});
|
||
|
||
@override
|
||
Widget build(BuildContext context) {
|
||
final colorScheme = Theme.of(context).colorScheme;
|
||
return Container(
|
||
height: 72 + MediaQuery.of(context).padding.bottom,
|
||
decoration: BoxDecoration(
|
||
color: colorScheme.surface,
|
||
border: Border(
|
||
top: BorderSide(
|
||
color: colorScheme.outlineVariant.withValues(alpha: 0.3),
|
||
),
|
||
),
|
||
),
|
||
child: Padding(
|
||
padding: EdgeInsets.only(bottom: MediaQuery.of(context).padding.bottom),
|
||
child: Row(
|
||
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
|
||
children: [
|
||
_toolBtn(context, EditorTool.sticker, Icons.emoji_emotions_rounded, '贴纸'),
|
||
_toolBtn(context, EditorTool.template, Icons.dashboard_customize_rounded, '模板'),
|
||
_toolBtn(context, EditorTool.brush, Icons.gesture_rounded, '画笔'),
|
||
_toolBtn(context, EditorTool.photo, Icons.add_photo_alternate_rounded, '照片'),
|
||
_toolBtn(context, EditorTool.text, Icons.text_fields_rounded, '文字'),
|
||
_toolBtn(context, EditorTool.more, Icons.more_horiz_rounded, '更多'),
|
||
],
|
||
),
|
||
),
|
||
);
|
||
}
|
||
|
||
/// 工具按钮 — icon + label 垂直排列
|
||
Widget _toolBtn(
|
||
BuildContext context,
|
||
EditorTool tool,
|
||
IconData icon,
|
||
String label,
|
||
) {
|
||
final isActive = state.activeTool == tool;
|
||
final colorScheme = Theme.of(context).colorScheme;
|
||
|
||
return GestureDetector(
|
||
onTap: () => onEvent(ToolChanged(tool)),
|
||
behavior: HitTestBehavior.opaque,
|
||
child: Container(
|
||
constraints: const BoxConstraints(minWidth: 36, minHeight: 36),
|
||
padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 4),
|
||
child: Column(
|
||
mainAxisSize: MainAxisSize.min,
|
||
mainAxisAlignment: MainAxisAlignment.center,
|
||
children: [
|
||
Icon(
|
||
icon,
|
||
size: 20,
|
||
color: isActive
|
||
? colorScheme.primary
|
||
: colorScheme.onSurface.withValues(alpha: 0.5),
|
||
),
|
||
const SizedBox(height: 2),
|
||
Text(
|
||
label,
|
||
style: TextStyle(
|
||
fontSize: 10,
|
||
color: isActive
|
||
? colorScheme.primary
|
||
: colorScheme.onSurface.withValues(alpha: 0.5),
|
||
fontWeight: isActive ? FontWeight.w600 : FontWeight.normal,
|
||
),
|
||
),
|
||
],
|
||
),
|
||
),
|
||
);
|
||
}
|
||
}
|