Merge pull request #134 from DeveloperAcademy-POSTECH/feat/#131

[#131] - 앱 아이콘에 마우스호버할 경우 앱 이름 나오게 구현
DeveloperAcademy-POSTECH · Dec 2, 2024 · abba4f2 · abba4f2
2 parents bd8249f + d92874b
commit abba4f2
Show file tree

Hide file tree

Showing 2 changed files with 57 additions and 10 deletions.
diff --git a/AsyncC/Source/Presentation/MainStatusView/Components/AppIconBoxContentView.swift b/AsyncC/Source/Presentation/MainStatusView/Components/AppIconBoxContentView.swift
@@ -17,17 +17,63 @@ struct AppIconBoxContentView: View {
                 if viewModel.trackingActive[userID] ?? true || viewModel.checkUser(key: key) {
                     ForEach(viewModel.appTrackings[key] ?? [], id: \.self) { appName in
                         if let nsImage = NSImage(named: appName) {
-                            Image(nsImage: nsImage)
-                                .resizable()
-                                .scaledToFit()
-                                .frame(width: 36, height: 36)
-                                .opacity(viewModel.getOpacity(appName: appName, apps: viewModel.appTrackings[key] ?? []))
+                            ZStack {
+                                Image(nsImage: nsImage)
+                                    .resizable()
+                                    .scaledToFit()
+                                    .frame(width: 36, height: 36)
+                                    .opacity(viewModel.getOpacity(appName: appName, apps: viewModel.appTrackings[key] ?? []))
+                                    .onHover { hovering in
+                                        viewModel.isAppIconHover = hovering
+                                    }
+                                if viewModel.isAppIconHover {
+                                    Text("\(appName)")
+                                        .font(.system(size: 9, weight: .medium))
+                                        .foregroundStyle(.black)
+                                        .frame(width: 36, height: 36)
+                                        .allowsHitTesting(!viewModel.isAppIconHover)
+                                        .lineLimit(1)
+                                        .minimumScaleFactor(0.5)
+                                        .offset(x: 0.5, y: -12.5)
+                                    Text("\(appName)")
+                                        .font(.system(size: 9, weight: .medium))
+                                        .foregroundStyle(.white)
+                                        .frame(width: 36, height: 36)
+                                        .allowsHitTesting(!viewModel.isAppIconHover)
+                                        .lineLimit(1)
+                                        .minimumScaleFactor(0.5)
+                                        .offset(y: -13)
+                                }
+                            }
                         } else {
-                            Image("etc")
-                                .resizable()
-                                .scaledToFit()
-                                .frame(width: 36, height: 36)
-                                .opacity(viewModel.getOpacity(appName: appName, apps: viewModel.appTrackings[key] ?? []))
+                            ZStack {
+                                Image("etc")
+                                    .resizable()
+                                    .scaledToFit()
+                                    .frame(width: 36, height: 36)
+                                    .opacity(viewModel.getOpacity(appName: appName, apps: viewModel.appTrackings[key] ?? []))
+                                    .onHover { hovering in
+                                        viewModel.isAppIconHover = hovering
+                                    }
+                                if viewModel.isAppIconHover {
+                                    Text("\(appName)")
+                                        .font(.system(size: 9, weight: .medium))
+                                        .foregroundStyle(.black)
+                                        .frame(width: 36, height: 36)
+                                        .allowsHitTesting(!viewModel.isAppIconHover)
+                                        .lineLimit(1)
+                                        .minimumScaleFactor(0.5)
+                                        .offset(x: 0.5, y: -12.5)
+                                    Text("\(appName)")
+                                        .font(.system(size: 9, weight: .medium))
+                                        .foregroundStyle(.white)
+                                        .frame(width: 36, height: 36)
+                                        .allowsHitTesting(!viewModel.isAppIconHover)
+                                        .lineLimit(1)
+                                        .minimumScaleFactor(0.5)
+                                        .offset(y: -13)
+                                }
+                            }
                         }
                     }
                 } else {

diff --git a/AsyncC/Source/Presentation/MainStatusView/MainStatusViewModel.swift b/AsyncC/Source/Presentation/MainStatusView/MainStatusViewModel.swift
@@ -45,6 +45,7 @@ class MainStatusViewModel: ObservableObject {
     @Published var userNameAndID: [String: String] = [:] // [userName: userID]
     @Published var isSelectedButton: Bool = false
     @Published var buttonStates: [String: Bool] = [:]
+    @Published var isAppIconHover: Bool = false
 
     init(teamManagingUseCase: TeamManagingUseCase, appTrackingUseCase: AppTrackingUseCase, syncUseCase: SyncUseCase, accountUseCase: AccountManagingUseCase) {
         self.teamManagingUseCase = teamManagingUseCase