The image component can be used to display Images within views. In this lesson, Alex Banks shows us how to load and display two PNG images that contain text elements.
- [Voiceover] React Native has a component…that will allow us to display images within our views.…Currently, I'm inside of the exercise files…for chapter three, lesson four.…I have the index.ios.js code in front of me,…as well as the application running in the iPhone6 simulator.…We have live reload enabled,…so if I make changes to this file and save them,…we will see those changes instantly update in the simulator.…Now, in the Atom IDE, I can hold command backslash…to see the tree view of files.…And you'll notice that, inside of this exercise file folder…we also have a folder called assets.…
In our assets folder, we have a couple of images,…Sierra Spencer and Tanner McTab.…They're both png images.…The first thing I'm going to do is…import these images into this file,…import picSierra.…And we're going to import images the exact same way…that we would import modules.…I am inside of the index.ios.js,…so the image that I'm looking for is…inside of the assets folder on the same level.…And I'm also going to import Tanner's pic, Tanner McTab.…
- How React Native works
- Running an iOS app
- Debugging an app
- Working with components
- Creating style sheets
- Preparing a color list and color info
- Using the navigator
- Fetching data
Skill Level Intermediate
Q: This course was updated on 08/21/2017. What changed?
A: New videos were added that cover Android setup and running the Android emulator. In addition, the following topics were updated: building color info component, fetching data, and incorporating a WebView.