react-native/docs/Basics-Component-Image.md
Eric Nakagawa 4243d682a0 Docs: Basic Components Update
Summary:
This is an improvement to basic components docs.

* I updated the basic components example code to better render components on iOS (added paddingTop).
* I also modified the code to allow reader to easily copy, paste, and then run the code in their project if they followed the 'Getting Started' quick start guide.
* I also added additional copy to clarify suggested usage/guidelines.
Closes https://github.com/facebook/react-native/pull/8292

Differential Revision: D3469943

Pulled By: JoelMarcey

fbshipit-source-id: 21ff6ee13b59741c43d80aab68a38aace0fbfca6
2016-06-22 10:13:27 -07:00

857 B

id title layout category permalink next
basics-component-image Image docs Basics docs/basics-component-image.html basics-component-view

Another basic React Native component is the Image component. Like Text, the Image component simply renders an image.

An Image is analogous to the <img> HTML tag when building websites.

The simplest way to render an image is to provide a source file to that image via the source attribute.

This example displays a checkbox Image on the device.

import React from 'react';
import { AppRegistry, Image } from 'react-native';

const AwesomeProject = () => {
  return (
    <Image source={require('./img/check.png')} />
  );
}

// App registration and rendering
AppRegistry.registerComponent('AwesomeProject', () => AwesomeProject);