Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Android animation lag #74

Open
xuergo opened this issue Jun 13, 2024 · 1 comment
Open

Android animation lag #74

xuergo opened this issue Jun 13, 2024 · 1 comment

Comments

@xuergo
Copy link

xuergo commented Jun 13, 2024

Android
https://github.com/alantoa/react-native-awesome-slider/assets/46159623/32e0bd08-d499-44a4-975c-279e624f0e80

ios
https://github.com/alantoa/react-native-awesome-slider/assets/46159623/7e50b6bf-c5d3-4b9d-b8db-b65e6d5fd805

Hello, Android animation lag。Here is my code. Where did I write it? Is there a problem? Thank you

import { View, Text } from 'react-native'
import React, { useState } from 'react'
import { Slider } from 'react-native-awesome-slider'
import { useSharedValue } from 'react-native-reanimated'

const index = () => {
  const progressSharedValue = useSharedValue(0)  
  const minSharedValue = useSharedValue(0) 
  const maxSharedValue = useSharedValue(100)  
  const isScrubbing = useSharedValue(true)

  const [text, setText] = useState('0')


  const onValueChange = (value: number) => {
    setText(value.toString())
  }


  return (
    <View>

      <Slider
        isScrubbing={isScrubbing}
        panHitSlop={{
          top: 10,
          left: 10,
          bottom: 10,
          right: 10
        }}
        style={{
          marginTop: 200,
          bottom: 6,
          width: '100%'
        }}
        onValueChange={onValueChange}
        progress={progressSharedValue}
        minimumValue={minSharedValue}
        maximumValue={maxSharedValue}
      />
      <Text className='text-primary-dark text-2xl'>{text}</Text>
    </View>
  )
}

export default index

@xuergo xuergo changed the title Ability to disable animations Android animation lag Jun 13, 2024
@xuergo
Copy link
Author

xuergo commented Jun 13, 2024

I solved this problem using anti-shake, but it may not be the best answer

const debouncedSetDisplayValue = useCallback(
      debounce((value) => {
        const text = formatTime(value.toString())
        setProgressTimeText(text)
      }, 1),  
      []
    )

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant