switch.tsx (1131451ed819ab870c19151c24ffbfcfa9968a09) switch.tsx (4da0658b1bf77de935d6a60ad1a26e4b92d13606)
1import React, {useEffect} from 'react';
2import {
3 StyleSheet,
4 SwitchProps,
5 TouchableWithoutFeedback,
6 View,
7} from 'react-native';
8import useColors from '@/hooks/useColors';
9import rpx from '@/utils/rpx';
10import Animated, {
11 useAnimatedStyle,
12 useSharedValue,
13 withTiming,
14} from 'react-native-reanimated';
15import {timingConfig} from '@/constants/commonConst';
16
17interface ISwitchProps extends SwitchProps {}
1import React, {useEffect} from 'react';
2import {
3 StyleSheet,
4 SwitchProps,
5 TouchableWithoutFeedback,
6 View,
7} from 'react-native';
8import useColors from '@/hooks/useColors';
9import rpx from '@/utils/rpx';
10import Animated, {
11 useAnimatedStyle,
12 useSharedValue,
13 withTiming,
14} from 'react-native-reanimated';
15import {timingConfig} from '@/constants/commonConst';
16
17interface ISwitchProps extends SwitchProps {}
18
18const fixedWidth = rpx(40);
19
20export default function ThemeSwitch(props: ISwitchProps) {
21 const {value, onValueChange} = props;
22 const colors = useColors();
23
24 const sharedValue = useSharedValue(value ? 1 : 0);
25
26 useEffect(() => {
19const fixedWidth = rpx(40);
20
21export default function ThemeSwitch(props: ISwitchProps) {
22 const {value, onValueChange} = props;
23 const colors = useColors();
24
25 const sharedValue = useSharedValue(value ? 1 : 0);
26
27 useEffect(() => {
27 sharedValue.value = withTiming(
28 value ? 1 : 0,
29 timingConfig.animationNormal,
30 );
28 sharedValue.value = value ? 1 : 0;
31 }, [value]);
32
33 const thumbStyle = useAnimatedStyle(() => {
34 return {
35 transform: [
36 {
29 }, [value]);
30
31 const thumbStyle = useAnimatedStyle(() => {
32 return {
33 transform: [
34 {
37 translateX: sharedValue.value * fixedWidth,
35 translateX: withTiming(
36 sharedValue.value * fixedWidth,
37 timingConfig.animationNormal,
38 ),
38 },
39 ],
40 };
41 });
42
43 return (
44 <TouchableWithoutFeedback
45 onPress={() => {

--- 33 unchanged lines hidden --- 		39 },
40 ],
41 };
42 });
43
44 return (
45 <TouchableWithoutFeedback
46 onPress={() => {

--- 33 unchanged lines hidden ---