1import { Asset } from 'expo-asset';
2import { Audio } from 'expo-av';
3import React from 'react';
4import { PixelRatio, ScrollView, StyleSheet } from 'react-native';
5
6import HeadingText from '../../components/HeadingText';
7import ListButton from '../../components/ListButton';
8import AudioModeSelector from './AudioModeSelector';
9import Player from './AudioPlayer';
10
11export default class AudioScreen extends React.Component {
12  static navigationOptions = {
13    title: 'Audio',
14  };
15
16  _setAudioActive = (active: boolean) => () => Audio.setIsEnabledAsync(active);
17
18  render() {
19    return (
20      <ScrollView contentContainerStyle={styles.contentContainer}>
21        <HeadingText>Audio state</HeadingText>
22        <ListButton title="Activate Audio" onPress={this._setAudioActive(true)} />
23        <ListButton title="Deactivate Audio" onPress={this._setAudioActive(false)} />
24        <HeadingText>Audio mode</HeadingText>
25        <AudioModeSelector />
26        <HeadingText>HTTP player</HeadingText>
27        <Player
28          source={{
29            uri: 'https://p.scdn.co/mp3-preview/f7a8ab9c5768009b65a30e9162555e8f21046f46?cid=162b7dc01f3a4a2ca32ed3cec83d1e02',
30          }}
31          style={styles.player}
32        />
33        <HeadingText>Local asset player</HeadingText>
34        <Player
35          source={Asset.fromModule(require('../../../assets/sounds/polonez.mp3'))}
36          style={styles.player}
37        />
38      </ScrollView>
39    );
40  }
41}
42
43const styles = StyleSheet.create({
44  contentContainer: {
45    padding: 10,
46  },
47  player: {
48    borderBottomWidth: 1.0 / PixelRatio.get(),
49    borderBottomColor: '#cccccc',
50  },
51});
52