Expo UI and Router for iOS
Modifiers

gridCellAnchor

Specifies a custom alignment anchor for a view that acts as a grid cell.

gridCellAnchor(anchor)

iOS 16+
ParameterTypeDescription
anchor{ anchor: 'center' | 'top' | 'bottom' | 'leading' | 'trailing' | 'topLeading' | 'topTrailing' | 'bottomLeading' | 'bottomTrailing' | 'zero', type: 'preset' } | { points: { x: number, y: number }, type: 'custom' }The unit point that defines how to align the view within the bounds of its grid cell.

Specifies a custom alignment anchor for a view that acts as a grid cell.

Returns: ModifierConfig

A view that uses the specified anchor point to align its content.

Example

// Using a preset anchor
<Rectangle
  modifiers={[
    gridCellAnchor({ type: 'preset', anchor: 'center' }),
  ]}
/>

// Using a custom anchor point
<Rectangle
  modifiers={[
    gridCellAnchor({ type: 'custom', points: { x: 0.3, y: 0.8 } }),
  ]}
/>

Works with

This modifier works with any view. These components accept it:

Sources

The original Expo docs for this page:

grayscale

Makes a view grayscale.

gridCellColumns

Tells a view that acts as a cell in a grid to span the specified number of columns.

On this page

gridCellAnchor(anchor)Works withSources