Spacer.md

Spacer

An invisible utility component that acts as a spacer element in various layouts. It works with flexbox sizing or fixed sizing.

Usage

import { Spacer } from '@pxblue/react-native-components';

<View style={{ display: 'flex' }}>
    {/* Left Content */}
    <Spacer />
    {/* Right Content */}
</View>;

Using flex elements (like Spacer) inside of a ScrollView will not have an effect unless the parent has a fixed height.

API

Prop Name	Description	Type	Required	Default
flex	Flex grow/shrink value for use in flex layouts	number	no	1
height	Height (in dp) for static layouts	number	no
width	Width (in dp) for static layouts	number	no

Any other props supplied will be provided to the root element (View).

Styles

You can override the classes used by PX Blue by passing a styles prop. It supports the following key:

Name	Description
root	Styles applied to the root element