vvip/smarthelmet_app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

1. 이미지 및 UI 개선

Browse Source 
2. UI 텍스트 한국어 번역
3. 환경설정 화면 상세 구현 (SettingScreen)
This commit is contained in:
KIMGYEONGRAN
2025-12-02 17:47:22 +09:00
parent acb297fec1
commit 0dea41c143
9 changed files with 995 additions and 436 deletions
Download Patch File Download Diff File Expand all files Collapse all files

249
lib/history_screen.dart
View File

@@ -32,16 +32,14 @@ class HistoryScreen extends StatefulWidget {
}
class _HistoryScreenState extends State<HistoryScreen> {
// 🟦 최종 확정 테마 컬러 정의 (대비 구조 교체)
final Color _mainBlueColor = const Color(0xFF002FA7); // 진한 블루 (0xFF002FA7 -> 0xFF0A68FF로 통일)
final Color _mainTextColor = const Color(0xFF1C1C1E); // 어두운 텍스트
final Color _subTextColor = const Color(0xFF6A717B); // 보조 텍스트
final Color _pageBackgroundColor = const Color(0xFFF5F7F9); // 🚩 Scaffold 배경 (연한 그레이)
final Color _cardBackgroundColor = Colors.white; // 🚩 카드 배경 (순수 화이트)
final Color _accentContainerColor = const Color(0xFFF0F2F5); // 🚩 내부 상세 박스 배경 (중간 그레이)
final Color _mainBlueColor = const Color(0xFF002FA7);
final Color _mainTextColor = const Color(0xFF1C1C1E);
final Color _subTextColor = const Color(0xFF6A717B);
final Color _pageBackgroundColor = const Color(0xFFF5F7F9);
final Color _cardBackgroundColor = Colors.white;
final Color _accentContainerColor = const Color(0xFFF0F2F5);
final Color _borderColor = const Color(0xFF0A68FF).withOpacity(0.8);
// 🚩 그림자 스타일 정의
static const BoxShadow _cleanShadow = BoxShadow(
color: Color.fromRGBO(0, 0, 0, 0.07),
blurRadius: 8,
@@ -53,45 +51,45 @@ class _HistoryScreenState extends State<HistoryScreen> {
final List<UsageHistory> _allHistoryList = [
UsageHistory(
date: '2025.11.25 (화)', // 🇰🇷 요일 변경
date: '2025.11.25 (화)',
startTime: '18:30',
endTime: '19:15',
duration: 45,
startStation: 'STATION A - GU.UNIV',
endStation: 'STATION B - CITY HALL',
startStation: '스테이션 A - 광주대',
endStation: '스테이션 B - 시청',
status: 'RETURNED',
isSanitized: true,
isDried: true,
),
UsageHistory(
date: '2025.11.23 (일)', // 🇰🇷 요일 변경
date: '2025.11.23 (일)',
startTime: '14:00',
endTime: '15:30',
duration: 90,
startStation: 'STATION B - CITY HALL',
endStation: 'STATION B - CITY HALL',
startStation: '스테이션 B - 시청',
endStation: '스테이션 B - 시청',
status: 'RETURNED',
isSanitized: true,
isDried: false,
),
UsageHistory(
date: '2025.11.06 (목)', // 🇰🇷 요일 변경
date: '2025.11.06 (목)',
startTime: '09:00',
endTime: '09:30',
duration: 30,
startStation: 'STATION A - GU.UNIV',
endStation: 'STATION C - PARK',
startStation: '스테이션 A - 광주대',
endStation: '스테이션 C - 시민공원',
status: 'RETURNED',
isSanitized: true,
isDried: true,
),
UsageHistory(
date: '2025.09.20 (토)', // 🇰🇷 요일 변경
date: '2025.09.20 (토)',
startTime: '20:00',
endTime: '21:00',
duration: 60,
startStation: 'STATION C - PARK',
endStation: 'STATION B - CITY HALL',
startStation: '스테이션 C - 시민공원',
endStation: '스테이션 B - 시청',
status: 'RETURNED',
isSanitized: true,
isDried: true,
@@ -109,14 +107,9 @@ class _HistoryScreenState extends State<HistoryScreen> {
String dateStr = history.date.split(' ')[0];
List<String> parts = dateStr.split('.');
DateTime historyDate = DateTime(
int.parse(parts[0]),
int.parse(parts[1]),
int.parse(parts[2])
);
int.parse(parts[0]), int.parse(parts[1]), int.parse(parts[2]));
int difference = now
.difference(historyDate)
.inDays;
int difference = now.difference(historyDate).inDays;
if (_selectedFilterIndex == 1) {
return difference <= 7;
@@ -134,16 +127,16 @@ class _HistoryScreenState extends State<HistoryScreen> {
return Scaffold(
backgroundColor: _pageBackgroundColor,
appBar: AppBar(
title: Text('나의 기록', style: TextStyle(fontWeight: FontWeight
.bold, fontSize: 18, letterSpacing: 0.5, color: _mainTextColor)),
title: Text('나의 기록',
style: TextStyle(
fontWeight: FontWeight.bold,
fontSize: 18,
letterSpacing: 0.5,
color: _mainTextColor)),
backgroundColor: _pageBackgroundColor,
scrolledUnderElevation: 0,
elevation: 0,
centerTitle: false,
actions: [
IconButton(icon: Icon(Icons.filter_list, color: _mainTextColor),
onPressed: () {}),
],
),
body: Column(
children: [
@@ -151,7 +144,8 @@ class _HistoryScreenState extends State<HistoryScreen> {
Expanded(
child: currentList.isEmpty
? Center(
child: Text("기록이 없습니다.", style: TextStyle(color: _subTextColor)))
child: Text("기록이 없습니다.",
style: TextStyle(color: _subTextColor)))
: ListView.builder(
padding: const EdgeInsets.all(16),
itemCount: currentList.length,
@@ -159,7 +153,8 @@ class _HistoryScreenState extends State<HistoryScreen> {
final history = currentList[index];
bool showHeader = true;
if (index > 0 && currentList[index - 1].date == history.date) {
if (index > 0 &&
currentList[index - 1].date == history.date) {
showHeader = false;
}
@@ -216,10 +211,7 @@ class _HistoryScreenState extends State<HistoryScreen> {
child: Text(
date,
style: TextStyle(
color: _mainTextColor,
fontSize: 14,
fontWeight: FontWeight.bold
),
color: _mainTextColor, fontSize: 14, fontWeight: FontWeight.bold),
),
);
}
@@ -230,8 +222,7 @@ class _HistoryScreenState extends State<HistoryScreen> {
decoration: BoxDecoration(
color: _cardBackgroundColor,
borderRadius: BorderRadius.circular(8),
boxShadow: [_cleanShadow]
),
boxShadow: [_cleanShadow]),
child: InkWell(
onTap: () => _showHistoryDetail(context, history),
borderRadius: BorderRadius.circular(8),
@@ -244,20 +235,22 @@ class _HistoryScreenState extends State<HistoryScreen> {
children: [
Text(
'${history.startTime} - ${history.endTime}',
style: TextStyle(color: _mainTextColor,
style: TextStyle(
color: _mainTextColor,
fontSize: 16,
fontWeight: FontWeight.bold),
),
Container(
padding: const EdgeInsets.symmetric(
horizontal: 8, vertical: 4),
padding:
const EdgeInsets.symmetric(horizontal: 8, vertical: 4),
decoration: BoxDecoration(
color: _mainBlueColor,
borderRadius: BorderRadius.circular(8),
),
child: Text(
'${history.duration}분', // 🇰🇷 min -> 분
style: const TextStyle(color: Colors.white,
'${history.duration}분',
style: const TextStyle(
color: Colors.white,
fontSize: 14,
fontWeight: FontWeight.w600),
),
@@ -269,9 +262,10 @@ class _HistoryScreenState extends State<HistoryScreen> {
children: [
_buildDot(_subTextColor),
const SizedBox(width: 8),
Expanded(child: Text(history.startStation,
style: TextStyle(color: _mainTextColor, fontSize: 13),
overflow: TextOverflow.ellipsis)),
Expanded(
child: Text(history.startStation,
style: TextStyle(color: _mainTextColor, fontSize: 13),
overflow: TextOverflow.ellipsis)),
],
),
Container(
@@ -279,40 +273,45 @@ class _HistoryScreenState extends State<HistoryScreen> {
height: 10,
decoration: BoxDecoration(
border: Border(
left: BorderSide(color: _subTextColor.withOpacity(0.5), width: 1)),
left: BorderSide(
color: _subTextColor.withOpacity(0.5), width: 1)),
),
),
Row(
children: [
_buildDot(_mainBlueColor),
const SizedBox(width: 8),
Expanded(child: Text(history.endStation,
style: TextStyle(color: _mainTextColor, fontSize: 13),
overflow: TextOverflow.ellipsis)),
Expanded(
child: Text(history.endStation,
style: TextStyle(color: _mainTextColor, fontSize: 13),
overflow: TextOverflow.ellipsis)),
],
),
const SizedBox(height: 12),
Divider(color: _subTextColor.withOpacity(0.5), thickness: 0.5,),
Divider(
color: _subTextColor.withOpacity(0.5),
thickness: 0.5,
),
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Row(
children: [
if (history.isSanitized)
_buildDot(_mainBlueColor),
if (history.isSanitized)
const SizedBox(width: 8),
if (history.isSanitized) _buildDot(_mainBlueColor),
if (history.isSanitized) const SizedBox(width: 8),
Text(
history.isSanitized ? "살균 완료" : "진행 중", // 🇰🇷 Pending -> 진행 중
history.isSanitized ? "살균 완료" : "진행 중",
style: TextStyle(
color: history.isSanitized ? _mainTextColor : _subTextColor,
color: history.isSanitized
? _mainTextColor
: _subTextColor,
fontSize: 14,
fontWeight: FontWeight.bold),
),
],
),
Text(
"상세 보기 >", // 🇰🇷 VIEW DETAILS > -> 상세 보기 >
"더보기 >",
style: TextStyle(color: _subTextColor, fontSize: 11),
),
],
@@ -325,7 +324,8 @@ class _HistoryScreenState extends State<HistoryScreen> {
}
Widget _buildDot(Color color) {
return Container(width: 8,
return Container(
width: 8,
height: 8,
decoration: BoxDecoration(color: color, shape: BoxShape.circle));
}
@@ -338,21 +338,20 @@ class _HistoryScreenState extends State<HistoryScreen> {
isScrollControlled: true,
builder: (context) {
return Container(
height: MediaQuery
.of(context)
.size
.height * 0.75,
height: MediaQuery.of(context).size.height * 0.75,
decoration: BoxDecoration(
color: _cardBackgroundColor,
borderRadius: const BorderRadius.vertical(top: Radius.circular(12)),
boxShadow: [_cleanShadow]
),
borderRadius:
const BorderRadius.vertical(top: Radius.circular(12)),
boxShadow: [_cleanShadow]),
child: Column(
children: [
const SizedBox(height: 12),
Container(width: 40,
Container(
width: 40,
height: 4,
decoration: BoxDecoration(color: _subTextColor,
decoration: BoxDecoration(
color: _subTextColor,
borderRadius: BorderRadius.circular(2))),
Expanded(
child: SingleChildScrollView(
@@ -360,10 +359,11 @@ class _HistoryScreenState extends State<HistoryScreen> {
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text("이용 상세 정보", style: TextStyle( // 🇰🇷 HISTORY DETAILS
color: _mainTextColor,
fontSize: 20,
fontWeight: FontWeight.bold)),
Text("이용 상세 정보",
style: TextStyle(
color: _mainTextColor,
fontSize: 20,
fontWeight: FontWeight.bold)),
const SizedBox(height: 8),
Text(
history.date,
@@ -372,7 +372,8 @@ class _HistoryScreenState extends State<HistoryScreen> {
const SizedBox(height: 30),
Container(
padding: const EdgeInsets.all(20),
decoration: BoxDecoration(color: _accentContainerColor,
decoration: BoxDecoration(
color: _accentContainerColor,
borderRadius: BorderRadius.circular(8)),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
@@ -380,38 +381,45 @@ class _HistoryScreenState extends State<HistoryScreen> {
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text("이용 시간", style: TextStyle( // 🇰🇷 이용 시간
color: _subTextColor, fontSize: 12)),
Text("이용 시간",
style: TextStyle(
color: _subTextColor, fontSize: 12)),
const SizedBox(height: 4),
Text("${history.duration}분", // 🇰🇷 min -> 분
style: TextStyle(color: _mainTextColor,
Text("${history.duration}분",
style: TextStyle(
color: _mainTextColor,
fontSize: 24,
fontWeight: FontWeight.bold)),
],
),
Container(
width: 1, height: 40, color: _subTextColor.withOpacity(0.5)),
width: 1,
height: 40,
color: _subTextColor.withOpacity(0.5)),
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text("이용 금액", style: TextStyle( // 🇰🇷 이용 금액
color: _subTextColor, fontSize: 12)),
Text("이용 금액",
style: TextStyle(
color: _subTextColor, fontSize: 12)),
const SizedBox(height: 4),
Text("₩ $cost", style: TextStyle( // 🇰🇷 ₩ 위치 수정
color: _mainTextColor,
fontSize: 24,
fontWeight: FontWeight.bold)),
Text("₩ $cost",
style: TextStyle(
color: _mainTextColor,
fontSize: 24,
fontWeight: FontWeight.bold)),
],
),
],
),
),
const SizedBox(height: 30),
Text("시간별 기록", style: TextStyle( // 🇰🇷 TIMELINE
color: _mainTextColor,
fontSize: 16,
fontWeight: FontWeight.bold,
letterSpacing: 1.0)),
Text("시간별 기록",
style: TextStyle(
color: _mainTextColor,
fontSize: 16,
fontWeight: FontWeight.bold,
letterSpacing: 1.0)),
const SizedBox(height: 20),
_buildTimelineItem(
history.startTime, "대여 시작", history.startStation,
@@ -420,26 +428,27 @@ class _HistoryScreenState extends State<HistoryScreen> {
history.endTime, "반납 완료", history.endStation,
isCompleted: true),
_buildTimelineItem(
history.endTime, "살균 시작", "자동 살균 시스템", // 🇰🇷 Auto-Cleaning System
history.endTime, "살균 시작", "자동 살균 시스템",
isCompleted: true),
_buildTimelineItem(
"15분 후", "살균 완료", "다음 사용자 준비 완료", // 🇰🇷 15 min later, Ready for next user
"15분 후", "살균 완료", "다음 사용자 준비 완료",
isLast: true, isCompleted: history.isSanitized),
const SizedBox(height: 30),
Text("살균/건조 상태", style: TextStyle( // 🇰🇷 CONDITION
color: _mainTextColor,
fontSize: 16,
fontWeight: FontWeight.bold)),
Text("살균/건조 상태",
style: TextStyle(
color: _mainTextColor,
fontSize: 16,
fontWeight: FontWeight.bold)),
const SizedBox(height: 8),
Row(
children: [
Expanded(child: _buildConditionCard(
"살균", history.isSanitized,
Icons.sentiment_satisfied_alt)),
Expanded(
child: _buildConditionCard("살균",
history.isSanitized, Icons.sentiment_satisfied_alt)),
const SizedBox(width: 12),
Expanded(child: _buildConditionCard(
"건조", history.isDried,
Icons.sentiment_very_satisfied)),
Expanded(
child: _buildConditionCard("건조", history.isDried,
Icons.sentiment_very_satisfied)),
],
),
],
@@ -455,7 +464,6 @@ class _HistoryScreenState extends State<HistoryScreen> {
Widget _buildTimelineItem(String time, String title, String subtitle,
{bool isFirst = false, bool isLast = false, bool isCompleted = false}) {
// 🇰🇷 15 min later -> 15분 후 로직 처리
String displayTime = time.contains("min later") ? "15분 후" : time;
return Row(
@@ -463,16 +471,18 @@ class _HistoryScreenState extends State<HistoryScreen> {
children: [
SizedBox(
width: 60,
child: Text(
displayTime, style: TextStyle(color: _mainTextColor, fontSize: 12)),
child: Text(displayTime,
style: TextStyle(color: _mainTextColor, fontSize: 12)),
),
Column(
children: [
Icon(
isCompleted ? Icons.check_circle : Icons.radio_button_unchecked,
color: isCompleted ? _mainBlueColor : _subTextColor, size: 20),
color: isCompleted ? _mainBlueColor : _subTextColor,
size: 20),
if (!isLast)
Container(width: 2,
Container(
width: 2,
height: 40,
color: isCompleted
? _mainBlueColor.withOpacity(0.5)
@@ -484,10 +494,11 @@ class _HistoryScreenState extends State<HistoryScreen> {
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(title, style: TextStyle(
color: isCompleted ? _mainTextColor : _subTextColor,
fontWeight: FontWeight.bold,
fontSize: 14)),
Text(title,
style: TextStyle(
color: isCompleted ? _mainTextColor : _subTextColor,
fontWeight: FontWeight.bold,
fontSize: 14)),
const SizedBox(height: 4),
Text(subtitle,
style: TextStyle(color: _subTextColor, fontSize: 12)),
@@ -505,10 +516,13 @@ class _HistoryScreenState extends State<HistoryScreen> {
width: double.infinity,
padding: const EdgeInsets.all(16),
decoration: BoxDecoration(
color: _accentContainerColor, // 내부 상세 박스 배경 (중간 그레이)
color: _accentContainerColor,
boxShadow: isDone ? [_cleanShadow] : null,
border: Border.all(
color: isDone ? _mainBlueColor.withOpacity(0.9) : _subTextColor.withOpacity(0.3), width: 1.0),
color: isDone
? _mainBlueColor.withOpacity(0.9)
: _subTextColor.withOpacity(0.3),
width: 1.0),
borderRadius: BorderRadius.circular(8),
),
child: Column(
@@ -526,12 +540,11 @@ class _HistoryScreenState extends State<HistoryScreen> {
),
const SizedBox(height: 4),
Text(
isDone ? "완료됨" : "진행 중", // 🇰🇷 Completed/In Progress
isDone ? "완료됨" : "진행 중",
style: TextStyle(
color: _subTextColor,
fontWeight: FontWeight.bold,
fontSize: 14
),
fontSize: 14),
),
],
),