react-native-snowfall 🌨️

react-native-snowfall is a library that provides an animated snowy background for your React Native applications. It utilizes the Reanimated and Skia Atlas libraries to create a smooth and efficient snow effect.

Installation ❄️

yarn

yarn add react-native-snowfall

Peer Dependencies 🔗

This library relies on the following peer dependencies. Make sure they are installed in your project:

yarn add react-native-reanimated @shopify/react-native-skia

Demo 💫

Usage 🎨

import React from 'react';
import { View } from 'react-native';
import { Snowfall } from 'react-native-snowfall';

const App = () => {
  return (
    <View style={{ flex: 1 }}>
      {/* Add the SnowFall component */}
      <Snowfall />
      {/* Rest of your app components */}
    </View>
  );
};

export default App;

Customization ✨

You can customize the snowfall effect by passing props to the Snowfall component:

import React from 'react';
import { View } from 'react-native';
import { Snowfall } from 'react-native-snowfall';

const App = () => {
  return (
    <View style={{ flex: 1 }}>
      <Snowfall
        count={100}
        duration={15000}
        minSize={5}
        maxSize={25}
        imageScale={0.5}
        imagePath={require('./assets/customSnowflake.png')}
      />
      {/* Rest of your app components */}
    </View>
  );
};

export default App;

Props 🎛️

Prop	Type	Default	Description
count	number	70	Number of snowflakes to display.
duration	number	10000	Duration of the snowfall animation in milliseconds.
minSize	number	10	Minimum size of the snowflakes.
maxSize	number	20	Maximum size of the snowflakes.
imageScale	number	0.7	Scale factor for the snowflake image.
imagePath	DataSourceParam	require('./snowflake.png')	Path to the snowflake image asset.
customImage	SkImage	undefined	Custom Skia image to use as snowflake. Overrides imagePath if provided.

Contributing 🙌

See the contributing guide to learn how to contribute to the repository and the development workflow.

License 📜

MIT

Made with react-native-builder-bob ❄️

Feel free to customize the snowfall effect and enjoy the winter magic in your React Native apps! 🎅