Conteúdo do Curso
Foundations of React Native
Foundations of React Native
ScrollView Component
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
Code Description
-
Line 2: Import
ScrollView
fromreact-native
. -
Line 7: Wraps the
Text
components and provides a scrollable view. ThecontentContainerStyle
prop is used to apply styles to the content inside theScrollView
.
Result
In Practice
Tudo estava claro?
Seção 2. Capítulo 8
Conteúdo do Curso
Foundations of React Native
Foundations of React Native
ScrollView Component
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
Code Description
-
Line 2: Import
ScrollView
fromreact-native
. -
Line 7: Wraps the
Text
components and provides a scrollable view. ThecontentContainerStyle
prop is used to apply styles to the content inside theScrollView
.
Result
In Practice
Tudo estava claro?
Seção 2. Capítulo 8