Workflow

This page pulls together key articles that are scattered throughout iphonedevlog. They are here to help me navigate to common resources quickly when I make or update my apps.

Please note that I use these links on a regular basis to make my apps; since I don’t code apps every day, I need to refer to these pages with every new app or update to keep on track. As a result, I am constantly updating these pages to keep up with software updates. 

New Setup

Setting Up Your Mac and Windows Development Environment for Cordova Android projects
https://iphonedevlog.wordpress.com/2014/10/30/setting-up-your-developmemt-environment-for-cordovaphonegap-android-projects/

New App

Using ADB Logcat to debug your Android app installation

A more descriptive title would be, “Using ADB logcat outside of ADT, Eclipse, or Android Studio to debug your Android app installation errors.” Did you try to install the app in your Android device, but got the annoying “Unfortunately, [app name] has stopped”? If so, then you need to run ADB logcat to find out why. Logcat allows us to read the logs that are automatically running in the background when we run the program. So when the app quits suddenly, we can read the messages along the way and pinpoint when it went south. Here are the steps to implement logcat.

Using npm in your Cordova Workflow

I decided to try npm (nodejs) and see how it could streamline my workflow. If you’ve been using Cordova or PhoneGap, you probably already have npm installed – you used npm to install either one in the first place. But it can do so much more.

Updating and Reverting to Different Apache Cordova Versions

If you want to update your version of Cordova to the latest version, or you want to revert to an earlier version (to test or debug), here are the steps to follow. I also have instructions on updating the plugins and platform versions here.

Resource:
https://github.com/apache/cordova-docs/blob/master/docs/en/5.0.0/guide/cli/index.md

Cordova blog for latest updates:
http://cordova.apache.org/blog/

Using the Desktop Safari Web Inspector to Debug Your Installed iOS App

 

You can install your app on your iOS device and monitor its usage on your desktop monitor, including console feedback. Here’s how.

Using Git Versioning Control Locally

You can add a versioning control system to track and manage your project’s assets with Git locally — you don’t need to upload it to git.com. Here’s how.

Downloading Git

Download Git from http://git-scm.com. It will detect your OS and provide the correct download for it. For my Mac, it was version 1.8.3.2.

The Mac version downloaded a dmg file to my Downloads folder. Double-click to open it, then double-click on the pkg file. (If your preferences prevent you from opening a file from an unidentified developer, then hold down Control, right-click on the pkg icon, and select open.) The Installer should appear; click to continue through the few steps, including providing your admin password. You’ll find a drive icon for the Git dmg package; right-click and select to Eject. (I believe “dmg” is short for “disc image.”) 

Easily Add Search Functions to Your App

I have been adding a Search function to my Cordova PhoneGap apps for a few years now. It is so easy that I want to share it with you who have wondered how to do the same. I use a product that works in Windows, and it creates a search database of all words in the HTML pages using Javascript. I’m using Zoom Search Engine 6.0 Professional Edition, available from http://www.wrensoft.com/zoom/. 

Fixing Android Lint Warnings Found when Building a PhoneGap Project

One of the checks you should make before creating your apk file for testing or uploading to an Android-based app store is the Run Lint command in Eclipse. This is found when you right-click on your project name in the Project Explorer, and select Android Tools > Run Lint…

The Lint Warnings view will show various performance, correctness, security, and other Android-environment-specific problems that may give rise to your app not loading or working in your device. (You would not use Lint to check for the validity of your HTML; you would use Validate for that.)

Preview the Cordova 2.3.0 iOS inAppBrowser now!

This feature, built into Cordova 2.3.0, will take the place of ChildBrowser for me. Here are the steps to take to preview it yourself.

1. Download the zip file from https://github.com/apache/cordova-ios

How to selectively remove files or directories from Trash in the Mac

Sometimes you’d like to remove just a few files or directories from Trash, like a couple of 500MB downloads you know you won’t use again, and they’re just hogging space. Yet you want to leave the other files there just in case. Currently, Mac’s Trash only provides an “Empty Trash” option for the entire contents. (Windows, on the other hand, allows users to click on a file or folder and tap the Delete key to remove it. Nice!) Here is how you can selectively delete files and directories from the Mac Trash bin.

Replace Your Button’s Raster Icons for Font Icons

When we use raster icons on our buttons, such as a 16 x 16 PNG graphic of an Export icon, the size may be right for a small handheld device. But when the same page is viewed in a larger device that scales up the images, the icon will look less than its best. Of course, we can use larger icons to begin with and let them scale up or down, but there is a better way.

Our best bet is to use font icons. That is, fonts that are not letters, but come in the shape of familiar icons. Fonts resize to any size and still retain their sharpness. Their storage size is lighter than raster icons. If we use a font in place of a small icon, it will remain crisp no matter the resolution or size of the device. Who knows what larger resolutions and pixel densities are coming up in the future?

Here is how to add font icons to a button.

Introduction to GitHub

Setup used: Mac OS X Mountain Lion 10.8, Xcode 4.5.1. The version of PhoneGap is not an issue in this article.

Xcode allows us to add source control to a project, such as online by using GitHub.com, or just publishing it locally. With source control on github.com, we could go backward and forward in time to various stages of code changes, and even create a new branch to test or create a different version of the project. That collection of a project’s files is called a repository. GitHub.com allows us to create public repositories (free) or private (paid monthly).

There are several helpful tutorials on how to start a GitHub repository (git repo) when starting a new Xcode 4 project, but I wanted to learn how to create a git repo from an existing Xcode 4 project where the repository option had not been checked when starting up.

Xcode already allows us to make a Snapshot of a project’s state and get back to it, but a GitHub repository has extra advantages of being able to share your code with others as well as store it offsite. I wanted to write about a how-to article on a recent project I worked on and make it available to everyone for download. It was a great time to try out GitHub.com. My final modest effort is seen here: https://github.com/iPhoneDevLog/fonts-bookmarks-notes 

Making an Offline Web App: From Start to Finish, updated 9/21/2012

Here are the steps I followed to create my first successful web app

Create the app files first

1) Create a web app with HTML, CSS, and JS that will support HTML5 specs, and put all the files in their various folders. Make sure all is working in the browser. Ideally, one should use a Jquery-type html page where all pages and content are linked to just one html page, not multiple html pages. That way, when the one page is loaded in the mobile brower, all resources are cached at once and will be available for offline use immediately. Otherwise, one would have to navigate through every page to cache all the resources.

Put all folders in a central folder named just for that app, such as /widget_appname/ if your app is about a widget.

2) In your index.html page, make your <title> the name you want under the web app icon on the home screen, up to 11 characters.

3) Make a “file not found” notice and name it “offline.html” with perhaps a way for the visitor to email you of this problem.

Saving localStorage to a more secure folder location

If you are worried whether your localStorage will persist after an iOS version upgrade or be backed up to iCloud, one coder, Kerri Shotts, has graciously given us a Javascript script that saves the localStorage data to a secure folder within iOS. Her code periodically saves localStorage data at set intervals. (This code has been updated. See bottom of article.)

PhoneGap plugins in iOS complaining about deprecations and what you might be able to do about it

PhoneGap plugins in iOS complaining about deprecations and what you might be able to do about it.

Apple App Store Application Assets Template

I put this page at the top of the site for quicker access. View it here.