Wireless Buzzer App
(Part II)
SoundButton.js:
import * as React from 'react';
import { View, Text, StyleSheet, TouchableOpacity } from 'react-native';
import { Audio } from 'expo-av';
export default class SoundButton extends React.Component {
playSound = async () => {
await Audio.Sound.createAsync(
{ uri: 'http://soundbible.com/mp3/Buzzer-SoundBible.com-188422102.mp3' },
{ shouldPlay: true }
);
};
render() {
return (
<TouchableOpacity style={styles.button} onPress={this.playSound}>
<Text style={{ fontSize: 20, fontWeight: 'bold', fontStyle: 'italic' }}>
Press Me
</Text>
</TouchableOpacity>
);
}
}
const styles = StyleSheet.create({
button: {
marginLeft: 20,
borderWidth: 1,
borderColor: 'black',
alignItems: 'center',
justifyContent: 'center',
width: 200,
height: 200,
backgroundColor: 'red',
borderRadius: 100,
},
});
0 Comments: