Skip to content

Commit 13cf1d3

Browse files
nilavanrajnilavanraj
authored
Update README.md
1 parent 29e9e49 commit 13cf1d3

File tree

1 file changed

+139
-20
lines changed

1 file changed

+139
-20
lines changed

‎README.md

Lines changed: 139 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,13 @@
11
# react-native-custom-timer-notification
22

3-
Custom timer notification for React Native Android 🔔
4-
Now version 0.8 Supports full size custom notifications
5-
![ezgif com-gif-maker](https://user-images.githubusercontent.com/58332892/208312749-58586dba-da62-4531-85bb-62346a57aa03.gif)
6-
7-
![ezgif com-gif-maker](https://user-images.githubusercontent.com/58332892/166133982-effe321c-a0fd-4315-bb29-cc7ee29d0bd4.gif)
3+
Custom timer notification for React Native Android 🔔<br>
4+
**Now version 0.8 Supports full size custom notifications** <br>
5+
<p align="center">
6+
<img src="https://user-images.githubusercontent.com/58332892/208312749-58586dba-da62-4531-85bb-62346a57aa03.gif">
7+
</p>
8+
<p align="center">
9+
<img width="80%" src="https://user-images.githubusercontent.com/58332892/166133982-effe321c-a0fd-4315-bb29-cc7ee29d0bd4.gif">
10+
</p>
811

912

1013
## Installation
@@ -25,38 +28,154 @@ AndroidManifest
2528
<service android:name="com.reactnativecustomtimernotification.ForegroundService"/>
2629
```
2730
## Usage
28-
```payload``` sent will be received when click or canceled <br>
29-
```title``` Title of the notification <br>
30-
```body``` Body of the notification <br>
31-
```id``` unique number <br>
32-
```date``` Time at which zero comes <br>
31+
### Timer notification
32+
33+
Only Timer notifiction with default Title and body
3334
```js
34-
import { TimerNotification, onEvent } from "react-native-custom-timer-notification";
3535

36-
// ...
36+
import { TimerNotification } from "react-native-custom-timer-notification";
37+
```
38+
39+
| Property | Description |
40+
| --- | --- |
41+
| `payload` | sent data will be received when click or canceled |
42+
| `title` |Title of the notification|
43+
| `body` |Body of the notification |
44+
| `id` |unique number|
45+
| `date` |Time at which zero comes|
46+
3747

3848
// onclick and cancel listner
39-
onEvent(event=>{
40-
console.log(event)
41-
});
4249

43-
// Remove timer
44-
RemoveTimer(160211114);
4550

46-
//Trigger notification
51+
52+
#### Example
53+
54+
```js
55+
4756
TimerNotification({
48-
payload: JSON.stringify('notificationOpen?.data'),
57+
payload: JSON.stringify('notification.data'),
4958
title: 'My notification',
5059
body: 'Much longer text that cannot fit one line... ',
51-
id: 160211114,
60+
id: 1,
5261
remove: false, // optional
5362
foreground: false,
5463
date: new Date(Date.now() + 20000),
5564
isCountDown: true, // false for positive timer
5665
setCustomContentView:true // optional
5766
});
67+
5868
```
69+
<h3>Full custom notification </h3>
70+
71+
Full custom notifiction with custom image, text and cronometer.
72+
```js
73+
74+
import { CustomNotification, TYPES, FB_TYPE } from "react-native-custom-timer-notification";
75+
```
76+
77+
| Property | Description |
78+
| --- | --- |
79+
| `eventData` | sent data will be received when click or canceled |
80+
| `title` |Title of the notification|
81+
| `body` |Body of the notification |
82+
| `id` |unique number|
83+
| `View` |View that needs to be added (Array)|
84+
85+
<h3> View Properties </h3>
5986

87+
| Property | Description |
88+
| --- | --- |
89+
| `name` | text that needs to be displayed |
90+
| `size` |Size of text|
91+
| `type` |Type of view (Text,Image, Cronometer) |
92+
| `bold` |Font (NORMAL,BOLD,ITALIC,BOLD_ITALIC)|
93+
| `uri` |Image in base64|
94+
| `PaddingLeft` |Left Padding|
95+
| `PaddingTop` |PaddingTop|
96+
| `PaddingRight` |PaddingRight|
97+
| `PaddingBottom` |PaddingBottom|
98+
| `color` |Text color|
99+
| `ZeroTime` |Time at which zero comes|
100+
101+
#### Example
102+
103+
```js
104+
105+
CustomNotification(
106+
{
107+
eventData: JSON.stringify('notificationOpen?.data'),
108+
title: 'notificationOpen.data.title',
109+
body: ' notificationOpen.data.body',
110+
id: 1,
111+
112+
View: [
113+
{
114+
name: 'Limited Sales',
115+
size: 20,
116+
type: TYPES.Text,
117+
bold: FB_TYPE.BOLD_ITALIC,
118+
PaddingLeft: 10,
119+
PaddingTop: 50,
120+
PaddingRight: 0,
121+
PaddingBottom: 0,
122+
setViewVisibility: false,
123+
color: '#ed1a45',
124+
},
125+
{
126+
uri: image,
127+
type: TYPES.Image,
128+
PaddingLeft: 0,
129+
PaddingTop: 0,
130+
PaddingRight: 0,
131+
PaddingBottom: 0,
132+
},
133+
{
134+
name: 'Buy now',
135+
size: 30,
136+
type: TYPES.Text,
137+
bold: FB_TYPE.BOLD_ITALIC,
138+
PaddingLeft: 10,
139+
PaddingTop: 100,
140+
PaddingRight: 0,
141+
PaddingBottom: 0,
142+
setViewVisibility: false,
143+
color: '#fbd335',
144+
},
145+
{
146+
type: TYPES.Cronometer,
147+
size: 30,
148+
ZeroTime: new Date(Date.now() + 20000),
149+
PaddingLeft: 800,
150+
color: '#0000FF',
151+
PaddingTop: 0,
152+
PaddingRight: 0,
153+
PaddingBottom: 0,
154+
},
155+
],
156+
},
157+
(e: any) => {
158+
console.log(e);
159+
}
160+
);
161+
162+
```
163+
### Remove Notifications
164+
```js
165+
import { RemoveTimer } from "react-native-custom-timer-notification";
166+
167+
RemoveTimer(1);
168+
169+
```
170+
### onclick and cancel listner
171+
```js
172+
import { onEvent } from "react-native-custom-timer-notification";
173+
174+
onEvent(event=>{
175+
console.log(event)
176+
});
177+
178+
```
60179
## Contributing
61180

62181
See the [contributing guide](CONTRIBUTING.md) to learn how to contribute to the repository and the development workflow.

0 commit comments

Comments
 (0)