Strap Kit requires git, python, node, and npm at a minimum, and platform specific SDK's like Pebble and Android Wear to build for those platforms. To check your dependencies, you can run the command below (requires curl and bash). For a full run down of how to install the dependencies, go to the full developer docs.
strapkit create generates a starter app.js in ./TestProject/js. This is where you write your app using the API documentation below.
Choose deployment platforms.
gt; strapkit platform add pebble android-wear
OR, to add just one platform only, you may specify that platform by itself.
gt; strapkit platform add pebble
Removing platforms is just as easy as adding them.
gt; strapkit platform remove pebble
Compile for all platforms.
gt; strapkit build
OR, to compile for one platform only, you may specify just that platform.
gt; strapkit build pebble
If you wish to forego using Strap kit to install your app, the compiled binary of your app is available in a "build" folder after running the Strap kit build command.
Install to device.
# When not using pebble
gt; strapkit install
# IP Required for pebble
gt; strapkit install Phones.IP.Goes.Here
Publish 'n' Profit!
Write your first cross platform app
Page
A Page is the container for all your app's UI. When you create a new page, you are bringing the user to a different set of looks and actions.
Example
var splashPage = StrapKit.UI.Page();
var card = StrapKit.UI.Card({
title: 'Weather App',
body:'Loading data now...'
});
// Adds content to a Page
splashPage.addView(card);
// Tells your wearable app to show this page
splashPage.show();
Initialize
var page = StrapKit.UI.Page();
OR
var page = StrapKit.UI.Page(cardView);
var page = StrapKit.UI.Page([textView, anotherView]);
Add View
page.addView(textView);
Show Page
page.show();
Card View
Card is a standard wearable UI component across all platforms. This UI
component typically has a title and a body associated with it, and can be
clickable. This must be added to a Page in order for the component to be shown.
Example
var card = StrapKit.UI.Card({
title: "My First App",
body: "Writing apps are easy with StrapKit JS"
});
myPage.addView(card);
Initialize
var card = StrapKit.UI.Card({
title: 'My Title', // The title of your card
body: 'My Body', // The body of your card
onClick: function() { // What happens when you click on the card
console.log('My Function');
}
});
Set On Click Function
card.setOnClick(function() {
console.log("My Card was clicked");
});
TextView
TextView is a standard wearable UI component across all platforms. This UI
component can show text and a position of your your choosing.
StrapKit.UI.TextView({
position: 'center|right|left'
// center: puts text center justified within your page
// right: puts text right justified within your page
// left (default): puts text left justified within your page
});
ListView
ListView is a standard wearable UI competent across all platforms. This UI
component will show a list of items defined by you. And Item will contain a
title and a subtitle as strings. To make the app more interactive, you can
attach an object to and Item as data.
Example
var menuItems = [
{
title: 'My Title 1',
subtitle: 'My Subtitle 1',
data: {info: "My Info 1"}
},
{
title: 'My Title 2',
subtitle: 'My Subtitle 2',
data: {info: "My Info 2"}
}];
var resultsMenu = StrapKit.UI.ListView({
items: menuItems
});
resultsMenu.setOnItemClick(function(e) {
console.log(JSON.stringify(e.item));
// { "title":"My Title 1","subtitle":"My Subtitle 1","data":{"info":"My Info 1"}}
console.log(e.itemIndex);
// 0
});
Set On Item Click
myList.setOnItemClick(function(e) {
e.item // returns the item you clicked on containing title, subtitle and data
e.itemIndex // returns the index of the item you clicked on
});
HttpClient
HttpClient allows you to access API clients outside of the wearable app.
With StrapKit JS, adding Strap Metrics to your app is a breeze.
Initialize
Initializing Strap Metrics allows you to immediately get access to diagnostics and sensor data. You can then log events that are specific to your app.
var app_id = "8djanek08sdjk";
StrapKit.Metrics.init(app_id); // Metrics will start logging sensor data
// Log an event
StrapKit.Metrics.logEvent("/myfirstevent/winning");
// Log an event with data
var myInfo = {info: "This was easy"};
StrapKit.Metrics.logEvent("/myfirstevent/data", myInfo);
Location
StrapKit JS can leverage native geolocation in Javascript to get the location of the device. A callback can be used to extract the position from the successful function. The generic form of this method is: