Dima Khadorkin khadorkin

As I've been learning more and more about NativeScript, one of the first tasks I really dove into was learning how to customize the Navigation Bar for an iOS app. NativeScript has a Navbar component on the roadmap, but for now, it requires some knowledge about the underlying iOS implementation of UINavigationControllers, UIViewControllers and the like. But fear not! I have braved the treacherous waters of StackOverflow and the Objective-C docs and emerged, victorious and unscathed.

In this article, I’ll go over a few of the more common tweaks that you might be needing to make to the Navigation Bar or Status Bar. While NativeScript is a cross-platform framework, these tweaks apply specifically to iOS. However, most of the items that I will

Tweaking The Navigation / Status Bar In NativeScript

exports.loaded = function(args) {

  var page = args.object;
  page.bindingContext = feedModel;

var controller = frameModule.topmost().ios.controller;

	/! ****************************************************************************
	Copyright (c) YADI Social. All rights reserved.
	Licensed under the Apache License, Version 2.0 (the "License"); you may not use
	this file except in compliance with the License. You may obtain a copy of the
	License at http://www.apache.org/licenses/LICENSE-2.0

	THIS CODE IS PROVIDED ON AN AS IS BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
	KIND, EITHER EXPRESS OR IMPLIED, INCLUDING WITHOUT LIMITATION ANY IMPLIED
	WARRANTIES OR CONDITIONS OF TITLE, FITNESS FOR A PARTICULAR PURPOSE,
	MERCHANTABILITY OR NON-INFRINGEMENT.

	import platform = require("platform");
	import application = require("application");

	export enum Length {
	Short = 2000,
	Long = 3500
	}

	export function show(message: string, length: Length = Length.Long) {
	if (platform.device.os === platform.platformNames.android) {

	declare module "react-native" {

	import * as React from 'react';
	import {ComponentClass, ReactType, ReactNode, ReactElement} from 'react';

	export * from 'react';

	/**
	* Represents the completion of an asynchronous operation
	* @see lib.es6.d.ts

	Disclaimer: The instructions are the collective efforts from a few places online.
	Nothing here is my original. But I want to put them together in one place to save people from spending the same time as I did.

	First off, bundle.
	==================

	1. cd to the project directory
	2. Start the react-native packager if not started
	3. Download the bundle to the asset folder:
	curl "http://localhost:8081/index.android.bundle?platform=android" -o "android/app/src/main/assets/index.android.bundle"

	[user]
	name = Pavan Kumar Sunkara
	email = [email protected]
	[core]
	editor = vim
	whitespace = fix,-indent-with-non-tab,trailing-space,cr-at-eol
	excludesfile = ~/.gitignore
	[sendemail]
	smtpencryption = tls
	smtpserver = smtp.gmail.com

	package com.yourapp.rctgeolocation;

	import android.location.Location;
	import android.os.Bundle;
	import android.util.Log;

	import com.facebook.react.bridge.Callback;
	import com.facebook.react.bridge.ReactApplicationContext;
	import com.facebook.react.bridge.ReactContextBaseJavaModule;
	import com.facebook.react.bridge.ReactMethod;

	/**
	* Copyright (c) 2015-present, Facebook, Inc.
	* All rights reserved.
	*
	* This source code is licensed under the BSD-style license found in the
	* LICENSE file in the root directory of this source tree. An additional grant
	* of patent rights can be found in the PATENTS file in the same directory.
	*
	* @providesModule GoogleMapView
	* @flow

	function hash(str) {
	for (var i = 0, len = str.length, s1 = 1, s2 = 0; i < len; i++) {
	s1 = (s1 + str.charCodeAt(i)) % 65521;
	s2 = (s2 + s1) % 65521;
	}
	return (s2 << 16) + s1;
	}