라이브 방

- 스피커 수가 증가함에 따라 UI가 화면에서 넘치던 버그 수정

SodaLive/Sources/Live/Room/V2/Component/View/LiveRoomInfoCreatorView.swift

@@ -67,6 +67,7 @@ struct LiveRoomInfoCreatorView: View {
                     Text(creatorNickname)
                         .font(.custom(Font.medium.rawValue, size: 12))
                         .foregroundColor(.gray77)
+                        .lineLimit(1)
                     
                     if isShowFollowingButton {
                         Image(isFollowing ? "btn_following" : "btn_follow")
@@ -75,8 +76,8 @@ struct LiveRoomInfoCreatorView: View {
                 }
             }
         }
-        .padding(.vertical, 8)
+        .padding(8)
-        .padding(.horizontal, 5.3)
+        .frame(width: screenSize().width / 2.5, alignment: .leading)
         .overlay(
             RoundedRectangle(cornerRadius: 5.3)
                 .stroke(Color.graybb, lineWidth: 1)
@@ -87,7 +88,7 @@ struct LiveRoomInfoCreatorView: View {
 struct LiveRoomInfoCreatorView_Previews: PreviewProvider {
     static var previews: some View {
         LiveRoomInfoCreatorView(
-            roomTitle: "오늘 라이브방송은 OOO 입니다.",
+            roomTitle: "qwer",
             creatorNickname: "도화",
             creatorProfileUrl: "https://cf.sodalive.net/profile/26/26-profile-ddf78b4d-0300-4c50-9c84-5d8a95fd5fe2-4892-1705256364320",
             isMute: false,

SodaLive/Sources/Live/Room/V2/Component/View/LiveRoomInfoGuestView.swift

@@ -108,10 +108,11 @@ struct LiveRoomInfoGuestView: View {
                         onClickFollow: { onClickFollow(isFollowing) },
                         onClickProfile: { onClickProfile(creatorId) }
                     )
-                    .frame(width: 180, alignment: .leading)
                     
                     Spacer()
                     
+                    ScrollView(.horizontal, showsIndicators: false) {
+                        HStack(spacing: 8) {
                             ForEach(0..<speakerList.count, id: \.self) { index in
                                 let speaker = speakerList[index]
                                 
@@ -126,6 +127,10 @@ struct LiveRoomInfoGuestView: View {
                                 }
                             }
                         }
+                        .rotationEffect(Angle(degrees: 180))
+                    }
+                    .rotationEffect(Angle(degrees: 180))
+                }
                 
                 HStack(spacing: 5.3) {
                     LiveRoomOverlayStrokeTextToggleButton(
@@ -184,13 +189,19 @@ struct LiveRoomInfoGuestView: View {
         .padding(.horizontal, 13.3)
         .padding(.top, 16)
         .background(Color.gray22)
+        .onAppear {
+            UIScrollView.appearance().bounces = false
+        }
+        .onDisappear {
+            UIScrollView.appearance().bounces = true
+        }
     }
 }
 
 struct LiveRoomInfoGuestView_Previews: PreviewProvider {
     static var previews: some View {
         LiveRoomInfoGuestView(
-            title: "오늘의 라이브방송은 OOO입니다.",
+            title: "qwer",
             totalDonationCan: 123456,
             isOnBg: true,
             isOnNotice: false,
@@ -218,25 +229,7 @@ struct LiveRoomInfoGuestView_Previews: PreviewProvider {
                     nickname: "LUNA",
                     profileImage: "https://cf.sodalive.net/profile/4679/4679-profile-41e83399-234e-4541-8591-f961a025cfaa-5819-1699536915310",
                     role: .SPEAKER
-                ),
+                )
-                LiveRoomMember(
-                    id: 4,
-                    nickname: "도화",
-                    profileImage: "https://cf.sodalive.net/profile/26/26-profile-ddf78b4d-0300-4c50-9c84-5d8a95fd5fe2-4892-1705256364320",
-                    role: .SPEAKER
-                ),
-                LiveRoomMember(
-                    id: 5,
-                    nickname: "도화",
-                    profileImage: "https://cf.sodalive.net/profile/26/26-profile-ddf78b4d-0300-4c50-9c84-5d8a95fd5fe2-4892-1705256364320",
-                    role: .SPEAKER
-                ),
-                LiveRoomMember(
-                    id: 6,
-                    nickname: "도화",
-                    profileImage: "https://cf.sodalive.net/profile/26/26-profile-ddf78b4d-0300-4c50-9c84-5d8a95fd5fe2-4892-1705256364320",
-                    role: .SPEAKER
-                ),
             ],
             muteSpeakerList: [],
             activeSpeakerList: [],

SodaLive/Sources/Live/Room/V2/Component/View/LiveRoomInfoHostView.swift

@@ -106,10 +106,11 @@ struct LiveRoomInfoHostView: View {
                         onClickFollow: {},
                         onClickProfile: {}
                     )
-                    .frame(width: 180, alignment: .leading)
                     
                     Spacer()
                     
+                    ScrollView(.horizontal, showsIndicators: false) {
+                        HStack(spacing: 8) {
                             ForEach(0..<speakerList.count, id: \.self) { index in
                                 let speaker = speakerList[index]
                                 
@@ -124,6 +125,10 @@ struct LiveRoomInfoHostView: View {
                                 }
                             }
                         }
+                        .rotationEffect(Angle(degrees: 180))
+                    }
+                    .rotationEffect(Angle(degrees: 180))
+                }
                 
                 HStack(spacing: 5.3) {
                     LiveRoomOverlayStrokeTextToggleButton(
@@ -199,6 +204,12 @@ struct LiveRoomInfoHostView: View {
         .padding(.horizontal, 13.3)
         .padding(.top, 16)
         .background(Color.gray22)
+        .onAppear {
+            UIScrollView.appearance().bounces = false
+        }
+        .onDisappear {
+            UIScrollView.appearance().bounces = true
+        }
     }
 }
 
@@ -228,31 +239,7 @@ struct LiveRoomInfoHostView_Previews: PreviewProvider {
                     nickname: "청령",
                     profileImage: "https://cf.sodalive.net/profile/13/13-profile-fabb75e0-2870-4d99-900e-1d9aa63e605b-685-1704859996417",
                     role: .SPEAKER
-                ),
+                )
-                LiveRoomMember(
-                    id: 3,
-                    nickname: "LUNA",
-                    profileImage: "https://cf.sodalive.net/profile/4679/4679-profile-41e83399-234e-4541-8591-f961a025cfaa-5819-1699536915310",
-                    role: .SPEAKER
-                ),
-                LiveRoomMember(
-                    id: 4,
-                    nickname: "도화",
-                    profileImage: "https://cf.sodalive.net/profile/26/26-profile-ddf78b4d-0300-4c50-9c84-5d8a95fd5fe2-4892-1705256364320",
-                    role: .SPEAKER
-                ),
-                LiveRoomMember(
-                    id: 5,
-                    nickname: "도화",
-                    profileImage: "https://cf.sodalive.net/profile/26/26-profile-ddf78b4d-0300-4c50-9c84-5d8a95fd5fe2-4892-1705256364320",
-                    role: .SPEAKER
-                ),
-                LiveRoomMember(
-                    id: 6,
-                    nickname: "도화",
-                    profileImage: "https://cf.sodalive.net/profile/26/26-profile-ddf78b4d-0300-4c50-9c84-5d8a95fd5fe2-4892-1705256364320",
-                    role: .SPEAKER
-                ),
             ],
             muteSpeakerList: [],
             activeSpeakerList: [],

SodaLive/Sources/Live/Room/V2/Component/View/LiveRoomInfoSpeakerView.swift

@@ -19,12 +19,19 @@ struct LiveRoomInfoSpeakerView: View {
     let onClickProfile: () -> Void
     
     var body: some View {
-        VStack(spacing: 2.7) {
+        VStack(spacing: 5) {
             ZStack(alignment: .center) {
                 KFImage(URL(string: profileUrl))
                     .resizable()
-                    .frame(width: 26.7, height: 26.7)
+                    .frame(width: 25, height: 25)
                     .clipShape(Circle())
+                
+                if isMute {
+                    Image("ic_mute")
+                        .resizable()
+                        .frame(width: 25, height: 25)
+                }
+            }
             .overlay(
                 Circle()
                     .stroke(
@@ -33,18 +40,10 @@ struct LiveRoomInfoSpeakerView: View {
                     )
             )
             
-                if isMute {
-                    Image("ic_mute")
-                        .resizable()
-                        .frame(width: 30, height: 30)
-                }
-            }
-            
             Text(nickname)
-                .font(.custom(Font.medium.rawValue, fixedSize: 10.7))
+                .font(.custom(Font.medium.rawValue, fixedSize: 8.7))
                 .foregroundColor(.gray77)
         }
-        .frame(width: 30, height: 30)
         .onTapGesture { onClickProfile() }
     }
 }