Добавление перехода к изменению цвета в React Native Slider Radio ⇐ IOS
Добавление перехода к изменению цвета в React Native Slider Radio
Я работаю над проектом React Native и использую компонент SliderPicker для выбора параметров. Компонент меняет цвет фона при выборе опции, но я хочу также добавить эффект плавного перехода к изменению цвета текста.
Вот компонент SliderPicker, который я использую:
import React, { использоватьЭффект, использоватьСсылка, useState } из «реагировать»; Импортировать { Текст, Вид, TouchableВыделение, МакетАнимация } из «реагировать-родной»; функция SliderPicker({ параметры, onOptionPick }) { const [pickedOption, PickOption] = useState([]); const optionsRef = useRef({}); const handleOptionPick = (ключ) => { const optionPressed = optionsRef.current; optionPressed[key].measure((x, y, ширина, высота, pageX, pageY) => { LayoutAnimation.configureNext({ продолжительность: 200, обновлять: { тип: LayoutAnimation.Types.easeInEaseOut, }, }); PickOption([ключ, ширина, страницаX]); }); }; возврат ( < View className = "flex-row items-center justify-between mt-2 mx-5 p-1.5 rounded-xl bg-midnightBlue" > < Просмотр className = "h-full Absolute Rounded-LG BG-majorelleBlue" стиль = { { слева: (pickedOption.length !== 0 && selectedOption[2] - 20), ширина: (pickedOption.length !== 0 && selectedOption[1]) } } /> { options.map((опция) => ( < Посмотреть имя класса = "flex-1" ключ = { option.key } ссылка = { (ссылка) => (optionsRef.current[option.key] = ref) } > < TouchableHighlight underlayColor = «прозрачный» onPress = { () => { handleOptionPick(option.key); console.log(option.key) } } > < Имя класса текста = { `py-0.5 текстовый центр шрифта-montsemi text-xl bg-transparent` } > { option.label } < /Текст> < /TouchableHighlight> < /Просмотр> )) } < /Просмотр> ); } экспортировать SliderPicker по умолчанию; Я уже добавил эффект перехода к изменению цвета фона, но не знаю, как добиться того же эффекта для цвета текста. Мы будем очень признательны за любые рекомендации или примеры кода по реализации этого перехода.
Заранее спасибо! кстати, я использую NativeWind
Я работаю над проектом React Native и использую компонент SliderPicker для выбора параметров. Компонент меняет цвет фона при выборе опции, но я хочу также добавить эффект плавного перехода к изменению цвета текста.
Вот компонент SliderPicker, который я использую:
import React, { использоватьЭффект, использоватьСсылка, useState } из «реагировать»; Импортировать { Текст, Вид, TouchableВыделение, МакетАнимация } из «реагировать-родной»; функция SliderPicker({ параметры, onOptionPick }) { const [pickedOption, PickOption] = useState([]); const optionsRef = useRef({}); const handleOptionPick = (ключ) => { const optionPressed = optionsRef.current; optionPressed[key].measure((x, y, ширина, высота, pageX, pageY) => { LayoutAnimation.configureNext({ продолжительность: 200, обновлять: { тип: LayoutAnimation.Types.easeInEaseOut, }, }); PickOption([ключ, ширина, страницаX]); }); }; возврат ( < View className = "flex-row items-center justify-between mt-2 mx-5 p-1.5 rounded-xl bg-midnightBlue" > < Просмотр className = "h-full Absolute Rounded-LG BG-majorelleBlue" стиль = { { слева: (pickedOption.length !== 0 && selectedOption[2] - 20), ширина: (pickedOption.length !== 0 && selectedOption[1]) } } /> { options.map((опция) => ( < Посмотреть имя класса = "flex-1" ключ = { option.key } ссылка = { (ссылка) => (optionsRef.current[option.key] = ref) } > < TouchableHighlight underlayColor = «прозрачный» onPress = { () => { handleOptionPick(option.key); console.log(option.key) } } > < Имя класса текста = { `py-0.5 текстовый центр шрифта-montsemi text-xl bg-transparent` } > { option.label } < /Текст> < /TouchableHighlight> < /Просмотр> )) } < /Просмотр> ); } экспортировать SliderPicker по умолчанию; Я уже добавил эффект перехода к изменению цвета фона, но не знаю, как добиться того же эффекта для цвета текста. Мы будем очень признательны за любые рекомендации или примеры кода по реализации этого перехода.
Заранее спасибо! кстати, я использую NativeWind
-
- Похожие темы
- Ответы
- Просмотры
- Последнее сообщение
-
-
Изменение цвета изображения приводит к изменению его размера, занимая весь экран.
Anonymous » » в форуме C# - 0 Ответы
- 18 Просмотры
-
Последнее сообщение Anonymous
-