Question

我使用一些代码使用状态替换了图像，但对我来说却无法正常工作。

反应本机环境信息：系统：作业系统：macOS 10.14.4 CPU：（2）x64英特尔（R）奔腾（R）CPU 2127U @ 1.90GHz 内存：21.40 MB / 8.00 GB 外壳：3.2.57-/ bin / bash 二进制文件：节点：10.14.1-/ usr / local / bin / node npm：6.9.0-/ usr / local / bin / npm SDK： iOS SDK：平台：iOS 12.2，macOS 10.14，tvOS 12.2，watchOS 5.2 IDE： Xcode：10.2 / 10E125-/ usr / bin / xcodebuild npmPackages：反应：16.8.3 => 16.8.3 react-native：^ 0.59.4 => 0.59.4 npmGlobalPackages： create-react-native-app：2.0.2 react-native-cli：2.0.1

import imagebuttontap from './../../assets/png/final_tap.gif';
import imagebuttonwave from './../../assets/png/final_wave.gif';

状态已定义

 this.state{OnImage: imagebuttonwave,};

按钮事件

ChangeMe(){
  this.setState({ showSoundImg: !this.state.showSoundImg });
  if(!this.state.showSoundImg){
    setTimeout(()=>{this.setState({OnImage:imagebuttontap})}, 4000)
    this.setState({OnImage:imagebuttonwave}); 
  }

renderImage(){
    if(this.state.showSoundImg){
        var imgSource = imagebuttonoff;
        this.state.appOn = 1;
    return (
      <Image
        style={{width:imageWidth, height:imageHeight}}
        source={imgSource }
      />
    );}
    else{
    this.state.appOn = 0;   
    var imgSource1 = imagebuttonwave;
     console.log('Button off');
    //this.setState({OnImage:imagebuttonwave});
    return (
      //<FLAnimatedImage
      <Image
        style={{width:imageWidth, height:imageHeight}}
        source={this.state.OnImage}
        //source={imagebuttonwave}
      />      
    );}}

退货声明

<View style={styles.buttonMain}>
      <TouchableOpacity            
            onPress={ () => this.setState({ showSoundImg: !this.state.showSoundImg })}
          >
            {this.renderImage()}
       </TouchableOpacity>
     </View>

我希望在特定时间段内更改图像。

Answer 1

renderImage(){

    if(this.state.showSoundImg){
        var imgSource = imagebuttonoff;
    //  this.state.appOn = 1;
    return (
      <Image
        style={{width:widthN, height:imageHeight}}
        source={imgSource }
      />

    );
   }
    else{
    var imgSource1 = imagebuttonwave;
    return (
      <Image
        style={{width:widthN, height:heightN}}
        source={this.state.OnImage}
      />      
    );
   }

//从呼叫

<TouchableOpacity 
          onPress={ () => {this.setState({ showSoundImg: !this.state.showSoundImg })
          }} 
          >
                {this.renderImage()}
           </TouchableOpacity>

有什么方法可以在特定时间段更改图像？

1 个答案: