Do You Need the App Bundle Id When Uploading Apk to Developer Consol

Releasing

Android

Overview

You can publish a NativeScript app in Google Play the aforementioned way you would release a purely native Android app.

  1. Brand certain that you lot have a .keystore file to sign your app with. For more than information, see How to create a .keystore file?

  2. Build your projection in release mode by running the following command:

                                                          ns                                          build                    android                      --                      release                                                              \                                                              --                      key-shop-path                      <path-to-your-keystore>                                                              \                                                              --                      key-store-password                      <your-fundamental-store-countersign>                                                              \                                                              --                      cardinal-store-allonym                      <your-alias-name>                                                              \                                                              --                      key-store-alias-password                      <your-alias-password>                                                                    

Annotation

At the end of <path-to-your-keystore> you lot should also add the verbal name of your keystore.

Example

                                                ns                                      build                  android                    --                    release                    --                    primal-store-path                                                        C:\keystore\NativeScriptApp.keystore                                      --                    cardinal-store-countersign                    sample_password                                                        --                    primal-store-alias                    NativeScriptApp                                                        --                    key-store-alias-password                    sample_password                                                            
                                                ns                                      build                  android                    --                    release                    --                    cardinal-store-path                                    ~/Desktop/keystore/NativeScriptApp.keystore                    --                    key-shop-countersign                    sample_password                                                        --                    cardinal-store-alias                    NativeScriptApp                                                        --                    primal-shop-allonym-password                    sample_password                                                            
  1. Obtain the release .apk located at <app_name>/platforms/android/app/build/outputs/apk/<app_name>-release.apk. 5. Publish your Android app by uploading the .apk file to the Google Developer Console. For more than information, run across How to publish an Android app?

Awarding Id and Bundle Name

Both Packet Proper noun, and Application Id, are unique identifiers, provided by you for your app.

  • Package Name is used to identify resource such as the R.
  • Application Id is used to identify your app on devices and at the Google Play.

In the NativeScript framework, both are set to the applicationId in app.gradle. The NativeScript CLI build system volition gear up them as the package attribute in the generated project in platforms/android/src/main/AndroidManifest.xml. In the app/App_Resources/Android/AndroidManifest.xml it will use a placeholder: package="__PACKAGE__". Do not modify the package attribute there.

Notation

To edit the Package Name and the Application Id, change the package.json of your app and set the nativescript.id primal. You may need to delete platforms/android and rebuild using the CLI command ns fix android.

Read more almost "ApplicationId versus PackageName".

App name

This is the display name for your app. Information technology is purely cosmetic but highly of import. For instance, it appears under the app icon. The value can be set via the App_Resources/Android/src/principal/res/values/strings.xml file. Creating your ain strings.xml will crave population of the app_name and title_activity_kimera attributes explicitly, like then:

                          <?xml version="ane.0" encoding="utf-8"?>                                                <resources                >                                                              <cord                name                                  =                  "app_name"                                >              MyAppName                                  </string                >                                                              <string                name                                  =                  "title_activity_kimera"                                >              MyAppName                                  </string                >                                                              </resources                >                                    

By default (or if the project lacks the values higher up) your awarding name is generated with the create control (e.g. ns create testApp will have app name testApp)

You can check out more information about the elements yous can ascertain in the AndroidManifest.xml here.

App icons

App icons are defined like to the app name. The icon name is divers in the app/App_Resources/Android/AndroidManifest.xml file, as an android:icon="@drawable/icon" attribute, on the <awarding> element.

The actual .PNG icons stay at the Android resources in app/App_Resource/Android/<DPI>/icon.png, DPIs:

directory DPI screen size
drawable-ldpi 120 Low density screen 36px x 36px
drawable-mdpi 160 Medium density screen 48px ten 48px
drawable-hdpi 240 High density screen 72px x 72px
drawable-xhdpi 320 Actress-high density screen 96px ten 96px
drawable-xxhdpi 480 Extra-extra-loftier density screen 144px x 144px
drawable-xxxhdpi 640 Extra-extra-extra-high density screen 192px x 192px

Launch screen

Creating Launch Screens for Android

Launch screens are essential every bit they provide a user's offset experience with your mobile application. Based on Google's Material Design launch screens guidelines, there are 2 main types of launch screens:

  • Placeholder UI: A simple seamless transaction type screen
  • Branded Launch Screens: A screen providing the user with momentary brand exposure and focus on the content

Instead of displaying a blank white canvas while your app is loading, creating a launch screen volition not simply "fill the gap" but also provide the bones introduction for your users. These basic rules for creating both types of launch screens are good to follow to create a good first impression:

  • avoid using text (except for your logo and tagline)
  • avoid using animations (your launch should be every bit calorie-free every bit possible)
  • avoid reusing your launch screen inside your application
  • follow Google's Material blueprint rules

Setting launch screen and app icons

In NativeScript, your application template (created with ns create myApp) ships with a bones launch screen template. In this article, we are going to introduce the workflow to create/alter your own launch screen.

Application resources used for launch screen creation

The default template in NativeScript (created with ns create myApp) provides you with a predefined splash_screen.xml file with the NativeScript logo on a blue background and with sample app icons. To modify that template and create your ain launch screen using your own avails and pattern, you volition need to access the files located under the app/App_Resources/Android folder. Let's look at the diverse files and folders in App_Resources/Android and then look at the specific steps y'all'll need to take to change them and configure your launch screen.

  • drawable folders: In your app/App_Resources/Android folder you will find a number of subfolders named drawable-X (where x is the unlike DPI for the unlike devices) These folders will store your properly scaled images for your app icons, launch screens and in app images (optional). Here is the full list of your drawable resource folders.

    • drawable-ldpi: Resource for low-density (ldpi) screens (~120dpi).

    • drawable-mdpi: Resources for medium-density (mdpi) screens (~160dpi). (This is the baseline density.)

    • drawable-hdpi: Resources for high-density (hdpi) screens (~240dpi).

    • drawable-nodpi: Resources for all densities. These are density-independent resources. The system does non scale resource tagged with this qualifier, regardless of the current screen's density.

      Important

      In NativeScript this is the folder that holds splash_screen.xml – the file that creates your launch screen.

    • drawable-xdpi: Resources for extra-loftier-density (xhdpi) screens (~320dpi).

    • drawable-xxdpi: Resources for extra-extra-high-density (xxhdpi) screens (~480dpi).

    • drawable-xxxdpi: Resource for extra-actress-extra-high-density (xxxhdpi) uses (~640dpi). Use this for the launcher icon simply.

  • values folder: XML files that contain unproblematic values such as strings, integers, and colors. Here is the full list of the files that ship with the basic NativeScript template.

                  * **colors.xml**: XML file in which the app colors are declared. * **strings.xml**: XML file in which the app cord are declared. * **styles.xml**: XML file in which the app styles are alleged. This file holds your `LaunchScreenTheme` style, which you can customize to change the `splash_screen.xml` mentioned above. One time your application is loaded, the `LaunchScreenTheme` is inverse with the `AppTheme` mode.                          
  • values-v21 folder: XML files that contain elementary values, such as strings, integers, and colors. Used when you demand to provide themes supported but on API Level 21+ (due east.one thousand., Theme.Cloth)

  • AndroidManifest.xml file: Every application must accept an AndroidManifest.xml file (with precisely that name) in its root directory. The manifest file presents essential data nearly your app to the Android organization – data the organization must accept earlier information technology can run any of the app's code. In order to alter your application icon file, you must modify the android:icon key in the applcation tag. <Comment: Please review to enure I did not create a technical mistake. The original text was sort of hard to sympathise.> The default app icon ready upwardly:

    android:icon="@drawable/icon"

    The code above will look for the file named icon.png in the drawable binder and will load the properly scaled prototype for the current device. <Annotate: Please review my rewrite of the sentence above to ensure I did not create an mistake. You had "drawables folders" only the command referred to a single binder (not plural).>

Note

In AndroidManifest you volition find the following key:

<meta-data android:name="SET_THEME_ON_LAUNCH" android:resource="@style/AppTheme" />

This cardinal is used past NativeScript to change your LaunchScreenTheme with AppTheme when your application is loading.

How to setup a custom launch screen

In guild to change the default NativeScript launch screen (divers in drawable-nodpi/splash_screen.xml) and create your own, follow these steps:

  1. Put your properly scaled images into the corresponding drawable folders. This folder can be used not merely for your launch screen images, just too for your app icons and for your in-app images (you can refer to this resource from your application logic with "res://image-proper name"). The default template app ships with three images: icon.png (used for app icon), logo.png (centered sample image) and background.png (image used to fill up the background).

The default splash_screen.xml with centered logo.png and filled background.png.

                                                            <layer-list                                  xmlns:android                                  =                  "http://schemas.android.com/apk/res/android"                                                  android:gravity                                  =                  "make full"                                >                                                              <item                >                                                              <bitmap                                  android:gravity                                  =                  "fill"                                                  android:src                                  =                  "@drawable/groundwork"                                />                                                              </item                >                                                              <item                >                                                              <bitmap                                  android:gravity                                  =                  "heart"                                                  android:src                                  =                  "@drawable/logo"                                />                                                              </item                >                                                              </layer-list                >                                    

Setting images in drawable resource folders

  1. Define the colors you want to use in values/colors.xml and in values-v21/colors.xml. Yous tin set your own colors and reuse them in the splash_screen.xml file for your launch screen (or reuse them in your app).

Setting colors in values folders

  1. Define the strings you desire to use in values/strings.xml and in values-v21/strings.xml. You can gear up your ain cord here and reuse them in the splash_screen.xml file for your launch screen (or reuse them in your app).

Setting strings in values folders

  1. Ascertain the styles and themes you desire to use in values/styles.xml and in values-v21/styles.xml. Notation that styles applied in the values-v21 binder will exist applied only to devices with API 21+. <Comment: Did you mean DPI 21+>

The default NativeScript template ships with two themes: LaunchScreenTheme (used for your initial launch) and AppTheme (used for your master application).

Setting styles in values folders

Detect that you lot can Not have custom folders within your App_Resources. But folders that are required past the Android convention <Comment: convention seems like the wrong word. Do you mean operating system?> are allowed and they must be created with the exact names provided (eastward.k., values, values-v21, drawable). When adding new folders in your App_Resources y'all should reset your platform binder.

                                          ns                                  platform                remove android                              ns                                  platform                add android                      

Once your launch screen is fully fix, rebuild your awarding and your launch screen is fix. On some occasions, you might need to reset your platform folder equally mentioned above.

Certificates

Debug document

These are automatically generated by the Android SDK tools for y'all.

In debug mode, you sign your app with a debug certificate. This certificate has a individual key with a known password. The procedure is handled past the Android tooling.

Y'all tin can read more than at "Signing in Debug Style".

Release certificate

The release certificate for Android is created past y'all; it does not have to be signed by a certificate say-so. It is easier to create a release certificate for Android than it is for iOS. You should, however, be more careful with your certificate.

A few pitfalls are:

  • Yous create the certificate only once. If you lose it, you lot volition not exist able to publish whatever updates to your app, considering you must always sign all versions of your app with the same key.
  • If your document expires, you will not be able to renew it. Ensure long validity when creating a new certificate (for twenty+ years).
  • If a third political party obtains your private key, that party could sign and distribute apps that maliciously supersede your authentic apps or corrupt them.

Y'all can generate a private fundamental for a release certificate using the keytool.

                                          keytool                                                      -                  genkey                -5                  \                                                                      -                  keystore                <my-release-key>.keystore                  \                                                                      -                  alias                <alias_name>                  \                                                                      -                  keyalg                RSA                  \                                                                      -                  keysize                2048                  \                                                                      -                  validity                10000                      

This will run an interactive session collecting information most your name, organization and most importantly — keystore and alias passwords.

Google Play Developer Console

Y'all will demand a developer business relationship and you lot volition need to log into the Google Play Programmer Console.

Go to the All applications department and click the + Add new application push button.

  • You volition get prompted to provide the app title

  • You lot tin can then proceed with the store listings.

  • Y'all can fill in app description, screenshots and so on.

  • You can also submit an APK. Read about how to obtain an APK from a NativeScript app.

Builds

Build versioning

We have already explained how the Application Id is set up in your project, how icons are added to your app and how you tin can ready the display name.

Earlier the build, you demand to gear up two of import things: the versionCode and the android:versionName.

When a build is uploaded, its versionCode should be larger than previous builds. A new build with a higher versionCode is considered an upgrade to builds that have a lower versionCode. The versionCode is an integer so you should carefully consider a strategy for versioning.

Both values are stored in app/App_Resources/Android/AndroidManifest.xml.

Note

android:versionName is a string value, which is used to represent the application version to the user whereas android:versionCode, which is integer value showing version of the application code relative to the other versions. You tin can read more about "Versioning Your Applications".

In the app/App_Resources/Android/AndroidManifest.xml, the versionCode and versionName announced as:

            <manifest xmlns:android="http://schemas.android.com/apk/res/android"       packet="org.nativescript.name"       android:versionCode="2"       android:versionName="1.1">       ...                      

Build signed release APK

You tin can perform a full build and produce a signed APK using the NativeScript CLI:

                                          ns                                  build                android                  --                  release                                                  \                                                  --                  cardinal-store-path                  <path-to-your-keystore>                                                  \                                                  --                  key-shop-password                  <your-key-store-countersign>                                                  \                                                  --                  key-shop-alias                  <your-allonym-name>                                                  \                                                  --                  fundamental-store-alias-countersign                  <your-alias-password>                                                  \                                                  --                  copy-to                  <apk-location>.apk                                                    

You tin can so apply the produced <apk-location>.apk for upload to Google Play.

APKs with ABI splits

Note

The recommended approach for reducing the app size by splitting it per architecture is the Android App Bundle which is supported out of the box through the --aab NativeScript CLI flag.

Android ABI split

If the recommended Android App Bundle approach is non applicable for y'all, an ABI split could be manually configured as an alternative. The ABI split approach will produce unlike apk files for the different architectures. To achieve this you demand to enable ABI splits at app/App_Resources/Android/app.gradle

Enable ABI separate

            android { ....   defaultConfig {     ....     ndk {       abiFilters.clear()     }   }   splits {     abi {       enable true //enables the ABIs divide mechanism       reset() //reset the list of ABIs to exist included to an empty string       include 'arm64-v8a', 'armeabi-v7a', 'x86'       universalApk true     }   } ....                      

Publishing ABI dissever apk

At present you volition need to upload all built apk files in Google Play Developer Panel. To achieve this the different apks need to have different Version Codes otherwise Google Play won't let adding them in the same version. To utilize unlike Version Codes you can add together the following code in your App_Resources/Android/app.gradle which will prefix the different compages apk Version Codes with dissimilar prefixes:

            project.ext.abiCodes = ['armeabi-v7a': 1, 'arm64-v8a': 2, 'x86': iii]  android.applicationVariants.all { variant ->     variant.outputs.each { output ->         def baseAbiVersionCode = project.ext.abiCodes.go(output.getFilter("ABI"), 0)         if (baseAbiVersionCode != null) {             output.versionCodeOverride = baseAbiVersionCode * 10000000 + variant.versionCode         }     } }                      

Submit with the Google Play Developer Console

To submit your app to the Google Play Developer Console:

  1. Log into the Google Play Developer Console.
  2. Select your application and go to the APK section.
  3. Cull Production, Beta or Alpha stage and click the Upload new APK.
  4. Select the APK produced by the CLI.

You can read more than near these stages at "Set upward alpha/beta tests".

Once you upload your APK, information technology volition get through a review. When approved, you can move it to product to make information technology available on Google Play.

Android App Packet

Android App Package is a new publishing format that contains all the compiled code and resources of your app, only leaves the bodily APK generation and signing to Google Play. The shop then uses the app bundle to generate and serve optimized APKs based on the device configuration of the specific user. In general, the benefit of using Android App Bundles is that you no longer take to build, sign, and manage multiple APKs to back up different devices, and users get smaller, more optimized downloads. For more information about the Android App Parcel, encounter the Well-nigh Android App Bundles article in the official Android Programmer documentation.

Produce Android App Parcel

You can perform a total build and produce a signed AAB using the NativeScript CLI:

                                          ns                                  build                android                  --                  release                                                  \                                                  --                  key-store-path                  <path-to-your-keystore>                                                  \                                                  --                  key-store-countersign                  <your-primal-shop-countersign>                                                  \                                                  --                  key-shop-allonym                  <your-alias-name>                                                  \                                                  --                  key-store-alias-password                  <your-alias-password>                                                  \                                                  --                  aab                                                  \                                                  --                  copy-to                  <aab-location>.aab                                                    

Changing the default target architectures

Warning

Filtering the target architectures does not reduce the app size, it but drops the back up for the devices and emulators using the missing compages.

By default, the generated aab file supports all of the bachelor device architectures - armeabi-v7a, arm64-v8a, x86 and x86_64. This beliefs can be overridden from your App_Resources/Android/app.gradle'south apiFilters holding:

            android { ....   defaultConfig {     ....     ndk {       abiFilters.clear()       abiFilters "x86_64", "x86", "arm64-v8a", "armeabi-v7a"     }   } ....                      

Testing the produced .aab file

Starting from NativeScript CLI 6.two.0, the Android App Bundle is supported out of the box by the ns run control:

                                          ns                                  run                android                  \                                                  --                  key-store-path                  <path-to-your-keystore>                                                  \                                                  --                  key-shop-countersign                  <your-key-store-password>                                                  \                                                  --                  key-store-alias                  <your-alias-name>                                                  \                                                  --                  primal-store-alias-password                  <your-alias-password>                                                  \                                                  --                  aab                                                    

Testing the produced .aab file earlier NativeScript 6.two

For older NativeScript version, in order to examination the apk files that Google Play volition produce from the .aab for a specific device yous will need to use the Android bundletool or upload to Google Play and use a examination runway.

If you use the bundletool yous should kickoff generate an .apks file that volition afterwards exist used to deploy on a device.

                                          java                                                      -                  jar                <toolPath>/bundletool.jar build-apks                  \                                                  --                  bundle                  =                  <somePath>/app.aab                                                  \                                                  --                  output                  =                  "<somePath>/my_app.apks"                                                  \                                                  --                  ks                  =                  <path-to-keystore-file>                                                  \                                                  --                  ks-pass                  =                  laissez passer:<keystore-pass>                                                  \                                                  --                  ks-key-alias                  =                  <central-allonym>                                                  \                                                  --                  key-pass                  =                  laissez passer:<central-pass>                  \                                                    

Then you lot can install the awarding on a connected device by executing:

Notation

Devices running Android four.4 (API level 19) and lower don't support downloading and installing split APKs. On such devices bundletool will not be able to deploy the application. When the package is released Google Play will serve a unmarried multi-APK to such devices.

                                          java                                                      -                  jar                <toolPath>/bundletool.jar install-apks                  \                                                  --                  apks                  =                  "somePath/my_app.apks"                                                  \                                                  --                  device-id                  =                  <deviceId>                                                    

You can discover more data about using Android bundletool here.

You can perform a full build and produce a signed AAB using the NativeScript CLI:

                                          ns                                  build                android                  --                  release                                                  \                                                  --                  central-store-path                  <path-to-your-keystore>                                                  \                                                  --                  key-store-password                  <your-key-store-password>                                                  \                                                  --                  key-store-allonym                  <your-alias-name>                                                  \                                                  --                  cardinal-store-alias-password                  <your-alias-password>                                                  \                                                  --                  aab                                                  \                                                  --                  copy-to                  <aab-location>.aab                                                    

Then you can employ the produced file to upload it to Google Play Programmer Console post-obit the steps described in Google Android Developer Documentation.

Submission automation

Some tools allow the submission process to be automated - MIT Licensed one: fastlane. You lot can also hack your own scripts around the Google Play Developer API.

Publish

Once you successfully upload your APK, and it passes Google review, you will exist able to movement your APK to production, and it will go live on Google Play.

iOS

You tin publish a NativeScript app in the App Store the same way you would release a purely native iOS app.

  1. Verify that the iOS native project inside your app contains your latest changes and resources past running the following control.
  2. Open the iOS native projection in Xcode. Your native project is located at: {app-proper name}/platforms/ios/{app-name}.xcworkspace (or in {app-name}/platforms/ios/{app-name}.xcodeproj if the project does not contain any native iOS libraries).
  3. Configure the project for distribution.
  4. Upload the app to App Store Connect.
  5. Submit it to the App Store.

Creating iOS NativeScript app

Package ID

The Package ID is a unique identifier, provided by y'all for your app. It uses contrary domain name notation. For example, the NativeScript CLI will utilize org.nativescript.<AppName> as default. During ns create you lot can provide the Packet ID using the --appid <id> option.

In iOS apps, the Bundle ID is stored in the CFBundleIdentifier in the Info.plist, only the NativeScript CLI volition explicitly set this to the value of the nativescript.id key stored in the package.json file in the root of your application.

Note

To edit the Bundle ID, edit the package.json of your app and set the nativescript.id key.

The Bundle ID is used to precisely identify your app at diverse situations and plays an important office, when it is built and launched by the CLI, as well as when Provisioning Profiles and certificates are created in the Apple tree Member Center.

For more than information consider the 'Nigh Package IDs' department in the following article.

App name

This is the brandish name for your app. Information technology is purely cosmetic but highly important. For example, it will announced under the app icon. The value is stored in the app/App_Resources/iOS/Info.plist file equally the CFBundleDisplayName key.

App icons

The NativeScript framework will utilize icons from app/App_Resources/iOS/. All files from that folder are added as resources in the generated Xcode project in platforms/ios.

App Store submissions will exist rejected if certain icon files are non present. To ensure you have the required icons, you can consider the following Apple article: 'App Icons on iPad and iPhone'.

If you want to extend the default icon set, and y'all don't desire to use the default naming, or yous need finer command, you can apply the app/App_Resources/iOS/Info.plist. List the icons using CFBundleIconFiles or CFBundleIcon.

For example, listing icons using CFBundleIconFiles:

Example 1: How to customise Info.plist.__>

                          <?xml version="1.0" encoding="UTF-8" ?>                              <!                DOCTYPE                plist                PUBLIC                "-//Apple//DTD PLIST i.0//EN"                "http://www.apple tree.com/DTDs/PropertyList-1.0.dtd"                >                                                              <plist                version                                  =                  "ane.0"                                >                                                              <dict                >                            <!-- The full content of the Info.plist all the same should be hither. -->                                                <primal                >              CFBundleIconFiles                                  </key                >                                                              <array                >                                                              <string                >              Icon@2x.png                                  </string                >                                                              <string                >              Icon.png                                  </string                >                                                              <cord                >              Icon-Small@3x.png                                  </string                >                                                              <cord                >              Icon-Small-scale@2x.png                                  </cord                >                                                              <string                >              Icon-Small.png                                  </string                >                                                              <string                >              Icon-Small-l@2x.png                                  </string                >                            <!-- etc -->                                                </array                >                                                              </dict                >                                                              </plist                >                                    

Launch files

Launch screens are an essential function of your iOS app. This is the starting time thing your users see when they outset your app.

The Springboard will play a subtle animation transitioning from the abode screen to your app. In order to provide a pleasing feel, it'due south best to avoid a default that'southward entirely black or white.

The launch files are not a splash screen; instead, they are a way for the Bone to quickly take hold of a preview image of your app and utilise it during the first ~300ms while your app is booting.

For design guidelines you can consider the post-obit article provided by Apple.

Notation

If you call up that following these guidelines will issue in a plainly, wearisome launch image, yous're right. Remember, the launch image doesn't provide yous with an opportunity for artistic expression. It'southward solely intended to enhance the user's perception of your app as quick to launch and immediately set up for use.

App Store submissions will be rejected if certain launch files are not nowadays. Make certain that when new iOS versions and devices are released that you lot update your launch files and adjust the upcoming form factors.

If a client runs your app on a device with a loftier resolution screen and your app is missing the launch screen file for that device, then iOS will render your app using a smaller resolution, degrading its quality:

  • Your app may be upscaled, and blurred
  • Your app may have black areas

Earlier iOS versions had to support a pocket-sized range of grade factors. Providing a unlike launch image per screen size was trivial. With the new devices released by Apple, the number of images that had to be provided increased. That's where Apple introduced the launch screen storyboard. The storyboard allows basic primitives such equally images to be presented on the screen, and y'all tin can take dynamic layout using layout constraints. This makes information technology possible to design a single launch screen that fits well for all grade factors.

The NativeScript framework default project has a Launch Screen Storyboard and Launch Images. In iOS8 and later, your app may utilize storyboards; your app can utilise launch images for devices that run earlier versions of iOS.

Launch screen images

The images are placed, like to the icons already mentioned, in app/App_Resources/iOS. The default projection template ships several Default-*.PNG files there; you may consider changing them.

In iOS8 and later on versions, your app will display its storyboard. If you want to use images on all devices, you can consider disabling the Launch Screen Storyboard. Instructions for how to do this are explained later in the next department.

Similar to the icons, you can use the UILaunchImageFile and UILaunchImages key in the app/App_Resources/iOS.

Launch screen Storyboard

The NativeScript framework volition provide a Launch Screen Storyboard in platforms/ios/<YourAppName>/en.lproj/LaunchScreen.xib, but does not nevertheless provide a means to shop it at app/App_Resources/iOS. If you want to edit it you can use the .xcodeproj generated in platforms/ios. You will accept to add it in source control. CLI rebuilds may overwrite information technology, and so you will take to sentinel out for automated changes in information technology when you commit.

To disable the default Launch Screen Storyboard, remove the UILaunchStoryboardName from the app/App_Resources/iOS/Info.plist:

                                                            <key                >              UILaunchStoryboardName                                  </fundamental                >                                                              <string                >              LaunchScreen                                  </string                >                                    

This will force all supported launch screens to use the launch image.

Creating App Icons and Launch Screens for iOS

Publishing your iOS app is an essential step in the development process and in club for your iOS application to be published successfully in the App Shop, there are some requirements that need to be fulfilled. As described in iOS Man Interface Guidelines setting the following is mandatory:

  • App proper name
  • App icon
  • Launch image or files

In NativeScript, your application comes with predefined template settings and images for these steps. In this article, we are going to introduce the workflow to create your own launch screens.

Alarm

Occasionally, the iOS operating system caches your application'south icons and launch screens. If you lot're updating icons or launch screens and not seeing your changes, delete the application from your device or emulator and redeploy. If on a existent device: remove platforms folder from your projection, delete app, restart device, redeploy.

Setting launch screen and App Icons

Setting upward launch screens depends on the version of iOS you are targeting. In iOS 7 and lower, the arroyo for creating the launch screen is to use static epitome resources. The drawback of this method is that the app programmer will take to provide many different images, each with dissimilar resolution for each iOS device. In iOS 8 and above, the approach is to create a LaunchScreen.storyboard, which is much more than powerful in terms of customization and is easier to maintain.

The default How-do-you-do-Globe project in NativeScript is provided with default settings that supports both approaches. When you build your app for devices with iOS lower then version 8, NativeScript will use the static images and when you employ NativeScript to build your app for devices with iOS eight and above, it will utilise the provided LaunchScreen.storyboard.

How to set your launch screen

The default template in NativeScript (created with ns create myApp) provides you lot with predefined AppIcons, launch images and a LaunchScreen.storyboard all with the NativeScript logo. To modify that template and create your own launch screen using your own assets and design, you volition demand the following:

  • app/App_Resources/iOS/Assets.xcassets: The resource that holds your image asset catalogs (for AppIcons, LaunchImages and LaunchScreen).

  • app/App_Resources/iOS/LaunchScreen.storyboard: Your default storyboard used for your launch screen (used in iOS versions 8+).

  • app/App_Resources/iOS/build.xcconfig: The resource that holds the references to the assets catalogs which will be used (optional: modify merely if you lot change the name convention or introduce a new image asset catalog).

  • Xcode 7.one or newer version (optional: needed only if you lot prefer WYSIWYG workflow for changing your images).

The workflow for creating your own launch screen tin can exist handled from Xcode or manually in the NativeScript environment. In this commodity we are going to encompass both the manual and the Xcode WYSIWYG approach.

In your app/App_Resources/iOS/Assets.xcassets you will find the following sub-folders:

  • AppIcon.appiconset: The resources that holds the images for your AppIcons (all iOS versions).

  • LaunchScreen.AspectFill.imageset: The resource that holds the background image for your LaunchScreen.storyboard.

  • LaunchScreen.Middle.imageset: The resource that holds the centered image for your LaunchScreen.storyboard.

Customizing App Icons

  • Changing AppIcons: manual approach

Open AppIcon.appiconset and alter the default icons images with your own using the proper resolution for each image (e.g., icon-29.png should be 29px x 29px; icon-29@2x should be 58px x 58px; icon-29@3x should be 87px x 87px). If your images have different file names then open Contents.json and change the cardinal filename for each image.

App icons config.json

  • Changing AppIcons: Xcode WYSIWYG approach

Elevate and drop your Assets.xcassets into Xcode (vii.1 or newer version). In the opened window choose AppIcon and add a proper epitome for each iOS version and device. Shut Xcode and rebuild your NativeScript app to use the new AppIcons.

AppIcon setup in Xcode

Customizing launch images

  • Manual arroyo

Open LaunchImage.launchimage and change the default launch images with your own using the proper resolution for each image (due east.g., Default-568h@2x.png should be 640px x 1136px). If your images have unlike file names then open Contents.json and change the key filename for each image.

Device Epitome Resolution Image name
iPhone 1g-3Gs 320x480 Default.png
iPhone four, 4s 640x960 Default@2x.png
iPhone 5, 5c, 5s 640x1136 Default-568h@2x.png
iPhone 6s - 8 750x1334 Default-667h@2x.png
iPhone 6s Plus - eight Plus 1242x2208 Default-736h@3x.png
iPhone X 1125px × 2436px Default-1125h.png
iPhone X Mural 2436px × 1125px Default-Mural-X.png
iPad, iPad 2, Mini 768x1024 Default-Portrait.png
iPad Mural 1024x768 Default-Landscape.png
iPad Retina 1536x2048 Default-Portrait@2x.png
12.9" iPad Pro 2048x1536 Default-Landscape@2x.png

Note

For a ameliorate understanding of the supported paradigm resolutions for the different iOS devices, refer to iOS Human Interface Guidelines or check our reference tabular array.

  • Xcode WYSIWYG arroyo

Drag and drop your Avails.xcassets into Xcode (7.ane or newer version). In the opened window add together the proper image for each iOS version and device. Close Xcode and rebuild your NativeScript app to use the new launch images.

Of import

Make sure yous accept provided all required images or your app will exist rejected from publishing in the App Store.

Customizing LaunchScreen.storyboard

The default template app in NativeScript comes with LaunchScreen.storyboard, which contains two epitome views. The showtime one, named LaunchScreen.AspectFill.imageset, is used to visualize your background. The 2nd ane, named LaunchScreen.Center.imageset, is used to visualize your centered logo. Your own storyboard can be customized to use your ain logic with different images and styles. Even so, go on in heed that according to iOS Human Interface Guidelines, the LaunchScreen should be as calorie-free as possible with minimal or no moving elements and text labels. Information technology is meant to provide immediate UX rather than artistic presentation.

LaunchScreen setup in Xcode

Customizing LaunchScreen.AspectFill
  • Transmission approach

Open LaunchScreen.AspectFill.imageset and alter the default LaunchScreen.AspectFill images with your own using the proper scale for each image (1x, 2x and 3x). As this is an paradigm that will be used in your LaunchScreen.storyboard, your bodily resolution may vary depending on your design. The default NativeScript template ships a LaunchScreen-AspectFill.png and LaunchScreen-AspectFill@2x.png used every bit a sample background. If your images take different file names and then open Contents.json and change the key filename for each image.

Important

Later on each file change in the Assets.xcassets folder you should rebuild your projection and restart your emulator to avert visualizing cached images.

  • Xcode WYSIWYG approach

Drag and driblet your Avails.xcassets into Xcode (7.1 or newer version). In the opened window cull LaunchScreen.AspectFill and add the properly scaled paradigm for each entry (1x, 2x and 3x). Close Xcode and rebuild your NativeScript app to utilize the new LaunchScreen.AspectFill.

LaunchScreen.AspectFill setup in Xcode

Customizing LaunchScreen.Center
  • Transmission arroyo

Open up LaunchScreen.Center.imageset and change the default LaunchScreen.Center images with your own using the proper scale for each paradigm (1x, 2x and 3x). Equally this is an image that will be used in your LaunchScreen.storyboard, your bodily resolution may vary depending on your design. The default NativeScript template ships a LaunchScreen-Center.png and LaunchScreen-Centre@2x.png used as a sample eye logo image. If your images have different file names and then open Contents.json and change the key filename for each image.

Important

Afterwards each file change in the Assets.xcassets binder you should rebuild your projection and restart your emulator to avert visualizing cached images.

  • Xcode WYSIWYG approach

Drag and drop your Assets.xcassets into Xcode (7.i or newer version). In the opened window choose LaunchScreen.Middle and add the properly scaled prototype for each entry (1x, 2x and 3x). Close Xcode and rebuild your NativeScript app to utilize the new LaunchScreen.Center.

LaunchScreen.Center setup in Xcode

Certificates, identifiers & profiles

Certificates, identifiers and profiles are managed at https://developer.apple.com/membercenter.

You lot should really explore the information Apple tree provides on certificates and identities. This article will embrace simply the basics.

Account with Apple ID

You lot will demand a developer business relationship with an Apple tree ID so you tin can admission the Apple tree Developer Member Center.

You will demand to exist added as an iOS developer in your organization.

Evolution certificates

Evolution certificates are used to sign iOS apps proving the origin of the app. If y'all plan to utilize the Xcode tooling it would exist best to create a development document.

A few pitfalls are:

  • A programmer is allowed to have ane document at any time. You must 'revoke' an existing certificate earlier you tin create a new one.
  • Certificates consist of public and individual keys. The private central is never sent to Apple, so you cannot 'download' your document from the Fellow member Center. If you lose the individual key of your certificate, you have to revoke it and create a new one.
  • When revoked or expired, the certificates may further invalidate provisioning profiles. Once the certificate is recreated, the provisioning profiles need to be updated also.
  • Making a certificate requires a Mac. Yous apply the Keychain Access tool to create a certificate request, generating a public and individual keys at your side, and then transport the public primal to Apple while storing the private primal in your keychain.
  • If y'all follow the steps at the Member Middle to create a new development document, the certificate must be stored in your keychain. You can consider exporting it and backing it up.

Production certificates

Production certificates piece of work similarly to development certificates. They consist of public and individual keys. The private key stays at your side and is never sent to Apple. Your app is signed with the distribution certificate using your private primal, so Apple tree tin can verify the origin of submissions in iTunes Connect using the public fundamental you lot sent them.

This production certificates is used to sign the application binary when it is prepared for submission. Unremarkably when an app is built for a device, its IPA file is signed with the development certificate.

Note

You can read more about IPA (file extension) here Subsequently, the tooling resigns the IPA with the production certificate and appends the distribution provisioning profile when submitting to iTunes Connect.

A few pitfalls are:

  • Creating production certificates are more restricted than creating evolution certificates. Apple limit the number of product certificates per team.
  • Considering production certificates are express in quantity per team, and frequently shared between multiple team members, yous must exist extremely careful when you lot revoke an existing distribution certificate. If y'all ultimately lost your individual key of a distribution document and revoke it, consult with anyone that may have backed information technology upwards or is in need of the new certificate. Hopefully this volition avert your new re-create existence revoked in the time to come or losing your admin rights.
  • Production certificates can exist shared between squad members. If y'all follow the steps at the Member Center to create a new one (link below) the certificate will be stored in your keychain. You can consign information technology every bit a .p12 file, hands backing it up and sharing it with senior team peers.

If you lot demand a new distribution document, go to https://programmer.apple.com/account/ios/certificate/certificateList.action?type=distribution click the '+' (add) push and follow the instructions for making a new 'App Store Distribution' document. Chances are you are function of a larger organization and your office does not have sufficient rights to create a new distribution document. Admins or other team member may provide you lot the certificates in that instance. In such cases, you will probably exist given a .p12 file and a password. You should import the file in your keychain using the Keychain Admission awarding.

Identifiers - App IDs

To test your app on a device or submit in the App Store, you lot will demand to create an App ID. App IDs consist of a Prefix or a Team ID that is generated by Apple, followed by an ID provided by you that must lucifer your Parcel ID. For example, you can create an App ID with the org.nativescript.* ID that will friction match all your NativeScript apps. The wildcard pattern imposes some restrictions on the services yous can use, and so you may likewise consider using a not-wildcard pattern such every bit org.nativescript.<my-app>.

These identifiers are after used to bind apps with provisioning profiles.

Devices

At the Member Center you can annals the devices you and your team use for testing. Get to https://developer.apple.com/account/ios/device/deviceList.action.

To register a phone you lot will need its UDID. Connect it to the Mac and run in a terminal:

It volition output all known devices and their UDIDs.

Development provisioning profiles

Evolution provisioning profiles demark together one or multiple developer signing identities (developer certificates), App ID and device IDs. These are created at https://developer.apple tree.com/account/ios/profile/profileList.action?blazon=limited. If you are making a new one, or calculation a new app to an existing 1, brand sure to select these three:

  • Your development document
  • App ID identifier, that matches your App ID
  • The device y'all will examination on

Different the certificates, provisioning profiles are files that can exist easily updated and downloaded from the Member Heart (in .mobileprovision files) and installed in Xcode by double-clicking that file.

Xcode is also capable of obtaining these automatically. Open Xcode and from the carte du jour become to Xcode > Preferences... > Accounts > (select your apple tree ID) > (double-click on your Squad Name). At that place you can bank check all signing identities (developer and production certificates) available to Xcode equally well as Download All provisioning profiles.

When you run an app on a device, Xcode will sign the app with your development certificate and add a provisioning profile that has your document, device ID and App ID.

While the development provisioning profiles are easily created and updated, they oft invalidate, especially when multiple developer certificates are involved. Every time one of them is revoked or expires, yous need to update the provisioning certificate.

These are non of a detail interest for App Shop submissions only you lot may demand one to test on a real device.

Distribution provisioning profiles

There are several distribution provisioning profile types. The one you lot will demand for App Store submission is 'App Store Distribution Provisioning Profile'. These are similar to the development provisioning profiles considering they bind:

  • Your distribution document
  • Your device-es
  • An App ID
  • Various settings, enabled services, etc.

Distribution provisioning profiles are created at https://developer.apple tree.com/account/ios/contour/profileList.activity?type=production.

For App Shop submissions, you lot must create an App Store Distribution Provisioning Profile. One time you create information technology, download it and double-click it on your Mac so information technology gets registered with Xcode.

Distribution provisioning profiles invalidate rarely since they refer a single Distribution Certificate.

App Shop Connect

While you manage your provisioning profiles and certificates at the Apple Developer Fellow member Center, apps are registered and submitted at App Shop Connect (old iTunes Connect). This is where you will be able to create new apps, gear up app screens, descriptions, manage app versions, etc.

Business relationship

You will need your Apple ID added to your system with sufficient rights at https://appstoreconnect.apple tree.com.

Creating an app

To publish your app in the iOS App Store y'all volition have to register your app. Log into https://appstoreconnect.apple.com and get to 'My Apps'. In that location you can bank check the status and edit existing apps or create a new app.

Click the '+' push at the pinnacle left corner. The 'New App' dialog should announced. There y'all have to fill the public App Store name of your app and master linguistic communication.

Likewise, you accept to gear up Bundle ID, which must lucifer the Bundle ID referred in '1.ane. Bundle ID'. If the driblet-down does not contain a suitable match, you are probably missing an App ID referred at '2.four. Identifiers - App IDs'. If there is a wildcard App ID, that is a potential match so select it. You will be able to type the suffix, replacing the wildcard in a text box.

At that point yous have to make full in the App Data. There are various avails that you must provide such as screenshots, icons, clarification, etc. Failing to provide all necessary assets may prevent yous from submitting your app, or result in app rejection.

Notation

Screenshots not matching the actual app may result in rejection of a new version sent for approval.

Builds

Once yous accept your app information registered at https://appstoreconnect.apple tree.com information technology is fourth dimension to build your NativeScript app for iOS and submit it to iTunes Connect — using Xcode.

Build versioning

Nosotros accept already explained how the Bundle ID is set in your projection, how the launch screen (or storyboard) and images are added to your app, and how you can ready the brandish proper name.

Earlier the build, you demand to prepare two important things: the Packet Short Version Cord and the Bundle Version String.

Bundle Short Version String is the public version of your app. Information technology is incremented between releases. For instance: ii.1. Bundle Version String is the internal build number. 1 public release usually has multiple release candidates. For example 2.1.1, 2.i.2, etc.

iTunes Connect has a restriction that a bundle cannot be uploaded with the aforementioned version twice, so you must increment the Package Version Cord with each upload.

The Bundle Short Version String should be incremented once your app version is uploaded, sent for approval, approved and published.

Both values are stored in app/App_Resources/iOS/Info.plist:

  • The CFBundleShortVersionString key stores the Bundle Brusk Version String.
  • The CFBundleVersion key stores the Bundle Version Cord.

In the app/App_Resources/iOS/Info.plist they appear as:

                                                            <key                >              CFBundleShortVersionString                                  </key                >                                                              <cord                >              ii.1                                  </string                >                                                              <key                >              CFBundleVersion                                  </key                >                                                              <cord                >              2.1.ii                                  </cord                >                                    

If yous need to edit these from the control line, there is a handy tool called PlistBuddy that can read and write Plist files. For instance, the following shell script appends the Jenkins $BUILD_NUMBER to the CFBundleVersion in the Info.plist:

                          ### Set CFBundleVersion ###              export              CFBundleVersion              =                              `/usr/libexec/PlistBuddy app/App_Resources/iOS/Info.plist -c                "Impress :CFBundleVersion"                `                            /usr/libexec/PlistBuddy app/App_Resources/iOS/Info.plist -c              "Prepare :CFBundleVersion                $CFBundleVersion.$BUILD_NUMBER"                      

Submit from the NativeScript CLI

You tin can execute the following command inside a NativeScript projection using the CLI:

The command volition prompt for your Apple ID and Password for authentication with iTunes Connect and then produce a release build and proceed to upload it to iTunes Connect.

Alternatively, you tin can use an existing build by running the following command:

                                          ns                                  publish                ios                  --                  ipa                  <path-to-ipa>                                                    

For more than information, run the following control:

Submit from Xcode

Y'all can execute the following command using the CLI:

This will create an Xcode project in platforms/ios/. Then yous may consider the following Apple article most how to configure the projection for distribution.

The platform folder is not meant to stay in source command and you should be conscientious when you do modifications in that location. Rebuilds may erase your changes and yous should add inverse files to source command.

A mutual pitfall, if you are using CocoaPods, is to open up the Xcode project instead of the workspace, and so be sure to open the workspace.

Once you have it open in Xcode, you have to go to your target'southward Signing & Capabilities and option a team. In Build Settings at that place should exist a suitable 'iOS Developer' and 'Code Signing Identity'.

From the top driblet-down, select your target, and from the devices and emulators, pick 'Generic iOS Device'.

Then y'all should be able to select from the elevation menu Product > Archive.

This makes an xcodearchive and opens information technology in the Xcode Organizer. The Xcode Organizer displays a list with builds of your app. Option the last build and click Upload to App Store.... Yous should select a squad again and whether to include app symbols for your app. Next, you lot can see a listing with the binary data, entitlements, etc. Click Upload.

If yous upload successfully, you should be able to log in at https://appstoreconnect.apple.com and see your build in 'Activities'. From in that location y'all tin enable Test Flying beta testing or send information technology for approval.

Submission automation

Automation can be achieved using the NativeScript CLI only. All of the parameters needed for publishing tin can be passed to the publish command directly:

                                          ns                                  publish                ios [<Apple ID> [<Password> [<Mobile Provisioning Profile Identifier> [<Code Sign Identity>]]]]]                      

For case, assuming that you lot want to issue a build using a mobile provision with an identifier d5d40f61-b303-4fc8-aea3-fbb229a8171c, you lot could run:

                                          ns                                  publish                ios my-apple-id my-password d5d40f61-b303-4fc8-aea3-fbb229a8171c "iPhone Distribution"                      

Annotation that the Code Sign Identity tin be ready to something generic like iPhone Distribution in order to permit the build automatically notice a code sign identity.

Y'all can besides automate the uploads of already built packages:

                                          ns                                  publish                ios my-apple tree-id my-password                  --                  ipa                  /tmp/build/myIpa.ipa                                                    

Some tools that allow the submission process to be automated - MIT Licensed i: fastlane.

Send for approval and publish

In one case you successfully submit a build at App Shop Connect, you can enable testing through Test Flight. When you lot are fix, go to the 'Build' section of your iOS app, choice the build, and click 'Submit for Review' for that version. The app volition pass through several App Statuses. If your app passes Apple tree review, information technology can go alive at the App Store.

thompsonmoded1948.blogspot.com

Source: https://docs.nativescript.org/releasing

0 Response to "Do You Need the App Bundle Id When Uploading Apk to Developer Consol"

Post a Comment

Iklan Atas Artikel

Iklan Tengah Artikel 1

Iklan Tengah Artikel 2

Iklan Bawah Artikel