제목 알약 폰트 통일 + 위치 조정, 좁은 폼 너비, 메인 타일 확대

- TitlePill을 String 기반으로 바꿔서 모든 화면(설정/교사 회원가입/관리자
  시스템/NFC 태그 쓰기·체크인/학생 관리/스마트기기 반출 신청·대장/실시간
  출석 현황)이 완전히 같은 폰트(굵게, 15px, 흰색)를 쓰게 통일
- 알약이 화면 맨 위에 딱 붙어 보이지 않도록 위쪽에 8px 여백 추가
- "스마트기기 반출 신청" 폼과 "관리자 시스템"의 "모든 출석 데이터 초기화"
  버튼이 넓은 화면에서 양옆으로 과하게 늘어지던 문제 수정 - 최대 폭
  420px로 제한하고 가운데 정렬 (기존 대비 약 1/3 크기)
- 메인 대시보드 타일 목표 크기를 184 → 276(50% 확대)로 키우고, 아이콘/
  패딩/폰트 기준값도 함께 올려서 제목 10→12pt, 부제 8→10pt로 확대

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
2026-09-08 16:26:29 +09:00
co-authored by Claude Sonnet 5
parent 527661b6e5
commit 5d37d3e3b1
11 changed files with 173 additions and 211 deletions
+8 -4
View File
@@ -78,9 +78,7 @@ class _AdminDashboardState extends State<AdminDashboard> {
foregroundColor: AppPalette.ink, foregroundColor: AppPalette.ink,
elevation: 0, elevation: 0,
centerTitle: true, centerTitle: true,
title: const TitlePill( title: const TitlePill('관리자 시스템'),
child: Text('관리자 시스템', style: TextStyle(color: Colors.white)),
),
actions: [ actions: [
IconButton( IconButton(
icon: const Icon(Icons.logout), icon: const Icon(Icons.logout),
@@ -94,6 +92,8 @@ class _AdminDashboardState extends State<AdminDashboard> {
body: Center( body: Center(
child: Padding( child: Padding(
padding: const EdgeInsets.all(24.0), padding: const EdgeInsets.all(24.0),
child: ConstrainedBox(
constraints: const BoxConstraints(maxWidth: 420),
child: Column( child: Column(
mainAxisAlignment: MainAxisAlignment.center, mainAxisAlignment: MainAxisAlignment.center,
children: [ children: [
@@ -105,7 +105,10 @@ class _AdminDashboardState extends State<AdminDashboard> {
const SizedBox(height: 20), const SizedBox(height: 20),
const Text( const Text(
'데이터베이스 관리', '데이터베이스 관리',
style: TextStyle(fontSize: 22, fontWeight: FontWeight.bold), style: TextStyle(
fontSize: 22,
fontWeight: FontWeight.bold,
),
), ),
const SizedBox(height: 40), const SizedBox(height: 40),
@@ -141,6 +144,7 @@ class _AdminDashboardState extends State<AdminDashboard> {
), ),
), ),
), ),
),
); );
}, },
); );
+1 -3
View File
@@ -17,9 +17,7 @@ class DashboardSettingsPage extends StatelessWidget {
foregroundColor: AppPalette.ink, foregroundColor: AppPalette.ink,
elevation: 0, elevation: 0,
centerTitle: true, centerTitle: true,
title: const TitlePill( title: const TitlePill('설정'),
child: Text('설정', style: TextStyle(color: Colors.white)),
),
), ),
body: ListView( body: ListView(
padding: const EdgeInsets.all(16), padding: const EdgeInsets.all(16),
+1 -9
View File
@@ -94,15 +94,7 @@ class _DeviceCheckoutLedgerPageState extends State<DeviceCheckoutLedgerPage> {
foregroundColor: AppPalette.ink, foregroundColor: AppPalette.ink,
elevation: 0, elevation: 0,
centerTitle: true, centerTitle: true,
title: const TitlePill( title: const TitlePill('스마트기기 반출 대장'),
child: Text(
'스마트기기 반출 대장',
style: TextStyle(
fontWeight: FontWeight.bold,
color: Colors.white,
),
),
),
actions: [ actions: [
IconButton( IconButton(
icon: const Icon(Icons.refresh_rounded), icon: const Icon(Icons.refresh_rounded),
+9 -10
View File
@@ -87,18 +87,13 @@ class _DeviceCheckoutRequestScreenState
foregroundColor: AppPalette.ink, foregroundColor: AppPalette.ink,
elevation: 0, elevation: 0,
centerTitle: true, centerTitle: true,
title: const TitlePill( title: const TitlePill('스마트기기 반출 신청'),
child: Text(
'스마트기기 반출 신청',
style: TextStyle(
fontWeight: FontWeight.bold,
color: Colors.white,
),
),
),
), ),
body: SingleChildScrollView( body: SingleChildScrollView(
padding: const EdgeInsets.all(24.0), padding: const EdgeInsets.all(24.0),
child: Center(
child: ConstrainedBox(
constraints: const BoxConstraints(maxWidth: 420),
child: Column( child: Column(
crossAxisAlignment: CrossAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start,
children: [ children: [
@@ -164,7 +159,9 @@ class _DeviceCheckoutRequestScreenState
width: double.infinity, width: double.infinity,
height: 50, height: 50,
child: ElevatedButton( child: ElevatedButton(
onPressed: _controller.isSubmitting ? null : _submit, onPressed: _controller.isSubmitting
? null
: _submit,
style: ElevatedButton.styleFrom( style: ElevatedButton.styleFrom(
backgroundColor: AppPalette.ink, backgroundColor: AppPalette.ink,
foregroundColor: AppPalette.paper, foregroundColor: AppPalette.paper,
@@ -191,6 +188,8 @@ class _DeviceCheckoutRequestScreenState
], ],
), ),
), ),
),
),
); );
}, },
); );
+10 -9
View File
@@ -635,9 +635,10 @@ class _MainDashboardState extends State<MainDashboard> {
: width < 700 : width < 700
? 3 ? 3
: 4; : 4;
// 📏 1칸(1x1) 크기가 대략 계정 프로필 카드만 해지도록 목표 크기를 잡고, // 📏 1칸(1x1) 크기 목표. 계정 프로필 카드 크기(184)보다 50% 더 키워서
// 화면이 그보다 넓으면 가운데로 모아서 여백을 준다(좁으면 화면 폭에 맞춤). // 타일 글자/아이콘이 더 잘 보이게 한다. 화면이 그보다 넓으면 가운데로
const double targetCellSize = 184; // 모아서 여백을 주고, 좁으면(폰) 화면 폭에 맞춘다.
const double targetCellSize = 276;
const double gap = 12; const double gap = 12;
final double idealGridWidth = final double idealGridWidth =
crossAxisCount * targetCellSize + (crossAxisCount - 1) * gap; crossAxisCount * targetCellSize + (crossAxisCount - 1) * gap;
@@ -787,13 +788,13 @@ class _MainDashboardState extends State<MainDashboard> {
: constraints.maxHeight : constraints.maxHeight
: constraints.maxWidth; : constraints.maxWidth;
final double scale = (referenceSize / 110).clamp(1.0, 3.4); final double scale = (referenceSize / 110).clamp(1.0, 3.4);
final double iconBoxPadding = 6 + 6 * (scale - 1); final double iconBoxPadding = 8 + 6 * (scale - 1);
final double iconSize = 16 + 10 * (scale - 1); final double iconSize = 22 + 10 * (scale - 1);
final double iconRadius = 10 + 6 * (scale - 1); final double iconRadius = 12 + 6 * (scale - 1);
final double cardPadding = 8 + 8 * (scale - 1); final double cardPadding = 10 + 8 * (scale - 1);
final double cardRadius = 16 + 6 * (scale - 1); final double cardRadius = 16 + 6 * (scale - 1);
final double titleFontSize = (10 + 3 * (scale - 1)).clamp(10, 18); final double titleFontSize = (12 + 3 * (scale - 1)).clamp(12, 20);
final double subtitleFontSize = (8 + 2 * (scale - 1)).clamp(8, 14); final double subtitleFontSize = (10 + 2 * (scale - 1)).clamp(10, 16);
return InkWell( return InkWell(
onTap: isLoading ? null : onTap, onTap: isLoading ? null : onTap,
+1 -9
View File
@@ -164,15 +164,7 @@ class _NfcPocketCheckInScreenState extends State<NfcPocketCheckInScreen> {
foregroundColor: AppPalette.ink, foregroundColor: AppPalette.ink,
elevation: 0, elevation: 0,
centerTitle: true, centerTitle: true,
title: const TitlePill( title: const TitlePill("자습실 NFC 출석체크"),
child: Text(
"자습실 NFC 출석체크",
style: TextStyle(
color: Colors.white,
fontWeight: FontWeight.bold,
),
),
),
), ),
body: Center( body: Center(
child: Padding( child: Padding(
+1 -6
View File
@@ -58,12 +58,7 @@ class _NfcTagWriterScreenState extends State<NfcTagWriterScreen> {
foregroundColor: AppPalette.ink, foregroundColor: AppPalette.ink,
elevation: 0, elevation: 0,
centerTitle: true, centerTitle: true,
title: const TitlePill( title: const TitlePill("NFC 주머니 태그 쓰기"),
child: Text(
"NFC 주머니 태그 쓰기",
style: TextStyle(color: Colors.white),
),
),
), ),
body: Padding( body: Padding(
padding: const EdgeInsets.all(24.0), padding: const EdgeInsets.all(24.0),
+3 -22
View File
@@ -5,6 +5,7 @@ import '../function/teacher_attendance_controller.dart';
import '../theme/app_palette.dart'; import '../theme/app_palette.dart';
import 'app_notice.dart'; import 'app_notice.dart';
import 'launchpad_transition.dart'; import 'launchpad_transition.dart';
import 'title_pill.dart';
// ----------------------------------------------------------------------------- // -----------------------------------------------------------------------------
// 📅 [서브 화면 1] 실시간 출석 확인 란 (StudentDashboard 카드 스타일 리스트화) // 📅 [서브 화면 1] 실시간 출석 확인 란 (StudentDashboard 카드 스타일 리스트화)
@@ -243,26 +244,6 @@ class _TeacherAttendancePageState extends State<TeacherAttendancePage> {
); );
} }
// 🪶 "실시간 출석 현황" 제목 알약. 사이드바/모바일 요약 바로 위에 둔다.
Widget _buildTitlePill() {
return Container(
padding: const EdgeInsets.symmetric(horizontal: 20, vertical: 10),
decoration: BoxDecoration(
color: AppPalette.ink,
borderRadius: BorderRadius.circular(999),
),
child: const Text(
'실시간 출석 현황',
textAlign: TextAlign.center,
style: TextStyle(
color: Colors.white,
fontWeight: FontWeight.bold,
fontSize: 15,
),
),
);
}
// ----------------------------------------------------------------------- // -----------------------------------------------------------------------
// 📱 모바일 레이아웃 (기존 카드 리스트) // 📱 모바일 레이아웃 (기존 카드 리스트)
// ----------------------------------------------------------------------- // -----------------------------------------------------------------------
@@ -271,7 +252,7 @@ class _TeacherAttendancePageState extends State<TeacherAttendancePage> {
return Column( return Column(
children: [ children: [
const SizedBox(height: 12), const SizedBox(height: 12),
_buildTitlePill(), const TitlePill('실시간 출석 현황'),
const SizedBox(height: 12), const SizedBox(height: 12),
Padding( Padding(
padding: const EdgeInsets.symmetric(horizontal: 16.0), padding: const EdgeInsets.symmetric(horizontal: 16.0),
@@ -554,7 +535,7 @@ class _TeacherAttendancePageState extends State<TeacherAttendancePage> {
child: Column( child: Column(
crossAxisAlignment: CrossAxisAlignment.stretch, crossAxisAlignment: CrossAxisAlignment.stretch,
children: [ children: [
Center(child: _buildTitlePill()), Center(child: const TitlePill('실시간 출석 현황')),
const SizedBox(height: 16), const SizedBox(height: 16),
_sidebarStatPill('전체 학생 수', total, 'ALL'), _sidebarStatPill('전체 학생 수', total, 'ALL'),
const SizedBox(height: 10), const SizedBox(height: 10),
+1 -3
View File
@@ -66,9 +66,7 @@ class _TeacherRegisterScreenState extends State<TeacherRegisterScreen> {
foregroundColor: AppPalette.ink, foregroundColor: AppPalette.ink,
elevation: 0, elevation: 0,
centerTitle: true, centerTitle: true,
title: const TitlePill( title: const TitlePill('교사 회원가입'),
child: Text('교사 회원가입', style: TextStyle(color: Colors.white)),
),
), ),
body: SingleChildScrollView( body: SingleChildScrollView(
padding: const EdgeInsets.all(24.0), padding: const EdgeInsets.all(24.0),
+1 -9
View File
@@ -663,15 +663,7 @@ class _TeacherStudentManagementPageState
foregroundColor: AppPalette.ink, foregroundColor: AppPalette.ink,
elevation: 0, elevation: 0,
centerTitle: true, centerTitle: true,
title: const TitlePill( title: const TitlePill('학생 통합 관리 센터'),
child: Text(
'학생 통합 관리 센터',
style: TextStyle(
fontWeight: FontWeight.bold,
color: Colors.white,
),
),
),
), ),
body: SingleChildScrollView( body: SingleChildScrollView(
padding: const EdgeInsets.all(24.0), padding: const EdgeInsets.all(24.0),
+16 -6
View File
@@ -1,22 +1,32 @@
// 🪶 검정 AppBar 대신 쓰는 둥근 제목 알약. 실시간 출석 현황 화면과 톤을 맞추되, // 🪶 검정 AppBar 대신 쓰는 둥근 제목 알약. 모든 화면이 똑같은 폰트/크기를 쓰고,
// 크기는 줄이지 않고 각 화면이 원래 쓰던 폰트 스타일을 그대로 넘겨받는다. // 화면 맨 위에 딱 붙어 보이지 않도록 위쪽에 살짝 여백을 둔다.
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import '../theme/app_palette.dart'; import '../theme/app_palette.dart';
class TitlePill extends StatelessWidget { class TitlePill extends StatelessWidget {
final Widget child; final String text;
const TitlePill({super.key, required this.child}); const TitlePill(this.text, {super.key});
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
return Container( return Padding(
padding: const EdgeInsets.only(top: 8),
child: Container(
padding: const EdgeInsets.symmetric(horizontal: 20, vertical: 10), padding: const EdgeInsets.symmetric(horizontal: 20, vertical: 10),
decoration: BoxDecoration( decoration: BoxDecoration(
color: AppPalette.ink, color: AppPalette.ink,
borderRadius: BorderRadius.circular(999), borderRadius: BorderRadius.circular(999),
), ),
child: child, child: Text(
text,
style: const TextStyle(
color: Colors.white,
fontWeight: FontWeight.bold,
fontSize: 15,
),
),
),
); );
} }
} }