React-native: React Native Movies Tutorial Image IOS not rendering

Created on 10 Oct 2015  路  4Comments  路  Source: facebook/react-native

I'm just trying to render an image of a movie poster, via the following in index.ios.js:

'use strict';

var React = require('react-native');
var MOCKED_MOVIES_DATA = [
  {title: 'Title', year: '2015', posters: {thumbnail: 'http://i.imgur.com/UePbdph.jpg'}},
];
var {
  AppRegistry,
  Image, 
  View, 
  StyleSheet
} = React;

var iosProject = React.createClass({
  render: function() {
    return (
        <View style={styles.container}> 
        <Image 
            source={{uri: 'http://i.imgur.com/UePbdph.jpg'}} 
            style={{width: 53, height:81}} />
        </View> 
    );
  }
});

var styles = StyleSheet.create({
    container:{
        flex: 1,
        justifyContent: 'center',
        alignItems: 'center',
        backgroundColor: '#F5FCFF',
  },
});

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

I've tried reloading ios simulator, stopping and rerunning, but the image simply will not load in the simulator (it's just blank). I have dimensions for the image, checked that the uri link goes to the image, and have an "Image" in "var" in the beginning. There hasn't been any errors thrown either. What am I missing (something in the setup maybe?)

Help Wanted Ran Commands Locked

All 4 comments

I'm actually experiencing the same issue with one of my projects. This happens with a network resource over http or https. No errors, the image simply fails to load. There is an Image component there (which I can see by inspecting the element), and it occupies the height/width specified in the style, but there is just a blank space. Would love to hear an answer on this.

copied & pasted the code changed the project name to AwsomeProject and ran it under my old Awsomeproject folder. no problem.

@facebook-github-bot close

@christopherdro tells me to close this issue. If you think it should still be opened let us know why.

Was this page helpful?
0 / 5 - 0 ratings