Most of the application have android and iOS version of it. Definitely to develop android and iOS version of application they assign different developer for each platform. During the team communication for the application during the development, we see the weird situation where iOS developer don’t understand the technical word used by android developer and vice versa. For e.g. iOS developer use terms such as ViewController, TableViewController which most of the android developer don’t understand what the hell is that. In android they use term such as Activity and Fragment for ViewController and ListView and ListViewLayout for TableViewController.
This is one for the reason that developer finds very hard to switch from android developer to iOS developer and vice versa. Definitely there are other lots of reason for this, but here I am taking about UIComponent and Controls only. So here are some of the UI Component mapping between iOS, Android and React Native.
React |
React Native |
iOS |
Android |
ViewController – Activity/Fragment |
|||
– |
<ViewPagerAndroid> |
PageViewController |
View Pager |
View |
|||
<div> |
<View> |
UIView |
<android.View> |
– |
– |
UIStackView |
<LinearLayout>, <RelativeLayout> |
<span> |
<Text> |
UILabel |
<TextView> |
<li>, <ui> |
<ListView> |
UITableView |
<ListView>, RecyclerView |
– |
<ListView> GridLayout |
UICollectionView |
<GridLayout>, <GridView> |
– |
react-native-menu |
UIPopoverView |
<Spinner>, Menu |
<img> |
<Image> |
UIImageView |
<ImageView> |
– |
<WebView> |
UIWebView |
<WebView> |
– |
<ScrollView> |
UIScrollView |
<ScrollView> |
– |
<MapView> |
UIMapView |
<android.gms.maps.MapView> |
– |
<StatusBar> |
UIStatusBar |
|
– |
<NavigatorIOS> |
UINavigationBar |
<ActionBar> |
– |
<ToolbarAndroid> |
UIToolBar |
<ToolBar> |
– |
<TabBarIOS> |
UITabBar |
Tabbed Layouts |
– |
– |
– |
<RatingBar> |
– |
TextInput |
UISearchBar |
<SearchView> |
– |
– |
– |
CalendarView |
– |
– |
– |
CardView |
– |
<Modal> |
– |
– |
User Input Component |
|||
– |
– |
UITextView |
<TextView> |
– |
<TextInput> |
UITextField |
<EditText> |
Control UI Component |
|||
– |
<ActivityIndicatorIOS> |
UIActivityIndicatorView |
ProgresDialog |
– |
<ProgressBarAndroid> |
UIProgressView |
<ProgressBar> |
– |
<Alert>, <AlertIOS> |
UIAlertView |
DialogBox , Toast |
– |
<ActionSheetIOS> |
UIActionSheet |
SnackBar |
– |
– |
UIActivityView |
BottomSheet |
– |
<DatePickerIOS> , <ProgressViewIOS> |
UIDatePicker |
<TimePicker>, <DatePicker> |
– |
<Picker>, <PickerIOS> |
UIPickerView |
<Spinner> |
– |
– |
UIButton |
<Button>, <RadioButton>, <CheckBox>, <Stepper>, <ImageButton> |
– |
<Switch> |
UISwitch |
<Switch> |
– |
– |
UIStepper |
– |
– |
– |
UIPageControl |
PageIndicator, Stepper |
– |
<SegmentControlIOS> |
UISegmentControl |
– |
– |
– |
UISlider |
<SeekBar> |
– |
– |
– |
Chips |
– |
UIImagePickerController |
– |
UITabbarController |
TabbedLayout |
– |
ModalView |
TabbedLayout |
These list may not be sufficient, so I could love to leave a comment to fill in the space to add more items and receive feedback for the above list if found not appropriate.
Reference Website
https://android-arsenal.com/details/1/1156
https://developer.apple.com/library/ios/documentation/UserExperience/Conceptual/MobileHIG/ContentViews.html#//apple_ref/doc/uid/TP40006556-CH13-SW1
https://www.google.com/design/spec/components/
https://developer.xamarin.com/guides/android/user_interface/recyclerview/
Ref for React
http://www.material-ui.com/#/components/snackbar
http://nikgraf.github.io/belle/#/component/spinner?_k=crzfed