Back to Blog Home
← all posts

Check out the NativeScript Swiss Army Knife

June 29, 2016 — by 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

SwissArmyKnife.setAndroidNavBarTranslucentFlag();

 



Giving you the effect you see above.


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

SwissArmyKnife.resetAndroidNavBarTranslucentFlag();

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.