Android Flavors, бир эле код базасын колдонуп, даамга негизделген куруу белгилериңизди жана активдериңизди кантип өзгөртүү керек.

Жакында мага бир эле код базасын сактоо менен, ар кандай активдердин топтомун колдонуу милдети коюлган. Бул макала мен аны кантип чечкеним жөнүндө.

Менин оюмча, сиз React-Native негизги программасы менен таанышсыз, эмнени билесиз жана Android Studio жана ADB тутумуңузга орнотулган.

Сыноочу тиркемесин 2 даам менен түзөбүз - Губка Боб жана Марио. Толук чечүүнүн булак кодун бул жерден тапса болот: https://github.com/niktechnopro/android_flavors.

1 фаза.

RN колдонмосун түзүү (Expo эмес):

  1. React-native init android_flavors (Mac OS колдонуучулары - local.properties дегенди SDKге жол кошууну унутпаңыз);
  2. Долбооруңуздун тамырына активдер папкасын кошуп, ага 2 сүрөт коюңуз - мен mario.png жана spongebob.png колдоном.
  3. Жүргүзүү сүрөтчөлөрүн түзүңүз - Android Studio жүргүзүп, тандаңыз менюдан чыкылдатып, андан кийин долбооруңуздун ичиндеги андроид папкасына өтүп, долбоорду ачып, атлин шайкештирилгенден кийин, аны оңой тандоо үчүн ачыңыз. жогоруда:
туура көз карашты тандоо

4. Андан кийин "app / src / main / res" тармагына өтүңүз, оң баскычты чыкылдатып, Жаңы дегенди тандаңыз, андан кийин Сүрөт мүлкүн тандаңыз (эгер сиздин долбоор ачык түрдө синхрондалбаса - анда сиз бул опцияны көрбөйсүз) - жана андан кийин Icons түзүү сунушу:

Андан кийин main / res / values ​​/ strings.xml ичине кирип, колдонмонун аталышын

5. эми бул колдонмону буйрук сабынан иштетүүгө аракет кылалы жана бир жолу эмуляторго орнотулганда - сөлөкөтүн тартып алсаңыз болот "Sponge Bob" деген ат менен эмулятордогу ишке киргизүү сүрөтчөсү катары караса болот;

6. "mario" даамын кошуңуз - негизги деңгээлдеги дагы бир папка жана ичине көчүрүңүз папкасы , ошондуктан сиздин каталог түзүмүңүз төмөндөгүдөй көрүнүшү керек:

Түзүмү долбоору

Баарын андан көчүрүүнүн кажети жок , анткени эч нерсе жетишпейт , автоматтык түрдө демейки абалга келтирилет , ошондуктан биз астына койду бул даамды өзгөртүү керек болгон нерсени гана;

7. <6> кадамды кайталаңыз, бирок бул жолу - "mario / res" үчүн белгилерди түзүү. Андан кийин, mario / res / values ​​/ strings.xml ичине кирип, колдонмонун аталышын "Марио" деп өзгөртөбүз.

2 фаза.

Бул этапта биз даамдарды жарыялайбыз жана "сценарийлерди" өзгөртүү .

  1. Кантип өзгөртүү керек бул жерде сүрөттөлгөн: "https://developer.android.com/studio/build/build-variants#product-flavors", ошондуктан биз көрсөтмөлөрдү аткарып, өзүбүздү өзгөртөбүз. сыяктуу:
build.gradle productFlavors

Бул жерде биз 2 даамды түзөбүз: "spongebob" жана "mario", жана бул курамдарды айырмалоо үчүн applicationIdSuffix программасын негизги тиркемеII / pack name = "com.android_flavors" кошобуз. ошентип, аяктаган топтом мындай көрүнөт: "com.android_flavors.spongebob" жана "com.android_flavors.mario".

Градл автоматтык түрдө куруу варианттарын сиздин түрүңүзгө жана өнүмдүн даамдарына жана аталыштарына жараша түзөт - демек, аны "скрипттер" астында pack.jsonга кошуп көрөлү:

Бул демо үчүн мен . Ошондой эле, версияны чыгаруу үчүн кол коюу баскычтарын түзүү керек болот - муну кантип google (Android Studio менен APP-ке кол коюу оңой)." src="https://imgstore.nyc3.cdn.digitaloceanspaces.com/raw3h/1586309503045.png" />
  1. Sponge Bob даамын түзүү үчүн "npm run android-bob" буйругун аткарыңыз, көчүрүлгөндөн кийин, биз "Sponge Bob" деген ат менен жана тиешелүү сөлөкөт менен APP көрөбүз. Андан кийин буйрукту иштетиңиз: (бул орнотулган топтомдордун тизмеси) Терминалда, жана сиз көрө аласыз: "com.android_flavors.spongebob";
  2. Азыр иштетүү буйругу Mario даамын түзүү үчүн, жогоруда айтылган кадамдарды кайталап 1) текшерүү.

Бул жерде бизде ар кандай иконалар жана APP аттары бар бир эле APPдин 2 даамы орнотулушу керек! - Азаматсың, ээ?

3 фаза.

Бул этапта, орнотулган даамга жараша, биздин APPдин HomePage-де ар кандай активдерди / сүрөттөрдү көрсөтүү үчүн логиканы кошобуз. Жөн гана пакеттин атын окуп, активдердеги туура сүрөттү көрсөтөбүз.

Пакеттин атын алуу үчүн, ылайыкташтырылган Native топтомун кошушубуз керек жана ошонун негизинде туура сүрөттү даярдайбыз. Android иштеп чыгуучунун шилтемеси: https://developer.android.com/reference/android/content/Context#getPackageName ();

Түпкүлүк модулун түзүп, топтомдун атын окуп, андан кийин бул маалыматты жөнөтүү үчүн ушул кадамдарды аткарабыз Көпүрө <-> JS> көпүрө, ошондуктан биз аны APP логикасында колдонобуз.

https://reactnative.dev/docs/native-modules-android

  1. -жылы - Жаңы Class - PackageReader.java түзүңүз жана ага төмөнкүлөрдү көчүрүңүз:

2. Андан кийин, биз Модулду катташыбыз керек, ошондуктан биз чала алабыз JS методунан башка класс деп аталат жана төмөнкүнү көчүрүңүз:

3. жарыялоо MainApplication.java ичинде, төмөнкүдөй:

4. Акыры, JS-ге логиканы кошуп, пакеттин атына жараша туура сүрөттү түзөбүз, бул жерде мен "башкы баракча" компоненти үчүн код:

Пакетти компонентDidMountтан кантип окуганымга көңүл буруңуз (сиз колдоно аласыз эгер кааласаңыз).

Кереги жок!

Ошентип, азыр, пакеттин даамына жараша, пакеттердин аталыштары жана башка активдер жүктөлөт:

"Npm run android-bob" сценарийин иштетип, биз төмөнкүлөрдү алабыз:

Анан "npm run android-mario" сценарийи бизди алат:

Жана сизде ушул даамдардын экөө тең бир эле учурда орнотулган, анткени алардын пакет аттары ар башка:

Ура!