react-scratch-me v1.0.5

A Scratch Card component for React

Demo

https://crowdland.github.io/react-scratch-me/

Installation

// using npm
npm install react-scratch-me --save
// using yarn
yarn add react-scratch-me

Sample usage

import React from "react";
import ScratchMe from "react-scratch-me";
import foregroundImageSrc from "./foreground.jpg";
import backgroundImageSrc from "./background.jpg";

const MyPage = () => (
	<ScratchMe
		width={400}
		height={300}
		foregroundImageSrc={foregroundImageSrc}
		backgroundImageSrc={backgroundImageSrc}
		strokeWidth={20}
		onProgress={percent => console.log(`${percent}% cleared`)}
		onCompleted={() => console.log(`Scratch Card Completed!`)}
		completedAt={30}
	/>
);

export default MyPage;

Properties