Looking to implement a day and night mode to your app?  Ti.Brightness provides a series of APIs that allows you to read the iOS 7 screen brightness and be notified if it changes.

Getting the screen brightness

Reading the iOS 7 screen brightness level is easy.  Just call the getScreenBrightness method as shown below.  This method provides Titanium access to the underlying iOS [UIScreen mainScreen].brightness platform API.

var brightness = require('ti.brightness');
var level= brightness.getScreenBrightness();
Ti.API.info("Brightness Level:" + level);

* If you are running this in the simulator, 0.5 will always be returned.

Brightness Changed Event

You can use the changed event as shown in the following snippet to trigger an event after the user has adjusted their screen brightness. This event provides Titanium access to the name UIScreenBrightnessDidChangeNotification notification.

function onBrightChange(e){
    Ti.API.info(JSON.stringify(e));
    alert("Your Screen brightness is level: " + e.brightness);
};

brightness.addEventListener('changed',onBrightChange);

* This event will not trigger in the simulator

In Action

The following movie shows the module in action and how Ti.Brightness can be used to add a dark and light theme to your app.

I had the opportunity to review the PACKT video series “Build a Network Application with Node” by Joe Stanco.  This video series walks you through how, at a high-level, to create different types of web apps using Node.JS.

This video series targets the JavaScript developer with a basic understanding of Node.JS.  Joe Stanco does an excellent job in guiding the viewer through the creation of a series of web apps designed to highlight common develop use cases.  The examples start with a barebones “hello world” type app and gradually move the viewer to a more complex Socket.IO and Bootstrap app.

Joe Stanco’s presentation skills are impressive, from introduction to conclusion his delivery was clear, easy to understand, and in sync with his examples.  With a length of over 2 hours, the pace and clarify of presentation made “Build a Network Application with Node” easy to watch in a single sitting.

I do wish this was divided into a “Fundamentals” and “Advanced” course.  This would allow for Joe to spend more time on the advanced topics.

You can check out a sample section of “Build a Network Application with Node” on YouTube here.

Ever want to build your own version of Siri that understands keywords specific to your app or business domain?  This can be done easily using Titanium and a few modules.  The below video is a proof of concept I put together to demonstrate some of what can be done.  Over the next couple of posts I’ll walk through the components used to create this example.

Ti Digital Assistant Video

Modules used:

iOS 7 introduced the speech synthesizer API AVSpeechSynthesizer.  With this API you can have iOS speak a phrase in the language of the text provided.  Used correctly this can add a compelling level of user interaction and direction to your app.

The Utterance iOS Titanium module provides a simple to use API for interacting with AVSpeechSynthesizer in the simulator or on device.

In just a few lines of code you can speak a phrase in any supported language.  Here is an example in Japanese.

First we require the module into our Titanium program


var utterance = require('bencoding.utterance');

Then we create a new Speech object

var speech = utterance.createSpeech();

Finally we call the startSpeaking method and provide the text we wish to have read.

    speech.startSpeaking({
        text:"こんにちは"
    }); 

For a full list of the methods available please visit the project n github here.

Here the module in action

The following is a video showing the module in action.

How to get the module:

Want to create a TableView Header Zoom effect like Foursquare, Tapbots, and others?  You can do this in Titanium with only a couple lines of code.

The following code snippet shows how to expand a Ti.UI.ImageView in a Ti.UI.TableView HeaderView to achieve a zoom like effect when the user over scrolls the TableView as demonstrated in the preview below.

TableViewHeader

'use strict';

var win = Ti.UI.createWindow({
    backgroundColor: 'white',
});

//Generate some sample rows
var rows = [];
for (var iLoop=0;iLoop<100;iLoop++){
    rows.push({ title: 'demo row #'+iLoop});
}

//Create our TableView, nothing special
var tableView = Ti.UI.createTableView({
    width:Ti.UI.FILL, height:Ti.UI.FILL,
    data:rows
});

//Create a ImageView for the TableView HeaderView
var imgView = Ti.UI.createImageView({
	width:Ti.UI.FILL, height:150,
	image:"cat.png"
});
//Set our ImageView as the headerView
tableView.headerView = imgView;

win.add(tableView);

//Need to capture a few session variables 
//The most important one is to grab the original height
// of the TableView HeaderView
var _scollTimer = null, 
	_origionHeight = tableView.headerView.height;

//Most of what we need happens in the scroll event
tableView.addEventListener('scroll',function(e){	

	//Clear our timer each time
	if(_scollTimer!==null){
		clearInterval(_scollTimer);
	}

	//If the user has scrolled past the header, 
        //reset the origional height
	if(e.contentOffset.y>_origionHeight){
		if(tableView.headerView.height !== _origionHeight){
			tableView.headerView.height = _origionHeight;
		}		
	}else{
		//Calculate our zoom or expand height
		var zoomOffSet = ((e.contentOffset.y<0)?-1:1);
		var zoomHeight = (tableView.headerView.height + 
					((zoomOffSet*-1)*
                          ((zoomOffSet*e.contentOffset.y)/3)));
		zoomHeight= ((zoomHeight > _origionHeight) 
                            ? zoomHeight : _origionHeight);
		if(tableView.headerView.height !==zoomHeight){
			tableView.headerView.height =zoomHeight;
		}			
	} 

	//Timer is needed since scrollend doesn't always fire
	//so just in case we set a timer to set the origional height
	if(e.contentOffset.y===0){
        _scollTimer = setTimeout(function()
        {
			tableView.headerView.height = _origionHeight;
        },250);		 
	}		
});

//If the user end scrolls something other then the 
//HeaderView check if we need to reset
tableView.addEventListener('scrollend',function(e){	
	if(_scollTimer!=null){
		clearInterval(_scollTimer);
	}	
	if(tableView.headerView.height !== _origionHeight){
		tableView.headerView.height = _origionHeight;
	}	
});

win.open();

Get this snippet on gist here.

With iOS 7 and the new flat design aesthetic many apps are using a blurred background or overlay to help set depth or attention.  The Ti.BlurView iOS native module now makes this easy to implement in Titanium.  Since we are using CoreImage you can use this in iOS 6 or greater.

Below shows Ti.BlurView example app.js in action, for a full walk through see the video here.

BlurView Demo
The Ti.BlurView module’s source is available on Github here.

You can get started today using Ti.BlurView with the following:

Please note you need iOS 6 or greater to use this module so make sure to set the min-ios-ver in your Titanium tiapp.xml to at least the value displayed below.

<min-ios-ver>6.0</min-ios-ver>

Below is a snippet showing how to create a blurred background image similar to the Yahoo Weather app.

var mod = require('bencoding.blur');

var win = Ti.UI.createWindow({
	backgroundColor:'blue'
});

var bgView = Ti.UI.createView({
	height:Ti.UI.FILL, width:Ti.UI.FILL,
	backgroundImage:"42553_m.jpg"
});
win.add(bgView);

var blurView = mod.createView({
	height:Ti.UI.FILL,
	width:Ti.UI.FILL,
	blurLevel:5, blurCroppedToRect:false,
        backgroundView:bgView
});
bgView.add(blurView);

win.addEventListener('open',function(d){

	var container = Ti.UI.createView({
		backgroundColor:"#fff", borderRadius:20,
		top:100, height:150, left:40, right:40
	});
	blurView.add(container);
	var label = Ti.UI.createLabel({
		text:"Show how to blur like the yahoo weather app.",
		color:"#000", width:Ti.UI.FILL,
		height:50, textAlign:"center"
	});
	container.add(label);

});

win.open();

You can also use the applyBlurTo method to create your own Blur View containers.  For information on how to do this please see the documentation here.

Xcode

PACKT recently provided the opportunity for me to review the Xcode 4 Cookbook by Steven Daniel.  As primarily a Titanium developer I spend most of my time in Sublime Text or Titanium Studio so I thought it would provide a good opportunity to spend more time in Xcode. 

First, the book title is alittle misleading.  I found this book to be more about iOS development then Xcode itself.  The author does cover Xcode in detail, but always in the context of building or profiling an app.  This approach made it both easier to read and to remember.

The book starts with covering the basics and then moves into creating user interfaces.  Having built most of my UIs through code it I found the content on Interface Builder and Storyboards helpful.  The recipes are easy to follow and very detailed, perfect for beginners. 

My favorite section of the book is around instruments.  Again the author walks us through these recipes in a very detailed easy to follow way.  As a side note, you can use the same steps outlined in these recipes in your Titanium project. You just need to generate a full Xcode project using transport.py as detailed here.  Coming from a non Xcode background, the navigation and descriptions of the options available for profiling made Xcode’s sometimes challenging interface easy to understand.

The chapter on iCloud provided a great “getting started” guide with a clear easy to understand recipe showing on to implement Document based storage using NSUbiquitousKeyValueStore.  This was a good introduction to iCloud and very easy for someone new to iCloud to follow along.  I do wish the author would have gone further on this topic and provided more details on storing greater the 64k documents.

The recipe using CoreImage provides a nice introduction to the topic and discusses a few of the common available filters.  This recipe provided a nice transition from the earlier CoreGraphic recipe.  I do wish the author would have provides a multi filter example though.

Overall, I really enjoyed reading this book and found the recipes helpful.  The detail and direction provided by the author makes all of the recipes easy to follow and quick to perform.  If you are new to iOS development or Xcode this book provides the resources needed to tackle that learning curve quickly.

Follow

Get every new post delivered to your Inbox.

Join 962 other followers