itsramiel

import { StatusBar } from "expo-status-bar";
import { StyleSheet, Pressable, View } from "react-native";

const FAB_SIZE = 70;
const INITIAL_COLOR = "#d00000";
const FINAL_COLOR = "#4BB543";

export default function App() {
  return (
    <View style={styles.container}>

itsramiel

<Pressable
        style={styles.fabContainer}
        onPress={() => (progress.value = 1)}
        onLongPress={() => (progress.value = 0)}
      ></Pressable>

itsramiel

const FabStyle = useAnimatedStyle(() => {
    return { backgroundColor: interpolateColor(progress.value, [0, 1], [INITIAL_COLOR, FINAL_COLOR])}
  }, [])

itsramiel

const FAB_SIZE = 70;
const INITIAL_COLOR = "#d00000";
const FINAL_COLOR = "#4BB543";

const AnimatedPressable = Animated.createAnimatedComponent(Pressable);

export default function App() {
  const progress = useSharedValue<0 | 1>(0);

  const FabStyle = useAnimatedStyle(() => {

itsramiel

const style1 = useAnimatedStyle(() => {
    return {
      width: VIEW_WIDTH,
      height: VIEW_HEIGHT,
      backgroundColor: "white",
      position: "absolute",
      top: FAB_SIZE / 2 - VIEW_HEIGHT / 2,
      left: FAB_SIZE / 2 - VIEW_WIDTH / 2,
    };
  }, []);

itsramiel

const style2 = useAnimatedStyle(() => {
    return {
      width: VIEW_HEIGHT,
      height: VIEW_WIDTH,
      backgroundColor: "white",
      position: "absolute",
      top: FAB_SIZE / 2 - VIEW_HEIGHT / 2,
      left: FAB_SIZE / 2 - VIEW_WIDTH / 2
    };
  }, []);

itsramiel

const style1 = useAnimatedStyle(() => {
    const degress = interpolate(progress.value, [0, 1], [0, 50]);
    return {
      width: VIEW_WIDTH,
      height: VIEW_HEIGHT,
      backgroundColor: "white",
      position: "absolute",
      top: FAB_SIZE / 2 - VIEW_HEIGHT / 2,
      left: FAB_SIZE / 2 - VIEW_WIDTH / 2,
      transform: [{ rotate: `${degress}deg` }],

itsramiel

const style2 = useAnimatedStyle(() => {
    const SHORTENED_HEIGHT = VIEW_HEIGHT * 0.3;
    const width = interpolate(
      progress.value,
      [0, 1],
      [VIEW_HEIGHT, SHORTENED_HEIGHT]
    );
    const deg = interpolate(progress.value, [0, 1], [0, 50]);
    const translateY = interpolate(
      progress.value,