Skip to content

(Android) Images loading causes that app crashes #15956

@Borisboky

Description

@Borisboky

I'm using:

react-native: 0.39.0
npm: 4.0.2
node: 6.9.1

The problem is when I try to take a few pictures in a row, after fifth taken image the app crashes. I'm not getting any errors of warnings.

It crashes also if the camera is opened and if I wait for about 15-20 seconds with camera opened, without taking photo.

On newer, better phone (s8 galaxy) and newer android versions (7) it works as expected, but on this one it isn't working. Thus, I suppose that it has something to do with memory issues. But I'm not sure.

I've added largeMemoryHeap to the manifest file.

In android studio I get log file as follows:
screen shot 2017-09-14 at 11 11 58

Thus, no errors, nothing. But the app doesn't work.

The stuck of code where those photos are rendered is as follows:

<ScrollView removeClippedSubviews={true}>
      <StatusBar backgroundColor="blue" barStyle="light-content"/>
      <Zoom visible={this.state.zoomVisible} close={() => this.setState({zoomVisible: false})} image={this.state.zoomImage} imageIndex={this.state.zoomIndex} pictures={this.state.zoomPictures} remove={this.onRemoveImage.bind(this)} />
      <View style={{width: width, height: 1, backgroundColor: '#ddd'}} />
           <View style={styles.container}>
               {cards}
           </View>
 </ScrollView>

And one card is as follows, and I have a stuck of 10:

<TouchableHighlight onPress={this.props.onPress} style={styles.card} underlayColor={s.color}>
       <View style={styles.innerCard}>
             <View style={styles.innerImageContainer}>
                  <Image contain='contain' style={styles.innerImage} source={this.props.image}/>
              </View>
              <View style={[styles.innerTitle, {borderBottomWidth: 4, borderBottomColor: this.props.mandatory ? this.props.noImage ? s.paletteMandatory : s.success : '#fff'}]}>
                   <Text style={styles.textTitle} allowFontScaling={false} numberOfLines={1} ellipsizeMode={'tail'}>{this.props.title}</Text>
              </View>
        </View>
</TouchableHighlight>

I found here that I need to add removeClippedSubviews={true} to ScrollView, but it does not help.

On IOS it works just fine.

It looks something like:

simulator screen shot 15 sep 2017 09 27 34

When they click on one of the cards the camera is opened and after they take the photo, the get something like:
simulator screen shot 15 sep 2017 09 27 52

Thus, on IOS and on Android phones with more memory (Samsung S8) it works as expected.

Metadata

Metadata

Assignees

No one assigned

    Labels

    Ran CommandsOne of our bots successfully processed a command.Resolution: LockedThis issue was locked by the bot.

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions