M3-154 마이페이지 걸음수 Ui만들기

lib/controllers/my_page_controller.dart

@@ -1,28 +1,40 @@
 import 'package:get/get.dart';
 
 import '../models/user.dart';
+import '../models/user_pixel_count.dart';
 import '../service/user_service.dart';
 
 class MyPageController extends GetxController {
   final UserService userService = UserService();
   final Rx<User> currentUserInfo = User().obs;
+  final Rx<UserPixelCount> userPixelCount = UserPixelCount().obs;
 
   @override
   Future<void> onInit() async {
+    super.onInit();
     User userInfo = await userService.getCurrentUserInfo();
+    UserPixelCount userPixelLogInfo = await userService.getUserPixelCount();
     currentUserInfo.value = userInfo;
-    super.onInit();
+    userPixelCount.value = userPixelLogInfo;
   }
 
   getProfileImageURL() {
     return currentUserInfo.value.profileImageUrl;
   }
 
-  getCurrentUserNickname() {
-    return currentUserInfo.value.nickname;
+  String getCurrentUserNickname() {
+    return currentUserInfo.value.nickname ?? "-";
   }
 
-  getCurrentUserCommunityName() {
+  String getCurrentUserCommunityName() {
     return currentUserInfo.value.communityName ?? "-";
   }
+
+  int getCurrentUserPixel(){
+    return userPixelCount.value.currentPixelCount ?? 0;
+  }
+
+  int getAccumulateUserPixel(){
+    return userPixelCount.value.accumulatePixelCount ?? 0;
+  }
 }

lib/controllers/pixel_info_controller.dart

@@ -10,6 +10,7 @@ class PixelInfoController extends GetxController {
   getIndividualModePixelInfo(int pixelId) async {
     IndividualModePixelInfo individualModePixelInfo =
         await pixelService.getIndividualModePixelInfo(pixelId: pixelId);
+
     return individualModePixelInfo;
   }
 

lib/models/user_pixel_count.dart

@@ -0,0 +1,14 @@
+class UserPixelCount {
+  int? currentPixelCount;
+  int? accumulatePixelCount;
+
+  UserPixelCount({
+    this.currentPixelCount,
+    this.accumulatePixelCount,
+  });
+
+  UserPixelCount.fromJson(Map<String, dynamic> json){
+    currentPixelCount = json['currentPixelCount'];
+    accumulatePixelCount = json['accumulatePixelCount'];
+  }
+}

lib/screens/group_screen.dart

@@ -16,7 +16,7 @@ class GroupScreen extends StatelessWidget {
           children: [
             ElevatedButton(
               onPressed: () {
-                Get.to(()=> SearchGroupScreen());
+                Get.to(() => SearchGroupScreen());
               },
               child: const Text('그룹검색'),
             ),

lib/screens/my_page_screen.dart

@@ -1,30 +1,34 @@
 import 'package:flutter/material.dart';
 import 'package:get/get.dart';
 
+import '../controllers/my_page_controller.dart';
 import '../controllers/walking_controller.dart';
+import '../widgets/my_page/dash_board.dart';
 import '../widgets/my_page/step_bar_chart.dart';
+import '../widgets/my_page/today_goal_chart.dart';
 import '../widgets/my_page/user_info.dart';
 
 class MyPageScreen extends StatelessWidget {
   const MyPageScreen({super.key});
 
   @override
   Widget build(BuildContext context) {
-    final WalkingController walkController = Get.put(WalkingController());
+    Get.put(WalkingController());
+    Get.put(MyPageController());
 
     return Padding(
       padding: const EdgeInsets.all(8.0),
       child: Column(
         children: [
           UserInfo(),
-          const Text('마이페이지'),
-          Obx(() => Text(walkController.getCurrentStep())),
-          TextButton(
-            onPressed: () {
-              walkController.updateCurrentStep();
-            },
-            child: const Text('업데이트'),
+          Container(
+            height: 10,
           ),
+          DashBoard(),
+          SizedBox(
+            height: 10,
+          ),
+          TodayGoalChart(),
           StepBarChart(),
         ],
       ),

lib/screens/search_group_screen.dart

@@ -72,7 +72,8 @@ class SearchGroupScreen extends StatelessWidget {
                       itemBuilder: (context, index) {
                         return ListTile(
                           title: Text(
-                              groupSearchController.searchResult[index].name,),
+                            groupSearchController.searchResult[index].name,
+                          ),
                         );
                       },
                     );

lib/service/android_walking_service.dart

@@ -1,7 +1,6 @@
 import 'dart:async';
 import 'dart:isolate';
 
-import 'package:flutter/cupertino.dart';
 import 'package:flutter_foreground_task/flutter_foreground_task.dart';
 
 import '../utils/android_notification.dart';
@@ -51,7 +50,6 @@ class AndroidWalkingService implements WalkingService {
     _receivePort = newReceivePort;
     _receivePort?.listen((data) {
       currentSteps = data;
-      debugPrint('current walk: $data');
     });
 
     return _receivePort != null;

lib/service/pixel_service.dart

@@ -68,15 +68,14 @@ class PixelService {
     return IndividualModePixelInfo.fromJson(response.data['data']);
   }
 
-
   Future<IndividualHistoryPixelInfo> getIndividualHistoryPixelInfo({
     required int pixelId,
     required int userId,
   }) async {
     var response = await dio.get(
       '/pixels/individual-history/$pixelId',
       queryParameters: {
-        'user-id' : userId,
+        'user-id': userId,
       },
     );
 

lib/service/user_service.dart

@@ -1,6 +1,7 @@
 import 'package:dio/dio.dart';
 
 import '../models/user.dart';
+import '../models/user_pixel_count.dart';
 import '../utils/dio_service.dart';
 
 class UserService {
@@ -18,4 +19,12 @@ class UserService {
     var response = await dio.get('/users/$userId');
     return User.fromJson(response.data['data']);
   }
+
+  Future<UserPixelCount> getUserPixelCount() async {
+    var response = await dio.get(
+      '/pixels/count',
+      queryParameters: {"user-id": userId},
+    );
+    return UserPixelCount.fromJson(response.data['data']);
+  }
 }

lib/widgets/my_page/dash_board.dart

@@ -0,0 +1,50 @@
+import 'package:flutter/material.dart';
+import 'package:get/get.dart';
+
+import '../../controllers/my_page_controller.dart';
+import '../../controllers/walking_controller.dart';
+import 'dash_board_widget.dart';
+
+class DashBoard extends StatelessWidget {
+  DashBoard({
+    super.key,
+  });
+
+  final MyPageController myPageController = Get.find<MyPageController>();
+  final WalkingController walkingController = Get.find<WalkingController>();
+
+  @override
+  Widget build(BuildContext context) {
+    return Stack(
+      alignment: Alignment.center,
+      children: [
+        Container(
+          padding: const EdgeInsets.all(10.0),
+          height: 150,
+          decoration: BoxDecoration(
+            color: Color(0xFFD9D9D9),
+            borderRadius: BorderRadius.circular(10),
+          ),
+        ),
+        Row(
+          mainAxisAlignment: MainAxisAlignment.spaceEvenly,
+          children: [
+            DashBoardWidget(
+                textValue: "현재 픽셀수",
+                iconImageUrl: "currentTile.png",
+                countValue: myPageController.getCurrentUserPixel().obs,),
+            DashBoardWidget(
+                textValue: "누적 픽셀수",
+                iconImageUrl: "allTile.png",
+                countValue: myPageController.getAccumulateUserPixel().obs,),
+            DashBoardWidget(
+                textValue: "걸음수",
+                iconImageUrl: "stepIcon.png",
+                countValue: walkingController.currentStep,
+            ),
+          ],
+        ),
+      ],
+    );
+  }
+}

lib/widgets/my_page/dash_board_widget.dart

@@ -0,0 +1,45 @@
+import 'package:flutter/material.dart';
+import 'package:get/get.dart';
+
+import '../../controllers/my_page_controller.dart';
+import '../../controllers/walking_controller.dart';
+
+class DashBoardWidget extends StatelessWidget {
+  final String textValue;
+  final String iconImageUrl;
+  final RxInt countValue;
+
+  DashBoardWidget({
+    super.key,
+    required this.textValue,
+    required this.iconImageUrl,
+    required this.countValue,
+  });
+
+  final MyPageController myPageController = Get.find<MyPageController>();
+  final WalkingController walkingController = Get.find<WalkingController>();
+
+  @override
+  Widget build(BuildContext context) {
+    return Container(
+      width: 100,
+      height: 140,
+      decoration: BoxDecoration(
+        color: Colors.white,
+        borderRadius: BorderRadius.circular(10),
+      ),
+      child: Column(
+        mainAxisAlignment: MainAxisAlignment.center,
+        children: [
+          Text(textValue),
+          Image.asset(
+            'assets/$iconImageUrl',
+            width: 40,
+            height: 40,
+          ), // () => Text('$countValue'),
+          Obx(() =>Text('${countValue.value}')),
+        ],
+      ),
+    );
+  }
+}

lib/widgets/my_page/today_goal_chart.dart

@@ -0,0 +1,53 @@
+import 'package:flutter/material.dart';
+import 'package:get/get.dart';
+
+import '../../controllers/walking_controller.dart';
+
+class TodayGoalChart extends StatelessWidget {
+  const TodayGoalChart({super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    WalkingController walkingController = Get.put(WalkingController());
+    return Column(
+      children: [
+        Stack(
+          children: [
+            Container(
+              padding: const EdgeInsets.all(10.0),
+              height: 30,
+              decoration: BoxDecoration(
+                color: Colors.white,
+                borderRadius: BorderRadius.all(
+                  Radius.circular(8),
+                ),
+              ),
+            ),
+            Obx(
+              () => Container(
+                padding: const EdgeInsets.all(10.0),
+                height: 30,
+                width: walkingController.currentStep.value <= 10000
+                    ? (MediaQuery.of(context).size.width - 20) /
+                        10000 *
+                        walkingController.currentStep.value
+                    : 10000,
+                decoration: BoxDecoration(
+                  color: Colors.greenAccent,
+                  borderRadius: BorderRadius.all(
+                    Radius.circular(8),
+                  ),
+                ),
+              ),
+            ),
+          ],
+        ),
+        Obx(
+          () => Text(
+            '목표 걸음의 ${(walkingController.currentStep.value / 10000 * 100).toStringAsFixed(2)} % 달성!!',
+          ),
+        ),
+      ],
+    );
+  }
+}