瀏覽代碼

Merge branch '2024鹅状元' of https://gogs.mtavip.com/wangguoyu/uniProject into 2024鹅状元

tanxue 4 月之前
父節點
當前提交
cf5019ba0c
共有 3 個文件被更改,包括 176 次插入16 次删除
  1. 3 1
      pages/game/components/foodSelect.vue
  2. 38 15
      pages/game/components/goose.vue
  3. 135 0
      pages/game/components/useAudio.js

+ 3 - 1
pages/game/components/foodSelect.vue

@@ -43,9 +43,11 @@
 	})
 	})
 	
 	
 	const popupRef = ref(null);
 	const popupRef = ref(null);
+
 	function handleOpen() {
 	function handleOpen() {
 		popupRef.value.open();
 		popupRef.value.open();
-	}
+    uni.$emit('food-select-open')
+  }
 	function handleClose() {
 	function handleClose() {
 		popupRef.value.close();
 		popupRef.value.close();
 	}
 	}

+ 38 - 15
pages/game/components/goose.vue

@@ -1,34 +1,57 @@
 <template>
 <template>
 	<view>
 	<view>
-		<up-line-progress v-if="growthType!==3" :percentage="progress" :showText="false" activeColor="#54e1fe" class="game-progress-box"></up-line-progress>
+		<up-line-progress v-if="growthType!==3" :percentage="progress" :showText="false" activeColor="#54e1fe"
+			class="game-progress-box"></up-line-progress>
 		<text v-if="growthType!==3" class="game-progress-text">成长值:{{progress}}%</text>
 		<text v-if="growthType!==3" class="game-progress-text">成长值:{{progress}}%</text>
-    <image :src="imgUrl" class="goose-img-box" @click="handleTouch"></image>
+		<image :src="imgUrl" class="goose-img-box" @click="handleTouch"></image>
 	</view>
 	</view>
 </template>
 </template>
 
 
 <script setup>
 <script setup>
-	import {gooseGrowthTypeList} from "./constantConfig.js"
-	import { ref,computed } from "vue";
-	import upLineProgress from "uview-plus/components/u-line-progress/u-line-progress.vue";  
-	
+	import {
+		ref,
+		computed,
+		watch,
+		toRefs
+	} from "vue";
+	import upLineProgress from "uview-plus/components/u-line-progress/u-line-progress.vue";
+	import {
+		useAudio,
+		useHuDong
+	} from "./useAudio.js"
 	const props = defineProps({
 	const props = defineProps({
-    growthType: {
-			type: [String,Number]
+		growthType: {
+			type: [String, Number]
 		},
 		},
 		progress: {
 		progress: {
-			type: [String,Number],
+			type: [String, Number],
 			default: 0
 			default: 0
 		}
 		}
 	})
 	})
+	const {growthType} = toRefs(props);
+	const Emits = defineEmits(['onPlay','onEnd'])
+	
+	
+
+	const {
+		init,
+		doTouch,
+		imgUrl
+	} = useHuDong(props);
+	const {
+		innerAudioContext,
+	} = useAudio(growthType);
+
+	init();
 	
 	
-	const imgUrl = computed(() => {
-		const active = gooseGrowthTypeList.find(item => item.id == props.growthType)
-		return active ? active.imgUrl: ''
+	watch(growthType, () => {
+		init();
 	})
 	})
 
 
-  function handleTouch() {
-    console.log('333')
-  }
+	function handleTouch() {
+		doTouch(innerAudioContext);
+	}
+
 </script>
 </script>
 
 
 <style>
 <style>

+ 135 - 0
pages/game/components/useAudio.js

@@ -0,0 +1,135 @@
+import {ref, watch,computed} from "vue";
+import {gooseGrowthTypeList} from "./constantConfig.js";
+import {onHide} from "@dcloudio/uni-app"
+
+const audioList = {
+	0: [
+		'/static/mp3/dan/01.MP3',
+		'/static/mp3/dan/02.MP3',
+		'/static/mp3/dan/03.MP3',
+	],
+	1: [
+		'/static/mp3/xiaoe/01.MP3',
+		'/static/mp3/xiaoe/02.MP3',
+		'/static/mp3/xiaoe/03.MP3',
+		'/static/mp3/xiaoe/04.MP3',
+	],
+	2: [
+		'/static/mp3/zhonge/01.MP3',
+		'/static/mp3/zhonge/02.MP3',
+		'/static/mp3/zhonge/03.MP3',
+		'/static/mp3/zhonge/04.MP3',
+	],
+	3: [
+		'/static/mp3/dae/01.MP3',
+		'/static/mp3/dae/02.MP3',
+		'/static/mp3/dae/03.MP3',
+		'/static/mp3/dae/04.MP3',
+	],
+}
+
+const imageList = {
+	0: ['/static/images/game/game-img1.gif', '/static/images/game/game-eat-img1.gif'],
+	1: ['/static/images/game/game-img2.gif', '/static/images/game/game-eat-img2.gif'],
+	2: ['/static/images/game/game-img3.gif', '/static/images/game/game-eat-img3.gif'],
+	3: ['/static/images/game/game-img4.gif', '/static/images/game/game-eat-img4.gif'],
+}
+
+
+export function useAudio (grouthType) {
+	const defaultGrouthType = ref(''); // 成长状态历史
+	const audioIndex = ref(0); // 播放序列
+	const innerAudioContext = uni.createInnerAudioContext();
+	innerAudioContext.autoplay = false;
+	innerAudioContext.src = audioList[grouthType.value][0];
+	innerAudioContext.onPlay(() => {
+		// 播放
+		uni.$emit('play-audio');
+	});
+	innerAudioContext.onError((res) => {
+	  console.log(res.errMsg);
+	  console.log(res.errCode);
+	});
+	innerAudioContext.onEnded(() => {
+		// 播放结束
+		uni.$emit('play-audio-ended')
+		// 计算播放音频序列
+		const list = audioList[grouthType.value];
+		if (audioIndex.value >= list.length-1) {
+			audioIndex.value = 0;
+		} else {
+			audioIndex.value = audioIndex.value+1;
+		}
+		// 更新音频源
+		changeSource(list[audioIndex.value]);
+	})
+	
+	function changeSource(url) {
+		innerAudioContext.src= url;
+		innerAudioContext.currentTime = 0;
+	}
+	
+	onHide(() => {
+		innerAudioContext.stop();
+	})
+
+	// 展开食物停止播放
+	uni.$on('food-select-open', () => {
+		innerAudioContext.stop();
+		audioIndex.value = 0;
+	})
+
+	
+	watch(grouthType, () => {
+		if (defaultGrouthType.value != grouthType.value) {
+			const list = audioList[grouthType.value];
+			// 当鹅成长状态变更时重置播放序列
+			audioIndex.value = 0;
+			defaultGrouthType.value = grouthType.value;
+			changeSource(audioList[grouthType.value][0]);
+		}
+	})
+	
+	return {
+		innerAudioContext,
+	}
+}
+
+
+export function useHuDong(props) {
+	const imgUrl = ref('');
+	
+	function getDefaultImg() {
+		const active = gooseGrowthTypeList.find(item => item.id == props.growthType);
+		return active ? active.imgUrl: ''
+	}
+
+	// 初始化
+	function init() {
+		imgUrl.value = getDefaultImg();
+	}
+
+	function doTouch(myAudio) {
+		myAudio.play();
+	}
+	
+	// 播放开始切换动画
+	uni.$on('play-audio', () => {
+		imgUrl.value = imageList[props.growthType][1]
+	})
+	// 播放结束恢复默认
+	uni.$on('play-audio-ended', () => {
+		imgUrl.value = imageList[props.growthType][0]
+	})
+	// 展开食物恢复默认
+	uni.$on('food-select-open', () => {
+		imgUrl.value = imageList[props.growthType][0]
+	})
+	
+	return {
+		init,
+		doTouch,
+		imgUrl
+	}
+	
+}