Add sample alarm button
This commit is contained in:
parent
d0fefd7273
commit
73ce91f111
148
App.tsx
148
App.tsx
|
@ -1,116 +1,66 @@
|
||||||
/**
|
import React, {useState} from 'react';
|
||||||
* Sample React Native App
|
|
||||||
* https://github.com/facebook/react-native
|
|
||||||
*
|
|
||||||
* Generated with the TypeScript template
|
|
||||||
* https://github.com/react-native-community/react-native-template-typescript
|
|
||||||
*
|
|
||||||
* @format
|
|
||||||
*/
|
|
||||||
|
|
||||||
import React from 'react';
|
|
||||||
import {
|
import {
|
||||||
|
Button,
|
||||||
SafeAreaView,
|
SafeAreaView,
|
||||||
ScrollView,
|
|
||||||
StatusBar,
|
StatusBar,
|
||||||
StyleSheet,
|
TextInput,
|
||||||
Text,
|
|
||||||
useColorScheme,
|
useColorScheme,
|
||||||
|
Vibration,
|
||||||
View,
|
View,
|
||||||
} from 'react-native';
|
} from 'react-native';
|
||||||
|
import BackgroundTimer from 'react-native-background-timer';
|
||||||
import {
|
import {Notifications} from 'react-native-notifications';
|
||||||
Colors,
|
import Sound from 'react-native-sound';
|
||||||
DebugInstructions,
|
|
||||||
Header,
|
|
||||||
LearnMoreLinks,
|
|
||||||
ReloadInstructions,
|
|
||||||
} from 'react-native/Libraries/NewAppScreen';
|
|
||||||
|
|
||||||
const Section: React.FC<{
|
|
||||||
children: React.ReactNode;
|
|
||||||
title: string;
|
|
||||||
}> = ({children, title}) => {
|
|
||||||
const isDarkMode = useColorScheme() === 'dark';
|
|
||||||
return (
|
|
||||||
<View style={styles.sectionContainer}>
|
|
||||||
<Text
|
|
||||||
style={[
|
|
||||||
styles.sectionTitle,
|
|
||||||
{
|
|
||||||
color: isDarkMode ? Colors.white : Colors.black,
|
|
||||||
},
|
|
||||||
]}>
|
|
||||||
{title}
|
|
||||||
</Text>
|
|
||||||
<Text
|
|
||||||
style={[
|
|
||||||
styles.sectionDescription,
|
|
||||||
{
|
|
||||||
color: isDarkMode ? Colors.light : Colors.dark,
|
|
||||||
},
|
|
||||||
]}>
|
|
||||||
{children}
|
|
||||||
</Text>
|
|
||||||
</View>
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
const App = () => {
|
const App = () => {
|
||||||
const isDarkMode = useColorScheme() === 'dark';
|
const dark = useColorScheme() === 'dark';
|
||||||
|
const alarm = new Sound('argon.mp3', Sound.MAIN_BUNDLE, error => {
|
||||||
|
if (error) throw new Error(error);
|
||||||
|
});
|
||||||
|
const [timer, setTimer] = useState('0');
|
||||||
|
|
||||||
const backgroundStyle = {
|
Notifications.registerRemoteNotifications();
|
||||||
backgroundColor: isDarkMode ? Colors.darker : Colors.lighter,
|
Notifications.events().registerNotificationOpened(
|
||||||
|
(notification, completion) => {
|
||||||
|
console.log('Notification opened:', notification);
|
||||||
|
alarm.stop();
|
||||||
|
Vibration.cancel();
|
||||||
|
completion();
|
||||||
|
},
|
||||||
|
);
|
||||||
|
|
||||||
|
const press = () => {
|
||||||
|
BackgroundTimer.setTimeout(() => {
|
||||||
|
alarm.play(_onEnd => Vibration.cancel());
|
||||||
|
Vibration.vibrate([0, 400, 600], /*repeat=*/ true);
|
||||||
|
Notifications.postLocalNotification({
|
||||||
|
title: 'title',
|
||||||
|
body: 'body',
|
||||||
|
badge: 1,
|
||||||
|
identifier: 'identifier',
|
||||||
|
payload: {},
|
||||||
|
sound: 'sound',
|
||||||
|
thread: 'thread',
|
||||||
|
type: 'type',
|
||||||
|
});
|
||||||
|
}, Number(timer));
|
||||||
};
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<SafeAreaView style={backgroundStyle}>
|
<SafeAreaView style={{flex: 1}}>
|
||||||
<StatusBar barStyle={isDarkMode ? 'light-content' : 'dark-content'} />
|
<StatusBar barStyle={dark ? 'light-content' : 'dark-content'} />
|
||||||
<ScrollView
|
<View
|
||||||
contentInsetAdjustmentBehavior="automatic"
|
style={{
|
||||||
style={backgroundStyle}>
|
margin: 10,
|
||||||
<Header />
|
alignItems: 'center',
|
||||||
<View
|
}}>
|
||||||
style={{
|
<TextInput placeholder="Timer" value={timer} onChangeText={setTimer} />
|
||||||
backgroundColor: isDarkMode ? Colors.black : Colors.white,
|
</View>
|
||||||
}}>
|
<View style={{margin: 30, marginTop: 'auto'}}>
|
||||||
<Section title="Step One">
|
<Button title="Run timer" onPress={press} />
|
||||||
Edit <Text style={styles.highlight}>App.tsx</Text> to change this
|
</View>
|
||||||
screen and then come back to see your edits.
|
|
||||||
</Section>
|
|
||||||
<Section title="See Your Changes">
|
|
||||||
<ReloadInstructions />
|
|
||||||
</Section>
|
|
||||||
<Section title="Debug">
|
|
||||||
<DebugInstructions />
|
|
||||||
</Section>
|
|
||||||
<Section title="Learn More">
|
|
||||||
Read the docs to discover what to do next:
|
|
||||||
</Section>
|
|
||||||
<LearnMoreLinks />
|
|
||||||
</View>
|
|
||||||
</ScrollView>
|
|
||||||
</SafeAreaView>
|
</SafeAreaView>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
const styles = StyleSheet.create({
|
|
||||||
sectionContainer: {
|
|
||||||
marginTop: 32,
|
|
||||||
paddingHorizontal: 24,
|
|
||||||
},
|
|
||||||
sectionTitle: {
|
|
||||||
fontSize: 24,
|
|
||||||
fontWeight: '600',
|
|
||||||
},
|
|
||||||
sectionDescription: {
|
|
||||||
marginTop: 8,
|
|
||||||
fontSize: 18,
|
|
||||||
fontWeight: '400',
|
|
||||||
},
|
|
||||||
highlight: {
|
|
||||||
fontWeight: '700',
|
|
||||||
},
|
|
||||||
});
|
|
||||||
|
|
||||||
export default App;
|
export default App;
|
||||||
|
|
|
@ -135,6 +135,7 @@ android {
|
||||||
|
|
||||||
defaultConfig {
|
defaultConfig {
|
||||||
applicationId "com.massive"
|
applicationId "com.massive"
|
||||||
|
missingDimensionStrategy "RNNotifications.reactNativeVersion", "reactNative60"
|
||||||
minSdkVersion rootProject.ext.minSdkVersion
|
minSdkVersion rootProject.ext.minSdkVersion
|
||||||
targetSdkVersion rootProject.ext.targetSdkVersion
|
targetSdkVersion rootProject.ext.targetSdkVersion
|
||||||
versionCode 1
|
versionCode 1
|
||||||
|
@ -261,6 +262,7 @@ dependencies {
|
||||||
//noinspection GradleDynamicVersion
|
//noinspection GradleDynamicVersion
|
||||||
implementation "com.facebook.react:react-native:+" // From node_modules
|
implementation "com.facebook.react:react-native:+" // From node_modules
|
||||||
|
|
||||||
|
implementation project(':react-native-notifications');
|
||||||
implementation "androidx.swiperefreshlayout:swiperefreshlayout:1.0.0"
|
implementation "androidx.swiperefreshlayout:swiperefreshlayout:1.0.0"
|
||||||
|
|
||||||
debugImplementation("com.facebook.flipper:flipper:${FLIPPER_VERSION}") {
|
debugImplementation("com.facebook.flipper:flipper:${FLIPPER_VERSION}") {
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
|
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
|
||||||
package="com.massive">
|
package="com.massive">
|
||||||
|
|
||||||
<uses-permission android:name="android.permission.INTERNET" />
|
<uses-permission android:name="android.permission.VIBRATE" />
|
||||||
|
|
||||||
<application
|
<application
|
||||||
android:name=".MainApplication"
|
android:name=".MainApplication"
|
||||||
|
|
|
@ -12,6 +12,7 @@ import com.facebook.soloader.SoLoader;
|
||||||
import com.massive.newarchitecture.MainApplicationReactNativeHost;
|
import com.massive.newarchitecture.MainApplicationReactNativeHost;
|
||||||
import java.lang.reflect.InvocationTargetException;
|
import java.lang.reflect.InvocationTargetException;
|
||||||
import java.util.List;
|
import java.util.List;
|
||||||
|
import com.wix.reactnativenotifications.RNNotificationsPackage;
|
||||||
|
|
||||||
public class MainApplication extends Application implements ReactApplication {
|
public class MainApplication extends Application implements ReactApplication {
|
||||||
|
|
||||||
|
@ -28,6 +29,7 @@ public class MainApplication extends Application implements ReactApplication {
|
||||||
List<ReactPackage> packages = new PackageList(this).getPackages();
|
List<ReactPackage> packages = new PackageList(this).getPackages();
|
||||||
// Packages that cannot be autolinked yet can be added manually here, for example:
|
// Packages that cannot be autolinked yet can be added manually here, for example:
|
||||||
// packages.add(new MyReactNativePackage());
|
// packages.add(new MyReactNativePackage());
|
||||||
|
packages.add(new RNNotificationsPackage(MainApplication.this));
|
||||||
return packages;
|
return packages;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
BIN
android/app/src/main/res/raw/argon.mp3
Normal file
BIN
android/app/src/main/res/raw/argon.mp3
Normal file
Binary file not shown.
|
@ -2,6 +2,8 @@ rootProject.name = 'massive'
|
||||||
apply from: file("../node_modules/@react-native-community/cli-platform-android/native_modules.gradle"); applyNativeModulesSettingsGradle(settings)
|
apply from: file("../node_modules/@react-native-community/cli-platform-android/native_modules.gradle"); applyNativeModulesSettingsGradle(settings)
|
||||||
include ':app'
|
include ':app'
|
||||||
includeBuild('../node_modules/react-native-gradle-plugin')
|
includeBuild('../node_modules/react-native-gradle-plugin')
|
||||||
|
include ':react-native-notifications'
|
||||||
|
project(':react-native-notifications').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-notifications/lib/android/app')
|
||||||
|
|
||||||
if (settings.hasProperty("newArchEnabled") && settings.newArchEnabled == "true") {
|
if (settings.hasProperty("newArchEnabled") && settings.newArchEnabled == "true") {
|
||||||
include(":ReactAndroid")
|
include(":ReactAndroid")
|
||||||
|
|
|
@ -10,8 +10,12 @@
|
||||||
"lint": "eslint . --ext .js,.jsx,.ts,.tsx"
|
"lint": "eslint . --ext .js,.jsx,.ts,.tsx"
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
|
"@types/react-native-background-timer": "^2.0.0",
|
||||||
"react": "18.0.0",
|
"react": "18.0.0",
|
||||||
"react-native": "0.69.1"
|
"react-native": "0.69.1",
|
||||||
|
"react-native-background-timer": "^2.4.1",
|
||||||
|
"react-native-notifications": "^4.3.1",
|
||||||
|
"react-native-sound": "^0.11.2"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"@babel/core": "^7.12.9",
|
"@babel/core": "^7.12.9",
|
||||||
|
|
20
yarn.lock
20
yarn.lock
|
@ -1416,6 +1416,11 @@
|
||||||
resolved "https://registry.yarnpkg.com/@types/prop-types/-/prop-types-15.7.5.tgz#5f19d2b85a98e9558036f6a3cacc8819420f05cf"
|
resolved "https://registry.yarnpkg.com/@types/prop-types/-/prop-types-15.7.5.tgz#5f19d2b85a98e9558036f6a3cacc8819420f05cf"
|
||||||
integrity sha512-JCB8C6SnDoQf0cNycqd/35A7MjcnK+ZTqE7judS6o7utxUCg6imJg3QK2qzHKszlTjcj2cn+NwMB2i96ubpj7w==
|
integrity sha512-JCB8C6SnDoQf0cNycqd/35A7MjcnK+ZTqE7judS6o7utxUCg6imJg3QK2qzHKszlTjcj2cn+NwMB2i96ubpj7w==
|
||||||
|
|
||||||
|
"@types/react-native-background-timer@^2.0.0":
|
||||||
|
version "2.0.0"
|
||||||
|
resolved "https://registry.yarnpkg.com/@types/react-native-background-timer/-/react-native-background-timer-2.0.0.tgz#c44c57f8fbca9d9d5521fdd72a8f55232b79381e"
|
||||||
|
integrity sha512-y5VW82dL/ESOLg+5QQHyBdsFVA4ZklENxmOyxv8o06T+3HBG2JOSuz/CIPz1vKdB7dmWDGPZNuPosdtnp+xv2A==
|
||||||
|
|
||||||
"@types/react-native@^0.69.0":
|
"@types/react-native@^0.69.0":
|
||||||
version "0.69.1"
|
version "0.69.1"
|
||||||
resolved "https://registry.yarnpkg.com/@types/react-native/-/react-native-0.69.1.tgz#580ee9ab6557c8f5ad76bf5ab915689ca0faecfe"
|
resolved "https://registry.yarnpkg.com/@types/react-native/-/react-native-0.69.1.tgz#580ee9ab6557c8f5ad76bf5ab915689ca0faecfe"
|
||||||
|
@ -5624,6 +5629,11 @@ react-is@^16.13.1:
|
||||||
resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.13.1.tgz#789729a4dc36de2999dc156dd6c1d9c18cea56a4"
|
resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.13.1.tgz#789729a4dc36de2999dc156dd6c1d9c18cea56a4"
|
||||||
integrity sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==
|
integrity sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==
|
||||||
|
|
||||||
|
react-native-background-timer@^2.4.1:
|
||||||
|
version "2.4.1"
|
||||||
|
resolved "https://registry.yarnpkg.com/react-native-background-timer/-/react-native-background-timer-2.4.1.tgz#a3bc1cafa8c1e3aeefd0611de120298b67978a0f"
|
||||||
|
integrity sha512-TE4Kiy7jUyv+hugxDxitzu38sW1NqjCk4uE5IgU2WevLv7sZacaBc6PZKOShNRPGirLl1NWkaG3LDEkdb9Um5g==
|
||||||
|
|
||||||
react-native-codegen@^0.69.1:
|
react-native-codegen@^0.69.1:
|
||||||
version "0.69.1"
|
version "0.69.1"
|
||||||
resolved "https://registry.yarnpkg.com/react-native-codegen/-/react-native-codegen-0.69.1.tgz#3632be2f24464e6fad8dd11a25d1b6f3bc2c7d0b"
|
resolved "https://registry.yarnpkg.com/react-native-codegen/-/react-native-codegen-0.69.1.tgz#3632be2f24464e6fad8dd11a25d1b6f3bc2c7d0b"
|
||||||
|
@ -5639,6 +5649,16 @@ react-native-gradle-plugin@^0.0.7:
|
||||||
resolved "https://registry.yarnpkg.com/react-native-gradle-plugin/-/react-native-gradle-plugin-0.0.7.tgz#96602f909745239deab7b589443f14fce5da2056"
|
resolved "https://registry.yarnpkg.com/react-native-gradle-plugin/-/react-native-gradle-plugin-0.0.7.tgz#96602f909745239deab7b589443f14fce5da2056"
|
||||||
integrity sha512-+4JpbIx42zGTONhBTIXSyfyHICHC29VTvhkkoUOJAh/XHPEixpuBduYgf6Y4y9wsN1ARlQhBBoptTvXvAFQf5g==
|
integrity sha512-+4JpbIx42zGTONhBTIXSyfyHICHC29VTvhkkoUOJAh/XHPEixpuBduYgf6Y4y9wsN1ARlQhBBoptTvXvAFQf5g==
|
||||||
|
|
||||||
|
react-native-notifications@^4.3.1:
|
||||||
|
version "4.3.1"
|
||||||
|
resolved "https://registry.yarnpkg.com/react-native-notifications/-/react-native-notifications-4.3.1.tgz#ad9a8e6881bc17cf03ef16d4dfdaee9ec8bb721d"
|
||||||
|
integrity sha512-A668d+Q0/VQRjmrh+LvDpc/REA8GXgwCijXDCIlDHGMK8enmrtdxY5OANQf1VM3hecf+fD0wYFw2uqL/ZR8jgg==
|
||||||
|
|
||||||
|
react-native-sound@^0.11.2:
|
||||||
|
version "0.11.2"
|
||||||
|
resolved "https://registry.yarnpkg.com/react-native-sound/-/react-native-sound-0.11.2.tgz#e542dc5b9e16ab4b3ac7e6eaddb1fc8d98da9038"
|
||||||
|
integrity sha512-LmGc8lgOK3qecYMVQpyHvww/C+wgT6sWeMpVbOe4NCRGC2yKd4fo4U0KBUo9PO7AqKESO3I/2GZg1/C0+bwiiA==
|
||||||
|
|
||||||
react-native@0.69.1:
|
react-native@0.69.1:
|
||||||
version "0.69.1"
|
version "0.69.1"
|
||||||
resolved "https://registry.yarnpkg.com/react-native/-/react-native-0.69.1.tgz#093363ea697185b5d8f0e523fce3654b833ad0be"
|
resolved "https://registry.yarnpkg.com/react-native/-/react-native-0.69.1.tgz#093363ea697185b5d8f0e523fce3654b833ad0be"
|
||||||
|
|
Loading…
Reference in New Issue
Block a user