Fab button animation - Reanimated 3

Description

This is a reusable and highly customizable Fab button animated components, that's using React Native Reanimated 3 Layout animation and `useAnimatedKeyboard` for handling keyboard visibility when TextInput are rendered as content. Elevate your app's aesthetics with this compact yet impactful animation, designed to enhance the overall look and user experience

Installation

bunx @animatereactnative/cli@latest add fab-button-animation-reanimated-3

npx @animatereactnative/cli@latest add fab-button-animation-reanimated-3

yarn @animatereactnative/cli@latest add fab-button-animation-reanimated-3

pnpm dlx @animatereactnative/cli@latest add fab-button-animation-reanimated-3

Preview

Dependencies

PackageVersion
@expo/vector-icons^15.0.2
expo-blur~15.0.7
randomcolor^0.6.2
react-native-reanimated~4.1.0

To install these dependencies, you can use the following command:

bun add @expo/vector-icons@"^15.0.2" expo-blur@"~15.0.7" randomcolor@"^0.6.2" react-native-reanimated@"~4.1.0"

npm install @expo/vector-icons@"^15.0.2" expo-blur@"~15.0.7" randomcolor@"^0.6.2" react-native-reanimated@"~4.1.0"

yarn install @expo/vector-icons@"^15.0.2" expo-blur@"~15.0.7" randomcolor@"^0.6.2" react-native-reanimated@"~4.1.0"

pnpm install @expo/vector-icons@"^15.0.2" expo-blur@"~15.0.7" randomcolor@"^0.6.2" react-native-reanimated@"~4.1.0"

Source code