小编Tri*_*Tri的帖子

我想在 React Native 中播放声音。

我曾尝试在zmxv/react-native-sound 中阅读这里，但作为像我这样的初学者，该文档让我很困惑如何在 React Native 代码中应用它。

在我尝试使用此方法在事件上制作本机播放声音并制作如下代码之前：

import React, { Component } from 'react'
import { StyleSheet, Text, View, TouchableOpacity } from 'react-native'
const Sound = require('react-native-sound')


export default class MovieList extends Component {

    handlePress() {
        // Play some sound here
        let hello = new Sound('motorcycle.mp3', Sound.MAIN_BUNDLE, (error) => {
            if (error) {
              console.log(error)
            }
          })

          hello.play((success) => {
            if (!success) {
              console.log('Sound did not play')
            }
          })
    }

    render() {
        const { …

当我按下TouchableOpacity时，我想在React Native中制作一个震撼的图像动画。

到目前为止，我已经用下面的代码制作了一个动画图像：

const backgroundImage = require('./components/images/baby-sleep.jpg')

class App extends Component {

    constructor(props) {
        super(props)
        this.animatedValue = new Animated.Value(0)
    }

    handleAnimation = () => {
        Animated.timing(this.animatedValue, {
            toValue: 1,
            duration: 1000,
            easing: Easing.ease
        }).start()

    }

这就是我所说的代码handleAnimation（）在TouchableOpacity：

<TouchableOpacity onPress={this.handleAnimation}>
   <Text style={{fontSize: 24, fontWeight: 'bold'}}>Play</Text>
</TouchableOpacity>

这是我制作动画图像的代码：

<Animated.Image
    source={backgroundImage}
    resizeMode='contain'
    style={{

    transform: [
        {
            translateX: this.animatedValue.interpolate({
            inputRange: [0, 1],
            outputRange: [0, 120]
            })
        },
        {
            translateY: this.animatedValue.interpolate({
            inputRange: [0, 1],
            outputRange: [0, 230]
            })
        },
        { …

我正在使用react-native，但我遇到了导航器的问题。

代码：

应用程序.js

import React, {Component} from 'react';
import {
   AppRegistry,
   StyleSheet,
   Text,
   View,
} from 'react-native';

import { StackNavigator } from 'react-navigation';

import loginScreen from './src/components/loginView';
import registerScreen from './src/components/registerView';

const Appmemes = StackNavigator({
   Login: {screen: loginScreen},
   Register: {screen: registerScreen}
});

export default Appmemes;

AppRegistry.registerComponent('Appmemes', () => Appmemes);

loginView.js 工作正常：

.
.
.
  <View style={styles.formContainer}>
          <LoginForm/>
  </View>
.
.
.    

登录表单.js

import React, { Component } from 'react'
import { StyleSheet, TextInput, Text, View, TouchableOpacity, AppRegistry} from 'react-native'
import …