This is documentation for the next SDK version. For up-to-date documentation, see the latest version (SDK 56).

For the complete documentation index, see llms.txt. Use this file to discover all available pages.

一个与 @react-native-community/slider API 兼容的 Slider 组件。它在 Android 上使用 Material 3 Slider，在 iOS 上使用 SwiftUI Slider，在 Web 上使用原生的 <input type="range"> 元素。

在底层，这个组件封装了平台特定的 @expo/ui 基础组件：

• Android: Jetpack Compose Slider
• iOS: SwiftUI Slider

如果你需要更底层的控制，请直接使用这些基础组件。

安装

If you are installing this in an existing React Native app, make sure to install expo in your project.

从 @react-native-community/slider 迁移

• 将导入从 import Slider from '@react-native-community/slider' 更新为 import Slider from '@expo/ui/community/slider'。
• onSlidingStart、onSlidingComplete、tapToSeek、StepMarker、renderStepNumber、thumbImage、minimumTrackImage、maximumTrackImage、trackImage、accessibilityUnits、accessibilityIncrements、testID 和 ref.updateValue 目前还不受支持。
• 在 iOS 上，maximumTrackTintColor 和 thumbTintColor 不会产生视觉效果——SwiftUI 的 Slider 只暴露最小（激活）轨道的颜色。minimumTrackTintColor 在两个平台上都可用。

基本用法

import { useState } from 'react';
import { Text, View } from 'react-native';
import Slider from '@expo/ui/community/slider';

export default function SliderExample() {
  const [value, setValue] = useState(0.5);

  return (
    <View>
      <Slider value={value} onValueChange={setValue} />
      <Text>值: {value.toFixed(3)}</Text>
    </View>
  );
}

API

import Slider from '@expo/ui/community/slider';

Component