Layout@knitui/components
KeyboardAwareScrollView
KeyboardAwareScrollView is a cross-platform form primitive. On native it scrolls so the focused field stays above the on-screen keyboard (via bottomOffset / extraKeyboardSpace); on web there is no keyboard to scroll around, so it renders as a plain scrollable Box and the native-only props are accepted but stripped. contentContainerStyle is applied to an inner wrapper, matching the native ScrollView content container.
import { KeyboardAwareScrollView } from "@knitui/components";Playground
Loading playground…
<KeyboardAwareScrollView />Examples
Long Form
A long scrollable form — the canonical use-case. Focus a field near the bottom on native to see it scroll above the keyboard.
Loading example…
Props
| Prop | Type | Default | Description |
|---|---|---|---|
bottomOffset | number | undefined | — | Extra space (native only) kept between the focused field and the keyboard. |
contentContainerStyle | Falsy | (ViewStyle | CSSProperties | (CSSProperties & ViewStyle)) | RegisteredStyle<ViewStyle | CSSProperties | (CSSProperties & ViewStyle)> | RecursiveArray<Falsy | (ViewStyle | CSSProperties | (CSSProperties & ViewStyle)) | RegisteredStyl… | — | |
disabled system | boolean | undefined | — | |
disableScrollOnKeyboardHide | boolean | undefined | — | |
enabled | boolean | undefined | — | Toggle keyboard-aware scrolling (native only). |
extraKeyboardSpace | number | undefined | — | Additional space (native only) added above the keyboard. |
horizontal | boolean | undefined | — | |
keyboardShouldPersistTaps | boolean | "always" | "never" | "handled" | undefined | — | |
mode | string | undefined | — | |
ScrollViewComponent | unknown | — | |
shadow system | "xs" | "sm" | "md" | "lg" | "xl" | "xxs" | "xxl" | undefined | — | |
showsHorizontalScrollIndicator | boolean | undefined | — | |
showsVerticalScrollIndicator | boolean | undefined | — | |
theme system | ThemeName | null | undefined | — | Applies a theme to this element |
Accessibility & DOM props (2)
| Prop | Type |
|---|---|
key | Key | null | undefined |
ref | Ref<TamaguiElement> | undefined |
Plus 498 inherited style props from Box — the full Tamagui/React Native style surface, including token shorthands like p, mx, bg and c. See Tokens for the scales they accept, or the full list.