proton-native/docs/component_APIs/grid_components.md

Grid Children

A child in a Grid component. Can specify the location in the grid, as well as additional formatting.

import React, { Component } from 'react';

import { render, Window, App, Grid, Button, TextInput } from 'proton-native';

class Example extends Component {
  render() {
    return (
      <App>
        <Window title="Example" size={{w: 500, h: 500}}>
          <Grid padded={true}>
            <Button row={0} column={0}>
              Hello
            </Button>
            <TextInput row={0} column={1}>
              Hi
            </TextInput>
          </Grid>
        </Window>
      </App>
    );
  }
}

render(<Example />);

Props

• column
• row
• span
• expand
• align

Reference

column

What column the component resides in.

Type	Required	Default
number	No	0

row

What row the component resides in.

Type	Required	Default
number	No	0

span

How many rows/columns the component takes off.

Type	Required	Default
object {x: number, y: number}	No	{x: 1, y: 1}

expand

Whether the component can expand in the direction.

Type	Required	Default
object {h: bool, v: bool}	No	{h: true, v: true}

align

Whether the component is aligned with the other components in the column/row.

Type	Required	Default
object {h: bool, v: bool}	No	{h: true, v: true}