Pārlūkot izejas kodu

feat:修改右侧视频再32寸大屏的效果

xianna.liang 6 mēneši atpakaļ
vecāks
revīzija
d546fe92c6
8 mainītis faili ar 25 papildinājumiem un 13 dzēšanām
  1. 2 0
      .gitignore
  2. 3 1
      manifest.json
  3. 4 4
      pages/index32/index32.vue
  4. BIN
      static/aLogo.png
  5. BIN
      static/video/whiteVideo.mp4
  6. 3 0
      theme/chat32.css
  7. 7 3
      theme/public.css
  8. 6 5
      until/fun.js

+ 2 - 0
.gitignore

@@ -99,3 +99,5 @@ unpackage/release/apk/__UNI__E15E1AD__20240930172145.apk
 unpackage/cache/wgt/__UNI__E15E1AD/nativeplugins/tts/package.json
 unpackage/cache/wgt/__UNI__E15E1AD/nativeplugins/tts/android/tts_lib1.0.1.aar
 unpackage/debug/android_debug.apk
+unpackage/dist/build/app-plus/static/video/whiteVideo.mp4
+unpackage/

+ 3 - 1
manifest.json

@@ -32,7 +32,9 @@
             "delay" : 0
         },
         /* 模块配置 */
-        "modules" : {},
+        "modules" : {
+            "VideoPlayer" : {}
+        },
         /* 应用发布信息 */
         "distribute" : {
             /* android打包配置 */

+ 4 - 4
pages/index32/index32.vue

@@ -64,9 +64,9 @@
 				</view>
 			</view>
 			<view class="sidebar-right" :style="`height:${95-styleData.screenWidth}vh`">
-				<!-- <image src="../../static/logo.png" mode="aspectFit" ></image> -->
-				<video class="video" :class="{active:styleData.value}" id="demoVideo" :controls="false" :loop='true' object-fit="cover"
-					:enable-progress-gesture="false" :show-center-play-btn="false" :src="styleData.videoSrc">
+				<image v-if="msgList.demoVideo1" src="../../static/aLogo.png" mode="aspectFit" style="height: 400px;position: absolute;bottom: 0;" ></image>
+				<video v-else class="video" :class="{active:styleData.value}" id="demoVideo" :controls="false" :loop='true' object-fit="cover"
+					:enable-progress-gesture="false" :show-center-play-btn="false" :src="styleData.videoSrc" :autoplay='true' >
 				</video>
 			</view>
 		</view>
@@ -114,6 +114,7 @@
 		// 键盘弹起高度
 		KeyBoardHeight: 0,
 		demoVideo: uni.createVideoContext('demoVideo'),
+		demoVideo1:true
 	})
 
 	const styleData = reactive({
@@ -124,7 +125,6 @@
 		contentColor: "#f5f5f5",
 		labelColor: "#f5f5f5",
 		borderColor: "rgb(30,144,255)",
-
 		screenWidth: 40,
 		isScreen: false,
 		

BIN
static/aLogo.png


BIN
static/video/whiteVideo.mp4


+ 3 - 0
theme/chat32.css

@@ -27,4 +27,7 @@
 } */
 .sidebar-right .video {
 	height: 500px;
+	right: 0px;
+	position: absolute;
+	bottom:0px;
 }

+ 7 - 3
theme/public.css

@@ -166,14 +166,18 @@
 /* 右边 */
 .sidebar-right {
 	width: 32vw;
-	display: flex;
+/* 	display: flex;
 	flex-direction: column;
-	justify-content: end;
+	justify-content: end; */
+	position: relative;
+	/* background-color: red; */
+	
 }
 
 .sidebar-right .video {
 	width: 100%;
-	align-items: end;
+/* 	align-items: end; */
+
 }
 
 .sidebar-right .active {

+ 6 - 5
until/fun.js

@@ -16,14 +16,16 @@ import ttsUtils from './tts/ttsUtils';
 
 const handleSend = async (msgList) => {
 
-	msgList.demoVideo.play()
-	msgList.isClick = !msgList.isClick
 	const data = {
 		AppId: '0c8ff06b-91d9-43f7-b61e-ca5da1db15d4',
 		AId: 'TK1234',
 		content: ''
 	}
 	if (msgList.chatMsg != '') {
+		msgList.demoVideo1 = false
+		msgList.demoVideo.play()
+		
+		
 		msgList.isloading[msgList.len] = true
 		msgList.len++
 		let obj = {
@@ -42,9 +44,8 @@ const handleSend = async (msgList) => {
 		ttsUtils.toSpeak(obj.otherContent)
 
 
-
 	}
-
+	msgList.isClick = !msgList.isClick
 	msgList.otherContent = ''
 }
 
@@ -75,7 +76,7 @@ const getChatContent = ((msgList, text, index) => {
 	msgList.textCount = 0
 	msgList.isloading[index - 1] = false
 	msgList.isClick = !msgList.isClick
-	
+
 	// logo视频静止
 	msgList.demoVideo.seek(0)
 	msgList.demoVideo.pause()