소스 검색

fix: 在低版本ios上的动画问题

lvkun996 1 년 전
부모
커밋
29d0270c4c
4개의 변경된 파일45개의 추가작업 그리고 18개의 파일을 삭제
  1. 5 4
      src/components/luojigou-board-v2/luojigou-board-v2.vue
  2. 31 0
      src/hooks/index.ts
  3. 2 12
      src/main.ts
  4. 7 2
      src/pages/GameViewV2/index.vue

+ 5 - 4
src/components/luojigou-board-v2/luojigou-board-v2.vue

@@ -143,6 +143,7 @@ const ansResultClass = ref(['result'])
 
 const questionCardAni = ref(['ques-card-current'])
 
+
 const aniState = ref(false)
 
 const previewState = ref(false)
@@ -675,7 +676,7 @@ onHide(() => {
     }
 
     .question-card-small {
-      transform: scale(32%) translateX(20%);
+      transform: scale(0.32, 0.32) translateX(20%);
       background-color: transparent !important;
       .card {
         border: 2px solid #D0D0D0;
@@ -810,17 +811,17 @@ onHide(() => {
 
 @keyframes card-ani {
   0% {
-    transform: scale(100%);
+    transform: scale(1);
   };
   78% {
-    transform: scale(100%);
+    transform: scale(1);
     background-color: #fff;
   };
   80% {
     background-color: transparent;
   };
   100% {
-    transform: scale(32%) translateX(20%);
+    transform: scale(0.32, 0.32) translateX(20%);
     background-color: transparent;
   }
 }

+ 31 - 0
src/hooks/index.ts

@@ -520,3 +520,34 @@ export const useGyroH = async (cb: (dire: string) => void) => {
 }
 
 
+
+
+export const useIOSVersion = () => {
+  function detectIOSVersion() {
+    const platform = navigator.platform;
+    const appVersion = navigator.appVersion;
+  
+    if (/iPhone|iPad|iPod/.test(platform)) {
+      const iOSVersionRegex = /OS (\d+)_(\d+)_?(\d+)?/;
+      const match = appVersion.match(iOSVersionRegex);
+  
+      if (match) {
+        const majorVersion = parseInt(match[1], 10);
+        const minorVersion = parseInt(match[2], 10);
+        const patchVersion = parseInt(match[3] || 0, 10);
+  
+        return {
+          major: majorVersion,
+          minor: minorVersion,
+          patch: patchVersion
+        };
+      }
+    }
+  
+    return null; // 非iOS设备或者无法获取iOS版本信息
+  }
+
+  
+  const iOSVersion = detectIOSVersion();
+  return iOSVersion
+}

+ 2 - 12
src/main.ts

@@ -4,20 +4,10 @@ import * as Pinia from 'pinia'
 import staticImg from '@/utils/static'
 import VConsole from "vconsole"
 
-// new VConsole()
-
-// console.log('rive:', rive.Rive);
-
-// window['rive'] = rive.Rive
-
-// const script = document.createElement('script')
-
-// script.src = './src/npm/rive.js'
-// window['rive'] = rive.Rive
-
-// console.log('rive:',  rive.Rive);
 window['rive'] = rive.Rive
 
+// const v = new VConsole()
+
 export function createApp() {
   const app = createSSRApp(App);
   app.use(Pinia.createPinia())

+ 7 - 2
src/pages/GameViewV2/index.vue

@@ -20,7 +20,7 @@
 
 <script setup lang="ts">
 import { ref, reactive, onMounted } from 'vue';
-import { useScheduler, useStaticImg, useBase64, useAudioMange } from '@/hooks'
+import { useScheduler, useStaticImg, useBase64, useAudioMange, useIOSVersion } from '@/hooks'
 import { useAppBridge } from '@/hooks/app'
 import { onLoad } from '@dcloudio/uni-app';
 import { CardModeEnum, OpraModeEnum } from '@/enum/constant';
@@ -154,6 +154,7 @@ const submitQuestionCardData = async () => {
 
 
 
+
 const processRef = ref(0)
 // 游戏结束
 const gameover = async (process: number, cb: Function) => {
@@ -164,7 +165,11 @@ const gameover = async (process: number, cb: Function) => {
     stx.stop()
     submitQuestionCardData()
   }
-  await riveAniDom.value.start(star, 1)
+
+  if (useIOSVersion() === null || useIOSVersion().major >= 15) {
+    await riveAniDom.value.start(star, 1)
+  }
+ 
   screenTouchState.value = false
   calcQuantityV2Store.clear()
   // 如果opraMode 的是learn 则跳转到app-web页面