Mobile development

Stage 2 · Lesson 3 of 10

View, Text, Image, Pressable and ScrollView

React and React Native components

draws real native views, not , so there are no divs or spans. Learn the . View is the basic box.

Text is the only component that can show text, and a bare string outside it is an error. Image shows local or remote images. Pressable handles taps and can change style while pressed.

ScrollView scrolls content that is a little taller than the screen. Styles are objects, usually made with StyleSheet.create. They use camelCase names and plain numbers with no units, measured in . Remote images need a width and height.

Common trapexpecting web behaviour: styles do not cascade from a View to the Text inside it, and there is no CSS file.

A question to check yourself, an AI practice session and 1 cheat sheet entry come with the full roadmap. Unlock

Resources for this stage

Start with· follow one of these

  • GuideFree
    Expo Documentation

    Expo

    The Expo tutorial builds a small app you run on your own phone

  • GuideFree
    React Documentation

    Meta

    "Describing the UI" and "Adding interactivity" cover the React you need

Practise

  • Use a free challenge's mobile design image as the spec for a native screen

Keep handy

Mark this stage as not done?