间隔器

一个用于灵活间距的 SwiftUI Spacer 组件。

iOS

tvOS

GitHub

npm

更新日志

Bundled version:

~55.0.0-beta.0

Expo UI Spacer 与官方 SwiftUI Spacer API 保持一致，并会扩展以填充栈中的可用空间。

安装

Terminal

- npx expo install @expo/ui

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

用法

HStack 中的基础 Spacer

使用 Spacer 将内容推到水平栈的两端。

SpacerHStackExample.tsx

import { Host, HStack, Text, Spacer } from '@expo/ui/swift-ui';

export default function SpacerHStackExample() {
  return (
    <Host style={{ flex: 1 }}>
      <HStack>
        <Text>左</Text>
        <Spacer />
        <Text>右</Text>
      </HStack>
    </Host>
  );
}

VStack 中的基础 Spacer

使用 Spacer 将内容推到垂直栈的两端。

SpacerVStackExample.tsx

import { Host, VStack, Text, Spacer } from '@expo/ui/swift-ui';

export default function SpacerVStackExample() {
  return (
    <Host style={{ flex: 1 }}>
      <VStack>
        <Text>顶部</Text>
        <Spacer />
        <Text>底部</Text>
      </VStack>
    </Host>
  );
}

API

import { Spacer } from '@expo/ui/swift-ui';

Component

`Spacer`

iOS

tvOS

Type: React.Element<SpacerProps>

SpacerProps

`minLength`

iOS

tvOS

Optional • Type: number

The minimum length of the spacer. This is the minimum amount of space that the spacer will take up.

Inherited Props

CommonViewModifierProps