Course Content
Foundations of React Native
Foundations of React Native
2. Core Concepts of React Native
Setting Up the React Native ProjectUnderstanding React Native ComponentsWorking with View and Text ComponentsUsing the Image ComponentStyling in React NativeChallenge: Apply Styles to ComponentsWorking with TouchableOpacity for User InteractionImplementing ScrollView for Scrolling ContentRendering Lists in React NativeChallenge: Build an Interactive Resort ListQuiz: React Native Basics
3. Essential React Native Principles
Implementing ScrollView for Scrolling Content
Theory
The ScrollView
component creates a scrollable view with a flexible height. It's particularly useful when you have content that exceeds the available space on the screen.
Why Use ScrollView
- Scrolling Content: Allows you to create a container that can be scrolled vertically or horizontally to view its content;
- Handling Overflow: Useful when the content inside a view is too large to fit on the screen.
Working with ScrollView
- Wrap the content we want to make scrollable inside the
ScrollView
component; - The
contentContainerStyle
prop is used to style the content inside the scroll view; - We can change the default vertical scroll behavior to horizontal by providing the prop
horizontal
.
Example
Result
In Practice
Everything was clear?
Thanks for your feedback!
Section 2. Chapter 8