gif performance, chat ui

Escaper-Park · May 11, 2024 · 539a07b · 539a07b
1 parent 282d511
commit 539a07b
Show file tree

Hide file tree

Showing 11 changed files with 85 additions and 74 deletions.
diff --git a/README.md b/README.md
@@ -7,21 +7,20 @@
 
 ![홈즐겨찾기](./images/01.png)
 ![카테고리](./images/03.png)
-![카테고리라이브](./images/04.png)
 
 ## 업데이트
-### v0.2.3
+### v0.2.4
+- Gif 이모티콘이 다수 올라올 때 프로그램이 종료되는 현상 수정 (Thanks to @[mero-jung](https://github.com/mero-jung))
+- 채팅창 UI 수정
+
+### ~v0.2.3
 - 화질 개선을 위해 Low Latency HLS에서 HLS로 변경
 - 홈 화면 팔로우, 인기 채널 불러오기 에러 수정
 - VOD 시간 탐색시 키 누르고 있으면 계속 이동
-
-### v0.2.2
 - 채널 동영상에서 연령 인증 동영상이 재생되지 않는 현상 수정
-- gif 이모티콘 성능 최적화, 채팅이 가끔 나오지 않는 현상 수정
+- 채팅이 가끔 나오지 않는 현상 수정
 - 전체 라이브 페이지 추가 (홈 화면 상단 -> 전체 라이브)
 - 기타 기능 및 버그 수정
-
-### v0.2.1
 - HeadlessWebView로 로그인이 진행되지 않는 분들을 위해 WebView 로그인을 추가했습니다. 가상 키보드에 문제가 있으신 분도 WebView 로그인을 사용해주세요. (설정 -> WebView 로그인)
 
 ## 패치노트 - v0.2
@@ -31,9 +30,6 @@
 ### 4. 라이브 시청 중 탐색 기능(인기, 팔로우, 카테고리) 추가
 - 라이브 시청 중 위 방향 키패드를 누르면 탐색 창이 나타납니다. 
 ### 5. 기타 업데이트
-- 차단 목록이 나타나지 않습니다.
-- 로그인 시 성인 인증 채널의 썸네일이 나옵니다.
-- 로그인 시 키보드 입력 오류를 피하기 위해 두 화면을 거쳐서 로그인 합니다. (아이디 입력 페이지, 비밀번호 입력 페이지)
 
 ## 개발자의 말
 - 로그인 버튼 클릭 후 동작이 없으면 **모바일 네이버 앱 알림**을 확인해주세요(2단계 인증). 그래도 진행되지 않는다면 아이디 비밀번호를 다시 확인해주세요. (취소 후 다시 시도)
@@ -42,7 +38,6 @@
 
     [**U+tv리모컨앱 정보**](https://www.lguplus.com/iptv/main-feature/000PPT0036), [**U+tv리모컨앱 iOS**](https://apps.apple.com/kr/app/u-tv-%EB%A6%AC%EB%AA%A8%EC%BB%A8%EC%95%B1/id1637815745), [**U+tv리모컨앱 Android**](https://play.google.com/store/apps/details?id=com.lguplus.remocon&hl=ko&gl=US)
 
-![로그인](./images/06.png)
 
 ## 설치 방법
 APK 파일을 다운받아서 수동으로 설치합니다.
@@ -64,7 +59,7 @@ APK 파일을 다운받아서 수동으로 설치합니다.
 ```
 
 ## 다운로드
-[**APK 파일 다운로드 (v0.2.3)**](https://github.com/Escaper-Park/unofficial_chzzk_android_tv/releases/tag/v0.2.3)
+[**APK 파일 다운로드 (v0.2.4)**](https://github.com/Escaper-Park/unofficial_chzzk_android_tv/releases/tag/v0.2.4)
 
 ### 설치 파일
 - 대부분 v7a로 설치 가능. 설치 불가시 통합버전 또는 사용하시는 CPU 타입에 따라 설치하시면 됩니다. (가능한 v7a로 설치)

diff --git a/lib/src/common/constants/app_version.dart b/lib/src/common/constants/app_version.dart
@@ -1,3 +1,3 @@
 class AppVersion {
-  static const String version = 'v0.2.3';
+  static const String version = 'v0.2.4';
 }
diff --git a/lib/src/common/widgets/circle_avatar_profile_image.dart b/lib/src/common/widgets/circle_avatar_profile_image.dart
@@ -36,6 +36,7 @@ class CircleAvatarProfileImage extends StatelessWidget {
                     width: 2.0,
                   ),
                 ),
+                child: const Center(child: Text('TEST')),
               )
             : OptimizedCachedNetworkImage(
                 imageUrl: profileImageUrl!,

diff --git a/lib/src/common/widgets/optimized_image.dart b/lib/src/common/widgets/optimized_image.dart
@@ -1,8 +1,8 @@
 import 'package:cached_network_image/cached_network_image.dart';
 import 'package:flutter/material.dart';
 import 'package:gif/gif.dart';
-import 'package:unofficial_chzzk_android_tv/src/common/image_extension.dart';
 
+import '../../../src/utils/image_cache/image_extension.dart';
 import '../constants/styles.dart';
 
 class OptimizedCachedNetworkImage extends StatelessWidget {

diff --git a/lib/src/features/live/widgets/live_channel_info.dart b/lib/src/features/live/widgets/live_channel_info.dart
@@ -29,6 +29,7 @@ class LiveChannelInfo extends StatelessWidget {
             width: 30.0,
             child: CircleAvatarProfileImage(
               profileImageUrl: liveDetail.channel.channelImageUrl,
+              hasBorder: liveDetail.channel.openLive ?? false,
             ),
           ),
           const SizedBox(width: 15.0),

diff --git a/lib/src/features/live_streaming/widgets/chat_container.dart b/lib/src/features/live_streaming/widgets/chat_container.dart
@@ -3,6 +3,7 @@ import 'package:gif/gif.dart';
 
 import '../../../common/constants/styles.dart';
 import '../../../common/widgets/optimized_image.dart';
+import '../../../common/widgets/rounded_container.dart';
 import '../../chat/model/chat.dart';
 
 class ChatContainer extends StatefulWidget {
@@ -11,14 +12,16 @@ class ChatContainer extends StatefulWidget {
     required this.chat,
     required this.fontSize,
     required this.verticalInterval,
+    required this.opacity,
   });
 
   final Chat chat;
   final double fontSize;
   final double verticalInterval;
+  final double opacity;
 
   @override
-  _ChatContainerState createState() => _ChatContainerState();
+  State<ChatContainer> createState() => _ChatContainerState();
 }
 
 class _ChatContainerState extends State<ChatContainer>
@@ -108,22 +111,26 @@ class _ChatContainerState extends State<ChatContainer>
         horizontal: 5.0,
         vertical: widget.verticalInterval / 2,
       ),
-      child: RichText(
-        text: TextSpan(
-          children: [
-            TextSpan(
-              text: widget.chat.nickname,
-              style: TextStyle(
-                fontSize: widget.fontSize,
-                color: nicknameColor,
-                fontWeight: FontWeight.w600,
+      child: RoundedContainer(
+        backgroundColor: AppColors.blackColor.withOpacity(widget.opacity),
+        padding: const EdgeInsets.all(5.0),
+        child: RichText(
+          text: TextSpan(
+            children: [
+              TextSpan(
+                text: widget.chat.nickname,
+                style: TextStyle(
+                  fontSize: widget.fontSize,
+                  color: nicknameColor,
+                  fontWeight: FontWeight.w600,
+                ),
               ),
-            ),
-            const WidgetSpan(
-              child: SizedBox(width: 5.0),
-            ),
-            ...textSpans,
-          ],
+              const WidgetSpan(
+                child: SizedBox(width: 5.0),
+              ),
+              ...textSpans,
+            ],
+          ),
         ),
       ),
     );

diff --git a/lib/src/features/live_streaming/widgets/live_chat_stream.dart b/lib/src/features/live_streaming/widgets/live_chat_stream.dart
@@ -12,11 +12,13 @@ class LiveChatStream extends ConsumerWidget {
     required this.liveDetail,
     required this.fontSize,
     required this.verticalInterval,
+    this.opacity = 0.0,
   });
 
   final LiveDetail liveDetail;
   final double fontSize;
   final double verticalInterval;
+  final double opacity;
 
   @override
   Widget build(BuildContext context, WidgetRef ref) {
@@ -40,6 +42,7 @@ class LiveChatStream extends ConsumerWidget {
                 chat: chat,
                 fontSize: fontSize,
                 verticalInterval: verticalInterval,
+                opacity: opacity,
               );
             },
           ),

diff --git a/lib/src/common/image_extension.dart → ...rc/utils/image_cache/image_extension.dart b/lib/src/common/image_extension.dart → ...rc/utils/image_cache/image_extension.dart
diff --git a/lib/src/utils/video_player/live_network_video.dart b/lib/src/utils/video_player/live_network_video.dart
@@ -6,7 +6,6 @@ import 'package:chewie/chewie.dart';
 import 'package:video_player/video_player.dart';
 import 'package:wakelock_plus/wakelock_plus.dart';
 
-import '../../common/constants/styles.dart';
 import '../../features/chat/controller/chat_controller.dart';
 import '../../features/chat/controller/chat_settings_controller.dart';
 import '../../features/chat/model/chat_settings.dart';
@@ -190,14 +189,14 @@ class _NetworkVideoState extends ConsumerState<LiveStreamingNetworkVideo>
                 Align(
                   alignment: ChatPositionData
                       .chatPositionsData[chatPositionIndex].alignment,
-                  child: Container(
-                    color: AppColors.blackColor.withOpacity(opacity),
+                  child: SizedBox(
                     width: maxWidth * chatContainerWidth * 0.01,
                     height: maxHeight * chatContainerHeight * 0.01,
                     child: LiveChatStream(
                       liveDetail: widget.liveDetail,
                       fontSize: chatFontSize,
                       verticalInterval: verticalInterval,
+                      opacity: opacity,
                     ),
                   ),
                 ),

diff --git a/lib/src/utils/video_player/widgets/live/chat/live_stream_chat_position_controls.dart b/lib/src/utils/video_player/widgets/live/chat/live_stream_chat_position_controls.dart
@@ -34,7 +34,10 @@ class LiveStreamChatPositionControls extends ConsumerWidget {
         mainAxisAlignment: MainAxisAlignment.start,
         crossAxisAlignment: CrossAxisAlignment.start,
         children: [
-          const HeaderText(text: '채팅창 위치'),
+          const HeaderText(
+            text: '채팅창 위치',
+            fontSize: 16.0,
+          ),
           Expanded(
             child: Row(
               children: [

diff --git a/lib/src/utils/video_player/widgets/live/chat/live_stream_chat_settings_value_controls.dart b/lib/src/utils/video_player/widgets/live/chat/live_stream_chat_settings_value_controls.dart
@@ -202,8 +202,8 @@ class _ChatSettingControl extends ConsumerWidget {
 
   @override
   Widget build(BuildContext context, WidgetRef ref) {
-    return Padding(
-      padding: const EdgeInsets.symmetric(horizontal: 10.0),
+    return SizedBox(
+      height: 120.0,
       child: Column(
         mainAxisAlignment: MainAxisAlignment.start,
         crossAxisAlignment: CrossAxisAlignment.start,
@@ -212,46 +212,48 @@ class _ChatSettingControl extends ConsumerWidget {
             text: headerText,
             fontSize: 16.0,
           ),
-          Row(
-            mainAxisAlignment: MainAxisAlignment.start,
-            children: [
-              SizedBox(
-                width: 45.0,
-                child: Text(
-                  value,
-                  style: const TextStyle(
-                    fontSize: 16.0,
-                    color: AppColors.whiteColor,
-                    fontWeight: FontWeight.w600,
+          Expanded(
+            child: Row(
+              mainAxisAlignment: MainAxisAlignment.start,
+              children: [
+                SizedBox(
+                  width: 50.0,
+                  child: Text(
+                    value,
+                    style: const TextStyle(
+                      fontSize: 16.0,
+                      color: AppColors.whiteColor,
+                      fontWeight: FontWeight.w600,
+                    ),
                   ),
                 ),
-              ),
-              const SizedBox(width: 10.0),
-              ControlIcon(
-                iconData: Icons.arrow_upward_rounded,
-                onPressed: () {
-                  ref
-                      .read(controlOverlayTimerProvider.notifier)
-                      .showOverlayAndStartTimer(
-                          videoFocusNode: videoFocusNode,
-                          overlayType: OverlayType.chatSettings);
-                  onPressedUp();
-                },
-              ),
-              const SizedBox(width: 5.0),
-              ControlIcon(
-                iconData: Icons.arrow_downward_rounded,
-                onPressed: () {
-                  ref
-                      .read(controlOverlayTimerProvider.notifier)
-                      .showOverlayAndStartTimer(
-                          videoFocusNode: videoFocusNode,
-                          overlayType: OverlayType.chatSettings);
-
-                  onPressedDown();
-                },
-              ),
-            ],
+                const SizedBox(width: 10.0),
+                ControlIcon(
+                  iconData: Icons.arrow_upward_rounded,
+                  onPressed: () {
+                    ref
+                        .read(controlOverlayTimerProvider.notifier)
+                        .showOverlayAndStartTimer(
+                            videoFocusNode: videoFocusNode,
+                            overlayType: OverlayType.chatSettings);
+                    onPressedUp();
+                  },
+                ),
+                const SizedBox(width: 5.0),
+                ControlIcon(
+                  iconData: Icons.arrow_downward_rounded,
+                  onPressed: () {
+                    ref
+                        .read(controlOverlayTimerProvider.notifier)
+                        .showOverlayAndStartTimer(
+                            videoFocusNode: videoFocusNode,
+                            overlayType: OverlayType.chatSettings);
+
+                    onPressedDown();
+                  },
+                ),
+              ],
+            ),
           ),
         ],
       ),