Home > Web Front-end > JS Tutorial > body text

React Native Components CheatSheet

Barbara Streisand
Release: 2024-10-17 06:26:29
Original
217 people have browsed it

React Native Components CheatSheet

Here is a complete guide for React Native components corresponding to HTML elements and native Android and iOS UI components can bridge the gap between web and mobile development. This comprehensive table provides a side-by-side comparison to help developers transition seamlessly across platforms.

React Native Component HTML Element Android Component iOS Component
View
ViewGroup UIView
Text

or

TextView UILabel
Image ImageView UIImageView
TextInput EditText UITextField
ScrollView
ScrollView UIScrollView
FlatList
    (with custom handling)
RecyclerView UITableView
SectionList
    with sections
ExpandableListView UITableView with sections
Button Button UIButton
TouchableOpacity Clickable
TouchableOpacity UIButton (with opacity)
TouchableHighlight Clickable
TouchableHighlight UIButton (with highlight effect)
TouchableWithoutFeedback Clickable
View with touch events UIView with touch events
ActivityIndicator CSS Spinner ProgressBar UIActivityIndicatorView
Modal Custom modal/dialog Dialog Modal UIViewController
Picker Spinner UIPickerView
Switch Switch UISwitch
Slider SeekBar UISlider
StatusBar N/A StatusBar UIStatusBar
SafeAreaView N/A View (with insets) UIView respecting safe areas
KeyboardAvoidingView N/A View with keyboard handling UIView with keyboard handling
Pressable View with touch events UIView with touch events
RefreshControl N/A SwipeRefreshLayout UIRefreshControl
WebView