Styled Native Keyboard Avoiding View
This component is build on React Native Keyboard Avoiding View which is a component to solve the common problem of views that need to move out of the way of the virtual keyboard. It can automatically adjust either its position or bottom padding based on the position of the keyboard.
Usage
App.tsx
import { StyledWindKeyboardAvoidingView } from "expo-nativewind-components";
export default function App() {
return (
<StyledWindKeyboardAvoidingView
behavior={Platform.OS === "ios" ? "padding" : "height"}
className=" flex-1 w-full justify-center items-center bg-fuchsia-500"
>
{/* Your content here */}
</StyledWindKeyboardAvoidingView>
);
}
Props Reference
You can find all the possible props that you can pass to the StyledWindKeyboardAvoidingView
component below from the official React Native documentation (opens in a new tab).