When creating a NativeScript app it’s pretty much a given that you will eventually want to work with a native API to accomplish either a simple or complex task. Fortunately for us the NativeScript dev team choose TypeScript which gives us type definitions. If you are not familiar with it yet be prepared to learn about TNS Platform Declarations.

First things first, you’re going to want to install tns-platform-declarations with the command npm install --save-dev tns-platform-declarations

Next create a new file called reference.d.ts in the root of your NativeScript application. Then add the below two lines to the file contents of your newly created reference.d.ts file.

Now, if you are targeting one specific API and/or you know you’re only working with one I recommend commenting out the line corresponding to the API your are not using, it will help with compile times.

Once your reference.d.ts file has been added to your project you will have access to the Android and/or iOS API’s.

Lets say we have a ScrollView, when we reach the beginning or end there is a ui bounce and currently there isn’t a way to do this with the NativeScript API. However since we have full access to our native platform APIs and now we have the platform declarations installed, we can use Apple’s And Android’s documentation of their native API’s to disable the iOS ui bounce and Androids over flow animation.

iOS’s bounce and Android’s over scroll effects

First in iOS we can see here iOS’s UIScrollView has a property called bounces that accepts a Boolean. Since NativeScript uses the UIScrollView for iOS we can access it with the ios property of our NativeScript ScrollView.

Android is very similar. we can access the Android view from our NativeScript view just like iOS with the android property. We can then set it’s type to a android.widget.ScrollView. This will give us access to the properties an methods for the Android ScrollView and we can see in the documentation we need to use the method setOverScrollMode to disable the over scroll feedback in Android.

When working with native code make sure to put a guard around platform specific API calls. If you don’t do this you will encounter run time errors when you run platform specific code on other platforms. For example this is what it could look like in the real world.

Our new “boring” ScrollViews

As you can see by adding TNS Platform Declarations to your NativeScript project, you will eliminate typos and guess work when working with native APIs. This is just one of the many features that makes NativeScript stand out compared to other mobile development frameworks.