Learn how to use the useBreakpointValue hook to manage breaking point values, breakpoint components in Expo, React & React Native for responsive design. This is an illustration of useBreakPointValue hook.
To use this component in your project, include the following import statement in your file.

import { useBreakPointValue } from '@gluestack-ui/utils/hooks';

const flexDir = useBreakpointValue({
 default: 'column',
 sm: 'row',
});

Hook Arguments

This section provides a comprehensive reference list for the hook arguments, detailing descriptions, properties, types, and default behavior for easy project integration.

useBreakPointValue

Name	Type	Default
options	Record<breakPoints \| default,value>	-

Return Value

The useBreakPointValue hook returns value, based on given break point value object.

Edit this page on GitHub

URL: https://gluestack.io/ui/docs/hooks/use-break-point-value

⇱ gluestack-ui useBreakpoint Component | Breakpoint Values Installation

useBreakpointValue

Hook Arguments

useBreakPointValue

Return Value