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