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),
|
|||
|
|
);
|
|||
|
|
}
|
|||
|
|
}
|