LinearProgress

Expo UI LinearProgress 与官方 Jetpack Compose Progress Indicator API 一致，并以水平条的形式显示进度。

🌐 Expo UI LinearProgress matches the official Jetpack Compose Progress Indicator API and displays progress in a horizontal bar format.

安装

🌐 Installation

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

用法

🌐 Usage

不确定的进展

🌐 Indeterminate progress

当未提供 progress 时，进度指示器会显示一个不确定的动画条。

🌐 When no progress is provided, the progress indicator displays an indeterminate animating bar.

import { Host, LinearProgress } from '@expo/ui/jetpack-compose';

export default function IndeterminateLinearExample() {
  return (
    <Host matchContents>
      <LinearProgress />
    </Host>
  );
}

确定的进展

🌐 Determinate progress

提供一个介于 0 和 1 之间的 progress 值以显示确定进度。

🌐 Provide a progress value between 0 and 1 to show determinate progress.

import { Host, LinearProgress } from '@expo/ui/jetpack-compose';

export default function DeterminateLinearExample() {
  return (
    <Host matchContents>
      <LinearProgress progress={0.5} />
    </Host>
  );
}

波浪式进展

🌐 Wavy progress

LinearWavyProgress 渲染一个带有波浪动画风格的线性进度指示器。

import { Host, LinearWavyProgress } from '@expo/ui/jetpack-compose';

export default function LinearWavyExample() {
  return (
    <Host matchContents>
      <LinearWavyProgress progress={0.6} />
    </Host>
  );
}

应用接口

🌐 API

import { LinearProgress, LinearWavyProgress } from '@expo/ui/jetpack-compose';

Components

Types

Components

Types