From 06fc544f1a120b6810a6dabff00f321ad2c801ab Mon Sep 17 00:00:00 2001 From: liyi Date: Tue, 13 May 2025 10:05:05 +0800 Subject: [PATCH] =?UTF-8?q?fix:=E5=A2=9E=E5=8A=A0=E8=A7=86=E9=A2=91?= =?UTF-8?q?=E5=88=86=E8=BE=A8=E7=8E=87=E5=88=A4=E6=96=AD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../handle/impl/udp_talk_expect_handler.dart | 4 +- lib/talk/starChart/star_chart_manage.dart | 2 + .../views/talkView/talk_view_page.dart | 165 ++++++++++++------ 3 files changed, 120 insertions(+), 51 deletions(-) diff --git a/lib/talk/starChart/handle/impl/udp_talk_expect_handler.dart b/lib/talk/starChart/handle/impl/udp_talk_expect_handler.dart index e9f3e598..792e7f2c 100644 --- a/lib/talk/starChart/handle/impl/udp_talk_expect_handler.dart +++ b/lib/talk/starChart/handle/impl/udp_talk_expect_handler.dart @@ -43,7 +43,9 @@ class UdpTalkExpectHandler extends ScpMessageBaseHandle startChartManage.stopCallRequestMessageTimer(); // talkViewState.rotateAngle.value = talkExpectResp.rotate ?? 0; startChartManage.rotateAngle = talkExpectResp.rotate; - AppLog.log('视频画面需要旋转:${talkExpectResp.rotate}'); + startChartManage.videoWidth = talkExpectResp.width; + startChartManage.videoHeight = talkExpectResp.height; + AppLog.log('视频画面需要旋转:${talkExpectResp.rotate},画面宽高：${talkExpectResp.width}-${talkExpectResp.height}'); // 收到预期数据的应答后，代表建立了连接，启动通话保持的监听 // 启动通话保持监听定时器（用来判断如果x秒内没有收到通话保持则执行的操作）; talkePingOverTimeTimerManager.start(); diff --git a/lib/talk/starChart/star_chart_manage.dart b/lib/talk/starChart/star_chart_manage.dart index e5eddb59..d64cb808 100644 --- a/lib/talk/starChart/star_chart_manage.dart +++ b/lib/talk/starChart/star_chart_manage.dart @@ -114,6 +114,8 @@ class StartChartManage { final int _maxPayloadSize = 8 * 1024; // 分包大小 int rotateAngle = 0; // 视频旋转角度 + int videoWidth = 0; // 视频宽度 + int videoHeight = 0; // 视频高度 // 默认通话的期望数据格式 TalkExpectReq _defaultTalkExpect = TalkConstant.H264Expect; diff --git a/lib/talk/starChart/views/talkView/talk_view_page.dart b/lib/talk/starChart/views/talkView/talk_view_page.dart index 264e0252..7abb28b1 100644 --- a/lib/talk/starChart/views/talkView/talk_view_page.dart +++ b/lib/talk/starChart/views/talkView/talk_view_page.dart @@ -98,56 +98,55 @@ class _TalkViewPageState extends State child: Stack( alignment: Alignment.center, children: [ - Obx( - () { - final double screenWidth = MediaQuery.of(context).size.width; - final double screenHeight = MediaQuery.of(context).size.height; - - final double logicalWidth = MediaQuery.of(context).size.width; - final double logicalHeight = MediaQuery.of(context).size.height; - final double devicePixelRatio = - MediaQuery.of(context).devicePixelRatio; - - // 计算物理像素值 - final double physicalWidth = logicalWidth * devicePixelRatio; - final double physicalHeight = logicalHeight * devicePixelRatio; - - // 旋转后的图片尺寸 - const int rotatedImageWidth = 480; // 原始高度 - const int rotatedImageHeight = 864; // 原始宽度 - - // 计算缩放比例 - final double scaleWidth = physicalWidth / rotatedImageWidth; - final double scaleHeight = physicalHeight / rotatedImageHeight; - max(scaleWidth, scaleHeight); // 选择较大的缩放比例 - - return state.listData.value.isEmpty - ? Image.asset( - 'images/main/monitorBg.png', - width: screenWidth, - height: screenHeight, - fit: BoxFit.cover, - ) - : PopScope( - canPop: false, - child: RepaintBoundary( - key: state.globalKey, - child: SizedBox.expand( - child: RotatedBox( - quarterTurns: startChartManage.rotateAngle ~/ 90, - child: RawImage( - image: state.currentImage.value, - width: ScreenUtil().scaleWidth, - height: ScreenUtil().scaleHeight, - fit: BoxFit.cover, - filterQuality: FilterQuality.high, - ), - ), - ), - ), - ); - }, - ), + // 全屏背景图片或渐变色背景 + Obx(() { + if (state.listData.value.isEmpty) { + return SizedBox.expand( + child: Image.asset( + 'images/main/monitorBg.png', + fit: BoxFit.cover, + ), + ); + } + final int videoW = startChartManage.videoWidth; + final int videoH = startChartManage.videoHeight; + if (videoW == 320 && videoH == 240) { + return SizedBox.expand( + child: Container( + decoration: const BoxDecoration( + gradient: LinearGradient( + begin: Alignment.topCenter, + end: Alignment.bottomCenter, + colors: [ + Color(0xFF232526), + Color(0xFF414345), + ], + ), + ), + ), + ); + } + return const SizedBox.shrink(); + }), + // 视频窗口，分辨率判断 + Obx(() { + if (state.listData.value.isEmpty) { + return const SizedBox.shrink(); + } + final int videoW = startChartManage.videoWidth; + final int videoH = startChartManage.videoHeight; + if (videoW == 320 && videoH == 240) { + return Positioned( + top: 150.h, + left: 0, + right: 0, + child: _buildVideoWidget(), + ); + } else { + // 直接全屏显示 + return _buildVideoWidget(); + } + }), Obx(() => state.listData.value.isEmpty ? Positioned( bottom: 310.h, @@ -183,6 +182,8 @@ class _TalkViewPageState extends State ), ) : Container()), + + /// 工具栏 Positioned( bottom: 10.w, child: Container( @@ -614,4 +615,68 @@ class _TalkViewPageState extends State // UdpTalkDataHandler().resetDataRates(); super.dispose(); } + + Widget _buildVideoWidget() { + // 工具栏宽度 + double barWidth = 1.sw - 30.w * 2; + int videoW = startChartManage.videoWidth; + int videoH = startChartManage.videoHeight; + int quarterTurns = startChartManage.rotateAngle ~/ 90; + bool isRotated = quarterTurns % 2 == 1; + // 旋转后宽高互换 + double videoAspect = isRotated ? videoW / videoH : videoH / videoW; + double containerHeight = + barWidth * (isRotated ? videoW / videoH : videoH / videoW); + + if (videoW == 320 && videoH == 240) { + return Center( + child: ClipRRect( + borderRadius: BorderRadius.circular(20.h), + child: Container( + width: barWidth, + height: containerHeight, + decoration: const BoxDecoration( + gradient: LinearGradient( + begin: Alignment.topCenter, + end: Alignment.bottomCenter, + colors: [ + Color(0xFF232526), + Color(0xFF414345), + ], + ), + ), + child: RotatedBox( + quarterTurns: quarterTurns, + child: RawImage( + image: state.currentImage.value, + fit: BoxFit.contain, + filterQuality: FilterQuality.high, + width: barWidth, + height: containerHeight, + ), + ), + ), + ), + ); + } else { + return PopScope( + canPop: false, + child: RepaintBoundary( + key: state.globalKey, + child: SizedBox.expand( + child: RotatedBox( + quarterTurns: startChartManage.rotateAngle ~/ 90, + child: RawImage( + image: state.currentImage.value, + width: ScreenUtil().scaleWidth, + height: ScreenUtil().scaleHeight, + fit: BoxFit.cover, + filterQuality: FilterQuality.high, + ), + ), + ), + ), + ); + } + } }