Skip to content

feat: 홈화면 온도 그래프 구현 #51

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
taekoong merged 7 commits into from
Jul 21, 2025
Merged

feat: 홈화면 온도 그래프 구현 #51

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
5edbccb
feat: 온도그래프 화면으로 전환
taekoong Jul 20, 2025
90dbe65
feat: 온도그래프 화면으로 전환
taekoong Jul 21, 2025
a4b794c
feat: 온도그래프 화면으로 전환
taekoong Jul 21, 2025
97983e9
feat: 온도그래프 화면으로 전환
taekoong Jul 21, 2025
e927d5a
feat: 온도그래프 화면으로 전환
taekoong Jul 21, 2025
86e5b0f
feat: 온도그래프 화면 구현
taekoong Jul 21, 2025
371a714
feat: 온도그래프 화면 구현
taekoong Jul 21, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
22 changes: 11 additions & 11 deletions frontend/ongi/lib/main.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,17 +13,17 @@ void main() async {
WidgetsBinding widgetsBinding = WidgetsFlutterBinding.ensureInitialized();
FlutterNativeSplash.preserve(widgetsBinding: widgetsBinding);

await Firebase.initializeApp(options: DefaultFirebaseOptions.currentPlatform);
FirebaseMessaging messaging = FirebaseMessaging.instance;
messaging.requestPermission(
alert: true,
announcement: false,
badge: true,
carPlay: false,
criticalAlert: false,
provisional: false,
sound: true,
);
// await Firebase.initializeApp(options: DefaultFirebaseOptions.currentPlatform);
// FirebaseMessaging messaging = FirebaseMessaging.instance;
// messaging.requestPermission(
// alert: true,
// announcement: false,
// badge: true,
// carPlay: false,
// criticalAlert: false,
// provisional: false,
// sound: true,
// );

runApp(const OngiApp());
}
Expand Down
260 changes: 260 additions & 0 deletions frontend/ongi/lib/screens/home/home_degree_graph.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,260 @@
import 'package:flutter/material.dart';
import 'package:fl_chart/fl_chart.dart';
import 'package:ongi/core/app_colors.dart';
import 'package:ongi/core/app_light_background.dart';
import 'package:ongi/screens/home/home_ourfamily_text_withoutUser.dart';

final List<String> dates = ['6/11', '6/12', '6/13', '6/14', '6/15'];
final List<double> temps = [36.2, 35.8, 37.2, 38.0, 38.6];
final List<FlSpot> spots = List.generate(
temps.length,
(i) => FlSpot(i.toDouble(), temps[i]),
);
Comment on lines +7 to +12
Copy link

@coderabbitai coderabbitai bot Jul 21, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🛠️ Refactor suggestion

하드코딩된 데이터를 별도 데이터 소스로 분리해 주세요.

현재 온도 데이터와 히스토리가 하드코딩되어 있습니다. 실제 서비스에서는 API나 데이터베이스에서 가져와야 할 데이터입니다.

데이터 소스를 분리하는 것을 권장합니다:

// 예시: 데이터 모델과 서비스 분리
class TemperatureData {
  final List<String> dates;
  final List<double> temperatures;
  
  TemperatureData({required this.dates, required this.temperatures});
}

class TemperatureService {
  Future<TemperatureData> getTemperatureData() async {
    // API 호출 또는 로컬 데이터 조회
  }
}
🤖 Prompt for AI Agents 
In frontend/ongi/lib/screens/home/home_degree_graph.dart around lines 7 to 12,
the temperature and date data are hardcoded, which is not suitable for real
service usage. Refactor by creating a separate data model class to hold dates
and temperatures, and a service class that asynchronously fetches this data from
an API or database. Replace the hardcoded lists with calls to this service to
retrieve the data dynamically.


class HomeDegreeGraph extends StatefulWidget {
final VoidCallback? onBack;
const HomeDegreeGraph({super.key, this.onBack});

@override
State<HomeDegreeGraph> createState() => _HomeDegreeGraph();
}

class _HomeDegreeGraph extends State<HomeDegreeGraph> {
bool showHistory = false;

final List<Map<String, String>> history = [
{"name": "양금명님", "change": "+0.3°C", "date": "25.06.15 22:07"},
{"name": "양은명님", "change": "+0.1°C", "date": "25.06.14 20:55"},
{"name": "양관식님", "change": "+0.2°C", "date": "25.06.14 17:14"},
{"name": "양관식님", "change": "+0.2°C", "date": "25.06.13 17:14"},
{"name": "양관식님", "change": "+0.2°C", "date": "25.06.13 17:14"},
{"name": "양관식님", "change": "+0.1°C", "date": "25.06.13 17:14"},
{"name": "오애순님", "change": "+0.2°C", "date": "25.06.13 15:09"},
{"name": "오애순님", "change": "+0.2°C", "date": "25.06.13 15:08"},
{"name": "오애순님", "change": "+0.2°C", "date": "25.06.13 15:08"},
{"name": "오애순님", "change": "+0.1°C", "date": "25.06.13 15:07"},
{"name": "양금명님", "change": "+0.1°C", "date": "25.06.13 12:28"},
];
Comment on lines +25 to +37
Copy link

@coderabbitai coderabbitai bot Jul 21, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🛠️ Refactor suggestion

히스토리 데이터도 하드코딩 되어있습니다.

온도 변화 히스토리 데이터가 하드코딩되어 있어 실제 사용자 데이터를 반영할 수 없습니다.

🤖 Prompt for AI Agents 
In frontend/ongi/lib/screens/home/home_degree_graph.dart around lines 25 to 37,
the temperature change history data is hardcoded, preventing dynamic updates
with real user data. Replace the hardcoded list with a data structure that
fetches or receives this history from a backend service or a state management
solution, ensuring the UI reflects actual user temperature change history
dynamically.


@override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: AppColors.ongiLigntgrey,
body: AppLightBackground(
child: SafeArea(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
// 뒤로가기
GestureDetector(
onTap: widget.onBack ?? () => Navigator.of(context).pop(),
child: Padding(
padding: EdgeInsets.only(
left: 32,
top: MediaQuery.of(context).size.height * 0.08,
),
child: Icon(Icons.arrow_back_ios, color: Colors.black, size: 28),
),
),
// 타이틀
const HomeOngiTextWithoutUser(),
// 카드
Padding(
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
child: Container(
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(24),
),
padding: const EdgeInsets.all(20),
child: showHistory
? _buildHistoryList()
: _buildGraphCard(),
),
),
],
),
),
),
);
}

Widget _buildGraphCard() {
String latestName = '';
String latestChange = '';
if (history.isNotEmpty) {
latestName = history[0]['name'] ?? '';
latestChange = history[0]['change'] ?? '';
}
return Column(
mainAxisSize: MainAxisSize.min,
children: [
SizedBox(
height: 270,
child: LineChart(
LineChartData(
minY: 35.2,
maxY: 40.5,
minX: 0,
maxX: (dates.length - 1).toDouble(),
gridData: FlGridData(
show: true,
drawVerticalLine: false,
horizontalInterval: 0.5,
getDrawingHorizontalLine: (value) => FlLine(
color: Colors.grey[300],
strokeWidth: 1,
),
),
titlesData: FlTitlesData(
leftTitles: AxisTitles(
sideTitles: SideTitles(
showTitles: true,
interval: 0.5,
getTitlesWidget: (value, meta) {
if (value == 35.2 || value == 40.5) return const SizedBox.shrink();
return Text(
value.toStringAsFixed(1),
style: const TextStyle(
color: Colors.grey,
fontSize: 13,
fontFamily: 'Pretendard',
),
);
},
reservedSize: 36,
),
),
bottomTitles: AxisTitles(
sideTitles: SideTitles(
showTitles: true,
getTitlesWidget: (value, meta) {
if (value % 1 != 0) return const SizedBox.shrink();
int idx = value.toInt();
if (idx < 0 || idx >= dates.length) return const SizedBox.shrink();
return Padding(
padding: const EdgeInsets.only(top: 8),
child: Text(
dates[idx],
style: const TextStyle(
color: Colors.grey,
fontSize: 13,
fontFamily: 'Pretendard',
),
),
);
},
interval: 1,
),
),
rightTitles: AxisTitles(sideTitles: SideTitles(showTitles: false)),
topTitles: AxisTitles(sideTitles: SideTitles(showTitles: false)),
),
borderData: FlBorderData(
show: false,
),
lineBarsData: [
LineChartBarData(
spots: spots,
isCurved: false,
color: Colors.orange,
barWidth: 2.5,
isStrokeCapRound: true,
dotData: FlDotData(
show: true,
getDotPainter: (spot, percent, bar, index) => FlDotCirclePainter(
radius: 3,
color: Colors.white,
strokeWidth: 2.5,
strokeColor: Colors.orange,
),
),
),
],
),
),
),
const SizedBox(height: 12),
Text(
latestName.isNotEmpty && latestChange.isNotEmpty
? '최근 $latestName 님이 $latestChange 상승 시켰어요!'
: '최근 온도 변화 데이터가 없습니다.',
style: const TextStyle(
fontSize: 15,
color: Colors.grey,
fontFamily: 'Pretendard',
),
),
IconButton(
icon: const Icon(Icons.keyboard_arrow_down, color: Colors.grey),
onPressed: () => setState(() => showHistory = true),
),
],
);
}

Widget _buildHistoryList() {
return Column(
mainAxisSize: MainAxisSize.min,
children: [
IconButton(
icon: const Icon(Icons.keyboard_arrow_up, color: Colors.grey),
onPressed: () => setState(() => showHistory = false),
),
SizedBox(
height: 290,
child: ListView.builder(
itemCount: history.length,
itemBuilder: (context, idx) {
final item = history[idx];
return Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
// 왼쪽 선과 원
Column(
children: [
Container(
width: 9,
height: 9,
decoration: BoxDecoration(
shape: BoxShape.circle,
border: Border.all(color: Colors.orange, width: 2),
color: Colors.white,
),
),
if (idx != history.length - 1)
Container(
width: 2,
height: 24,
color: Colors.orange,
),
],
),
const SizedBox(width: 8),
Expanded(
child: Text(
"${item['name']}이 ${item['change']} 상승 시켰어요!",
style: const TextStyle(
color: Colors.grey,
fontSize: 15,
fontFamily: 'Pretendard',
),
),
),
Text(
item['date'] ?? '',
style: const TextStyle(
color: Colors.grey,
fontSize: 12,
fontFamily: 'Pretendard',
),
),
],
);
},
),
),
],
);
}
}
Loading
Loading