Move skills system documentation from bottom to top of CLAUDE.md for better organization. Refactor Flutter asset page by extracting UI components into separate files and updating import structure for improved modularity.
89 lines
2.5 KiB
Dart
89 lines
2.5 KiB
Dart
import 'package:flutter/material.dart';
|
||
import 'package:google_fonts/google_fonts.dart';
|
||
import 'package:lucide_icons_flutter/lucide_icons.dart';
|
||
|
||
/// 单行菜单项:icon-in-box + title + trailing (chevron / badge / toggle)
|
||
///
|
||
/// 通用菜单行组件,[icon] 和 [iconColor] 控制左侧图标,
|
||
/// [title] 为菜单文字,[trailing] 为右侧自定义内容(默认显示 chevron),
|
||
/// [onTap] 为点击回调。
|
||
class MenuRow extends StatelessWidget {
|
||
final IconData icon;
|
||
final Color iconColor;
|
||
final String title;
|
||
final Widget? trailing;
|
||
final VoidCallback? onTap;
|
||
|
||
const MenuRow({
|
||
super.key,
|
||
required this.icon,
|
||
required this.iconColor,
|
||
required this.title,
|
||
this.trailing,
|
||
this.onTap,
|
||
});
|
||
|
||
@override
|
||
Widget build(BuildContext context) {
|
||
return InkWell(
|
||
onTap: onTap,
|
||
child: Padding(
|
||
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 14),
|
||
child: Row(
|
||
children: [
|
||
// Icon in 36x36 rounded container
|
||
Container(
|
||
width: 36,
|
||
height: 36,
|
||
decoration: BoxDecoration(
|
||
color: Theme.of(context).brightness == Brightness.dark
|
||
? Theme.of(context).colorScheme.surfaceContainerHigh
|
||
: Theme.of(context).colorScheme.surfaceContainerHighest,
|
||
borderRadius: BorderRadius.circular(8),
|
||
),
|
||
child: Center(
|
||
child: Icon(icon, size: 18, color: iconColor),
|
||
),
|
||
),
|
||
const SizedBox(width: 10),
|
||
// Title
|
||
Expanded(
|
||
child: Text(
|
||
title,
|
||
style: GoogleFonts.inter(
|
||
fontSize: 14,
|
||
fontWeight: FontWeight.w500,
|
||
color: Theme.of(context).colorScheme.onSurface,
|
||
),
|
||
),
|
||
),
|
||
// Trailing
|
||
if (trailing != null)
|
||
trailing!
|
||
else
|
||
Icon(
|
||
LucideIcons.chevronRight,
|
||
size: 16,
|
||
color: Theme.of(context).colorScheme.onSurfaceVariant,
|
||
),
|
||
],
|
||
),
|
||
),
|
||
);
|
||
}
|
||
}
|
||
|
||
/// 菜单组内分割线
|
||
class MenuDivider extends StatelessWidget {
|
||
const MenuDivider({super.key});
|
||
|
||
@override
|
||
Widget build(BuildContext context) {
|
||
return Container(
|
||
height: 1,
|
||
color: Theme.of(context).colorScheme.outlineVariant.withOpacity(0.15),
|
||
margin: const EdgeInsets.only(left: 62),
|
||
);
|
||
}
|
||
}
|