나머지 화면들(교사 회원가입, 학생 계정 관리, 관리자 대시보드, 스마트기기 반출 신청/대장, NFC 태그 쓰기/체크인, 비밀번호 변경)에 남아있던 예전 ScaffoldMessenger.showSnackBar를 전부 AppNotice로 교체. - AppNotice.show에 선택적 color 파라미터 추가 - NFC 태그 쓰기/체크인 화면처럼 성공(초록)/실패(빨강) 등 색으로 구분하던 알림은 그 색을 그대로 유지하면서 모양/위치만 통일된 알약 스타일로 바뀜 - 알림 직후 화면을 전환(로그인 성공 후 대시보드 이동, 회원가입 성공 후 로그인 화면 복귀 등)하던 곳들도, AppNotice가 화면(Scaffold)이 아니라 전역 Overlay를 쓰기 때문에 전환 중에 알림이 잘리지 않고 새 화면 위에 계속 보임 (기존 스낵바 방식보다 개선됨) Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
172 lines
4.5 KiB
Dart
172 lines
4.5 KiB
Dart
// 🔔 스낵바 대신 쓰는 알약(pill) 모양 알림. 기능 타일을 누를 때 뜨는
|
|
// "OO로 이동합니다" 같은 짧은 안내용. 푸시 알림(FCM)과는 무관 — 그건 그대로 동작한다.
|
|
// 웹에서는 왼쪽 위(알림창 자리)에, 폰 앱에서는 기존 스낵바처럼 아래쪽에 뜬다.
|
|
import 'package:flutter/foundation.dart' show kIsWeb;
|
|
import 'package:flutter/material.dart';
|
|
import '../theme/app_palette.dart';
|
|
|
|
class AppNotice {
|
|
static final List<_QueuedNotice> _queue = [];
|
|
static bool _showing = false;
|
|
|
|
static void show(
|
|
BuildContext context,
|
|
String message, {
|
|
IconData? icon,
|
|
Color? color,
|
|
}) {
|
|
_queue.add(_QueuedNotice(context, message, icon, color));
|
|
_tryShowNext();
|
|
}
|
|
|
|
static void _tryShowNext() {
|
|
if (_showing || _queue.isEmpty) return;
|
|
final next = _queue.removeAt(0);
|
|
if (!next.context.mounted) {
|
|
_tryShowNext();
|
|
return;
|
|
}
|
|
_showing = true;
|
|
final overlay = Overlay.of(next.context);
|
|
late OverlayEntry entry;
|
|
entry = OverlayEntry(
|
|
builder: (context) => _NoticeBanner(
|
|
message: next.message,
|
|
icon: next.icon,
|
|
color: next.color,
|
|
onDone: () {
|
|
entry.remove();
|
|
_showing = false;
|
|
_tryShowNext();
|
|
},
|
|
),
|
|
);
|
|
overlay.insert(entry);
|
|
}
|
|
}
|
|
|
|
class _QueuedNotice {
|
|
final BuildContext context;
|
|
final String message;
|
|
final IconData? icon;
|
|
final Color? color;
|
|
_QueuedNotice(this.context, this.message, this.icon, this.color);
|
|
}
|
|
|
|
class _NoticeBanner extends StatefulWidget {
|
|
final String message;
|
|
final IconData? icon;
|
|
final Color? color;
|
|
final VoidCallback onDone;
|
|
|
|
const _NoticeBanner({
|
|
required this.message,
|
|
required this.icon,
|
|
required this.color,
|
|
required this.onDone,
|
|
});
|
|
|
|
@override
|
|
State<_NoticeBanner> createState() => _NoticeBannerState();
|
|
}
|
|
|
|
class _NoticeBannerState extends State<_NoticeBanner>
|
|
with SingleTickerProviderStateMixin {
|
|
late final AnimationController _controller;
|
|
|
|
@override
|
|
void initState() {
|
|
super.initState();
|
|
_controller = AnimationController(
|
|
vsync: this,
|
|
duration: const Duration(milliseconds: 220),
|
|
reverseDuration: const Duration(milliseconds: 180),
|
|
);
|
|
_controller.forward();
|
|
Future.delayed(const Duration(milliseconds: 2600), () async {
|
|
if (!mounted) return;
|
|
await _controller.reverse();
|
|
widget.onDone();
|
|
});
|
|
}
|
|
|
|
@override
|
|
void dispose() {
|
|
_controller.dispose();
|
|
super.dispose();
|
|
}
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
final curved = CurvedAnimation(
|
|
parent: _controller,
|
|
curve: Curves.easeOutCubic,
|
|
reverseCurve: Curves.easeInCubic,
|
|
);
|
|
final media = MediaQuery.of(context);
|
|
|
|
final pill = Material(
|
|
color: Colors.transparent,
|
|
child: Container(
|
|
constraints: const BoxConstraints(maxWidth: 360),
|
|
padding: const EdgeInsets.symmetric(horizontal: 18, vertical: 14),
|
|
decoration: BoxDecoration(
|
|
color: widget.color ?? AppPalette.ink,
|
|
borderRadius: BorderRadius.circular(999),
|
|
boxShadow: [
|
|
BoxShadow(
|
|
color: Colors.black.withValues(alpha: 0.25),
|
|
blurRadius: 16,
|
|
offset: const Offset(0, 6),
|
|
),
|
|
],
|
|
),
|
|
child: Row(
|
|
mainAxisSize: MainAxisSize.min,
|
|
children: [
|
|
if (widget.icon != null) ...[
|
|
Icon(widget.icon, color: AppPalette.paper, size: 18),
|
|
const SizedBox(width: 8),
|
|
],
|
|
Flexible(
|
|
child: Text(
|
|
widget.message,
|
|
style: const TextStyle(
|
|
color: AppPalette.paper,
|
|
fontSize: 13.5,
|
|
fontWeight: FontWeight.w600,
|
|
),
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
);
|
|
|
|
final animatedPill = FadeTransition(
|
|
opacity: curved,
|
|
child: SlideTransition(
|
|
position: Tween<Offset>(
|
|
begin: kIsWeb ? const Offset(0, -0.3) : const Offset(0, 0.3),
|
|
end: Offset.zero,
|
|
).animate(curved),
|
|
child: pill,
|
|
),
|
|
);
|
|
|
|
if (kIsWeb) {
|
|
return Positioned(
|
|
top: media.padding.top + 16,
|
|
left: 16,
|
|
child: IgnorePointer(child: animatedPill),
|
|
);
|
|
}
|
|
return Positioned(
|
|
left: 16,
|
|
right: 16,
|
|
bottom: media.padding.bottom + 24,
|
|
child: IgnorePointer(child: Center(child: animatedPill)),
|
|
);
|
|
}
|
|
}
|