fix: Android config

didi · Dec 23, 2024 · 6636443 · 6636443
1 parent 8395ee1
commit 6636443
Show file tree

Hide file tree

Showing 2 changed files with 20 additions and 9 deletions.
diff --git a/packages/webpack-plugin/lib/runtime/components/react/mpx-picker-view-column.tsx b/packages/webpack-plugin/lib/runtime/components/react/mpx-picker-view-column.tsx
@@ -1,8 +1,7 @@
 import React, { forwardRef, useRef, useState, useMemo, useEffect, useCallback } from 'react'
-import { LayoutChangeEvent, NativeScrollEvent, NativeSyntheticEvent, Platform, SafeAreaView, ScrollView, StyleSheet, View } from 'react-native'
+import { LayoutChangeEvent, NativeScrollEvent, NativeSyntheticEvent, SafeAreaView, ScrollView, StyleSheet, View } from 'react-native'
 import Reanimated, { AnimatedRef, useAnimatedRef, useScrollViewOffset } from 'react-native-reanimated'
-import { vibrateShort } from '@mpxjs/api-proxy'
-import { useTransformStyle, splitStyle, splitProps, useLayout, usePrevious } from './utils'
+import { useTransformStyle, splitStyle, splitProps, useLayout, usePrevious, isAndroid } from './utils'
 import useNodesRef, { HandlerRef } from './useNodesRef'
 import PickerOverlay from './pickerViewOverlay'
 import PickerMask from './pickerViewMask'
@@ -87,8 +86,6 @@ const _PickerViewColumn = forwardRef<HandlerRef<ScrollView & View, ColumnProps>,
     nodeRef: scrollViewRef
   })
 
-  console.log('[mpx-picker-view-column], render ---> columnIndex=', columnIndex, 'initialIndex=', initialIndex, 'columnData=', columnData.length)
-
   // const initialOffset = useMemo(() => ({
   //   x: 0,
   //   y: itemRawH * initialIndex
@@ -114,6 +111,7 @@ const _PickerViewColumn = forwardRef<HandlerRef<ScrollView & View, ColumnProps>,
   }, [itemRawH, maxIndex])
 
   useEffect(() => {
+    // console.log('[mpx-picker-view-column], useEffect000 --->', 'columnIndex=', columnIndex, 'initialIndex=', initialIndex, 'prevIndex=', prevIndex, 'activeIndex=', activeIndex.current, 'maxIndex=', maxIndex, 'prevMaxIndex=', prevMaxIndex)
     if (
       !scrollViewRef.current ||
       !itemRawH ||
@@ -132,7 +130,7 @@ const _PickerViewColumn = forwardRef<HandlerRef<ScrollView & View, ColumnProps>,
         y: itemRawH * initialIndex,
         animated: false
       })
-    }, 0)
+    }, isAndroid ? 200 : 0)
     activeIndex.current = initialIndex
   }, [itemRawH, initialIndex])
 
@@ -146,6 +144,10 @@ const _PickerViewColumn = forwardRef<HandlerRef<ScrollView & View, ColumnProps>,
   }
 
   const onScrollViewLayout = (e: LayoutChangeEvent) => {
+    if (isAndroid) {
+      return
+    }
+    // RN iOS bug: https://github.com/facebook/react-native/issues/36135
     const { width } = e.nativeEvent.layout
     const widthInt = Math.ceil(width)
     if (widthInt !== scrollViewWidth) {
@@ -205,7 +207,12 @@ const _PickerViewColumn = forwardRef<HandlerRef<ScrollView & View, ColumnProps>,
   }
 
   const onScroll = (e: NativeSyntheticEvent<NativeScrollEvent>) => {
-    if (Platform.OS === 'android') {
+    if (isAndroid) {
+      return
+    }
+    // 全局注册的震动触感 hook
+    const pickerVibrate = global.__mpx.config.rnConfig.pickerVibrate
+    if (typeof pickerVibrate !== 'function') {
       return
     }
     const { y } = e.nativeEvent.contentOffset
@@ -218,7 +225,8 @@ const _PickerViewColumn = forwardRef<HandlerRef<ScrollView & View, ColumnProps>,
             index: currentId,
             y: currentId * itemRawH
           }
-          vibrateShort({ type: 'selection' })
+          // vibrateShort({ type: 'selection' })
+          pickerVibrate()
         }
       }
     }

diff --git a/packages/webpack-plugin/lib/runtime/components/react/utils.tsx b/packages/webpack-plugin/lib/runtime/components/react/utils.tsx
@@ -1,5 +1,5 @@
 import { useEffect, useCallback, useMemo, useRef, ReactNode, ReactElement, isValidElement, useContext, useState, Dispatch, SetStateAction, Children, cloneElement } from 'react'
-import { LayoutChangeEvent, TextStyle, ImageProps, Image } from 'react-native'
+import { LayoutChangeEvent, TextStyle, ImageProps, Image, Platform } from 'react-native'
 import { isObject, isFunction, isNumber, hasOwn, diffAndCloneA, error, warn, getFocusedNavigation } from '@mpxjs/utils'
 import { VarContext } from './context'
 import { ExpressionParser, parseFunc, ReplaceSource } from './parser'
@@ -18,6 +18,9 @@ export const HIDDEN_STYLE = {
   opacity: 0
 }
 
+export const isIOS = Platform.OS === 'ios'
+export const isAndroid = Platform.OS === 'android'
+
 const varDecRegExp = /^--.*/
 const varUseRegExp = /var\(/
 const calcUseRegExp = /calc\(/