Check out the NativeScript Swiss Army Knife

Dan Wilson

This is a guest post by Josh Sommer

Every developer has one, that little utility class or collection of functions with that you use over and over again in every project. Just like the person creating said class, every developers utilities class is different and each has some cool tricks up his or her sleeve. The entire idea behind NativeScript Swiss Army Knife is just to get everyone that wants to contribute to contribute and share those little functions.

SwissArmyKnife contains function called setAndroidNavBarTranslucentFlag that Brand Martin added and that is the one I want to show off for the moment. setAndroidNavBarTranslucentFlag does just what it says, it sets the normally boring black android nav bar to translucent so you can see your content under it. Setting androids translucent flag is not something that’s hard to do at all in NativeScript, because you call native APIs, but having it abstracted out into SwissArmyKnife makes using it much more convenient and is the entire point of the plugin.

Since i’m a big fan of TypeScript and it’s strong typings (code completion FTW!) for demo purposes all examples will be in TypeScript. All functions in Swiss Army Knife are static so all you need to do is import the SwissArmyKnife like so:

import { SwissArmyKnife} from 'nativescript-swiss-army-knife/nativescript-swiss-army-knife';

After that whenever you want to make the nav bar translucent simply call



Giving you the effect you see above.

And if for some reason you want to undo the effect, simply call the corresponding reset function


And you’ll get the Black navigation bar back.

NativeScript Swiss Army Knife contains many more great functions like this for Android and iOS. To see a listing of all the current functions is available at the NativeScript Swiss Army Knife GitHub page  and npm page.  If you have a function you’d like to add for the community don’t hesitate to make a pull request and add don’t forget to add yourself as a contributor to the package.json and README markdown files.


Share this article


Comments are disabled in preview mode.

Stay connected with NativeScript

(expect a newsletter every 4-8 weeks)

NativeScript is licensed under the Apache 2.0 license .
© 2016 Progress Software Corporation. All Rights Reserved.