What is the right way to develop components for Android and iOS?

In our company, we have several React Native components built for iOS. They are all based on JavaScript, so they should also work under React Native for Android. In addition, most of the components that we have should only differ in design style, so we need to code these differences between both platforms.

What is the right way to enable these components to support Android? Do I need to use ifapplication verification Platformand change the style accordingly? If we want to separate the components in two files, Component.android.jsand Component.ios.jsReact Native will automatically determine which one should be used depending on the platform on which it works?

+4
source share
2 answers

There is a very simple solution that I prefer. Just use the file extension: .ios.vs.android.

enter image description here

eg. look at my navigator. I use the Android toolbar in navroid, and then I can use navigatorIos for ios if I want. The application platform will correctly download the corresponding platform file only based on the extension. This means that I just load it normally:

var Nav = require('./jsx/Nav');

I like to follow the declarative approach React talks about in this way:

1) the organization of your files will be carried out by functions / behavior, and not by platform, since the same file with different extensions will be next to each other.

2) , , , , , ( )

3) .

4) , : , -, ( ).

, , ; .

+5

1.

  • IOS, Android, -.
  • 3 :

    /common/components/ /android/components/ /ios/components/

2. , ,

  • :
    • ( , , / ).
    • ( , , ).
  • , , IOS Android. , , , . , , , .

3. if switch

  • IOS Android- (, ), if .

4.

  • , IOS Android (, <MyCameraWidget>), <BaseCameraWidget>, <CameraWidgetIOS> <CameraWidgetAndroid>, . - - .
    • , , .
    • , , , <CameraWidget>, , <CameraWidgetIOS> <CameraWidgetAndroid>.

, Facebook , React Native packager. , Android IOS , , , .

+3

Source: https://habr.com/ru/post/1611622/


All Articles