0% found this document useful (0 votes)
72 views

Core Components React Native

React Native is an open source framework for building Android and iOS apps using React. It allows using native platform capabilities while sharing code across platforms. Components are the basic building blocks and anything on screen is a component. Props customize components and state allows components to change over time. Basic components include View, Text, Image, Button, and Touchables. React Native works cross-platform by rendering natively on each platform.

Uploaded by

Syed Aqib Raza
Copyright
© © All Rights Reserved
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
72 views

Core Components React Native

React Native is an open source framework for building Android and iOS apps using React. It allows using native platform capabilities while sharing code across platforms. Components are the basic building blocks and anything on screen is a component. Props customize components and state allows components to change over time. Basic components include View, Text, Image, Button, and Touchables. React Native works cross-platform by rendering natively on each platform.

Uploaded by

Syed Aqib Raza
Copyright
© © All Rights Reserved
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
You are on page 1/ 14

Core Components

React Native
What is React Native
• an open source framework for building Android and iOS applications
using React and the app platform’s native capabilities.
Concepts[1]
• Components
• Basic building block
• Anything on the screen is some sort of component.

• Props
• short for properties
• Customize components
• Should not be modified

• State
• allows React components to change their output over time
Component(just a
function)

Basic
component
props

Calling custom components


state
Basic Components
• View
• Text
• Image
• Button
• Touchables
• Alert
Cross platform working[2]
View
• basic building block of UI
• used to display text, images,
or respond to user input
• views can contain other views. 
Text
• Displays text
• supports nesting, styling, and touch handling. 
• must wrap all the text nodes inside of a <Text> component.
• Props
• numberOfLines
• onPress
Image
• Display images both local and network
• Props
• blurRadius
Buttons
• render nicely on any platform.
• Required props
• onPress
• title
Touchables
• Wrapper to make views respond to touches
• TouchableHighlight
• TouchableOpacity
• TouchableWithoutFeedback
References
[1] https://reactnative.dev/docs/tutorial
[2] https://reactnative.dev/docs/intro-react-native-components

You might also like