const Home = () => {
const colorScheme = useColorScheme();
const changeTheme = (e: GestureResponderEvent) => {
const theme = colorScheme === "dark" ? "light" : "dark";
e.currentTarget.measure((x1, y1, width, height, px, py) => {
switchTheme({
switchThemeFunction: () => {
Appearance.setColorScheme(theme);
},
animationConfig: {
type: theme === "dark" ? "circular" : "inverted-circular",
duration: 500,
startingPoint: {
cy: py + height / 2,
cx: px + width / 2,
},
},
});
});
};
return (
<View className="flex flex-1 items-center justify-center">
<Pressable
className="flex content-center rounded-full bg-blue-400 p-2"
onPress={changeTheme}
>
{colorScheme === "dark" ? <MoonIcon /> : <SunIcon />}
</Pressable>
</View>
);
};
export default Home;
