feat: 优化前端 UI 与交互体验

This commit is contained in:
qzl
2026-03-16 19:04:54 +08:00
parent 5a34616287
commit d3783522e6
16 changed files with 524 additions and 471 deletions
@@ -4,6 +4,7 @@ import 'package:lucide_icons/lucide_icons.dart';
import '../../../../core/theme/design_tokens.dart';
const homeFloatingHeaderKey = ValueKey('home_floating_header');
const homeFloatingHeaderTitleKey = ValueKey('home_floating_header_title');
class HomeFloatingHeader extends StatelessWidget {
const HomeFloatingHeader({
@@ -21,60 +22,62 @@ class HomeFloatingHeader extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Padding(
return Container(
key: homeFloatingHeaderKey,
padding: const EdgeInsets.fromLTRB(
AppSpacing.lg,
AppSpacing.sm,
AppSpacing.lg,
AppSpacing.md,
AppSpacing.sm,
),
child: Container(
key: homeFloatingHeaderKey,
padding: const EdgeInsets.symmetric(
horizontal: AppSpacing.sm,
vertical: AppSpacing.xs,
),
decoration: BoxDecoration(
color: AppColors.homeToolbarSurface,
borderRadius: BorderRadius.circular(AppRadius.full),
border: Border.all(color: AppColors.homeToolbarBorder),
boxShadow: const [
BoxShadow(
color: AppColors.white,
blurRadius: AppRadius.md,
offset: Offset(0, -(AppSpacing.xs / 2)),
),
BoxShadow(
color: AppColors.slate200,
blurRadius: AppRadius.lg,
offset: Offset(0, AppSpacing.sm - (AppSpacing.xs / 2)),
),
],
),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
_HeaderIconButton(
icon: LucideIcons.settings,
onPressed: onTapSettings,
),
Row(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
_HeaderIconButton(
icon: LucideIcons.calendar,
onPressed: onTapCalendar,
decoration: const BoxDecoration(
color: AppColors.homeToolbarSurface,
border: Border(bottom: BorderSide(color: AppColors.homeToolbarBorder)),
),
child: Stack(
alignment: Alignment.center,
children: [
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
_HeaderIconButton(
icon: LucideIcons.settings,
onPressed: onTapSettings,
),
Row(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
_HeaderIconButton(
icon: LucideIcons.calendar,
onPressed: onTapCalendar,
),
const SizedBox(width: AppSpacing.sm),
_MessagesButton(
unreadCount: unreadCount,
onPressed: onTapMessages,
),
],
),
],
),
const IgnorePointer(
child: Padding(
padding: EdgeInsets.symmetric(horizontal: AppSpacing.xl * 3),
child: Text(
'Linksy',
key: homeFloatingHeaderTitleKey,
maxLines: 1,
overflow: TextOverflow.ellipsis,
style: TextStyle(
fontSize: AppSpacing.lg + (AppSpacing.xs / 2),
fontWeight: FontWeight.w600,
color: AppColors.slate800,
),
const SizedBox(width: AppSpacing.sm),
_MessagesButton(
unreadCount: unreadCount,
onPressed: onTapMessages,
),
],
),
),
],
),
),
],
),
);
}