Google’s new OAuth2 mechanism for native apps

So far the OAuth2 authentication could be performed with embedded browsers in iOS and Android. However Google has decided that they want apps to use the default browser instead now. One reason is that the default browser might already know the user due to cookies and can shorten the authentication process. The other reason might be that apps could have theoretically captured the entered password when using an embedded browser. Anyway to switch an iOS app from the old authentication method using GTMOAuth2ViewControllerTouch to the new using OIDAuthorizationRequest requires only a few steps due to the useful library GTMAppAuth:

Create a file called “Podfile” and use it to download and install GTMAppAuth:
```
target 'YourProjectName' do
 platform :ios, '7.0'
 pod 'GTMAppAuth'
end
```
Install Cocoapods if necessary and then run
```
pod install
```

Open the created Xcode workspace file. Delete the following old files if you have them:

GTMGatherInputStream.h
GTMGatherInputStream.m
GTMMIMEDocument.h
GTMMIMEDocument.m
GTMReadMonitorInputStream.h
GTMReadMonitorInputStream.m

Add a property to your AppDelegate.h file:

@property(nonatomic, retain) id currentAuthorizationFlow;

Add a handler to your AppDelegate.m file in the application:openURL:sourceApplication:annotation: method. Put this right at the start of the method:
```
if ([_currentAuthorizationFlow resumeAuthorizationFlowWithURL:url]) {
 _currentAuthorizationFlow = nil;
 return YES;
}
```

Now you are ready to replace your old authentication code which used GTMOAuth2ViewControllerTouch with the new code (taken partially from the GTMAppAuth website):

OIDServiceConfiguration *configuration = [GTMAppAuthFetcherAuthorization configurationForGoogle];

OIDAuthorizationRequest *request = [[[OIDAuthorizationRequest alloc] initWithConfiguration:configuration
 clientId:GOOGLE_CLIENT_ID
 clientSecret:GOOGLE_CLIENT_SECRET
 scopes:@[OIDScopeEmail, @"https://www.googleapis.com/auth/calendar"]
 redirectURL:[NSURL URLWithString:@"com.example.yourapp:/oauthredirect"]
 responseType:OIDResponseTypeCode
 additionalParameters:nil] autorelease];

 // performs authentication request
 AppDelegate *appDelegate = [[UIApplication sharedApplication] delegate];
 appDelegate.currentAuthorizationFlow =
 [OIDAuthState authStateByPresentingAuthorizationRequest:request
 presentingViewController:self
 callback:^(OIDAuthState *_Nullable authState,
 NSError *_Nullable error) {
 if (authState) {
 // Creates the GTMAppAuthFetcherAuthorization from the OIDAuthState.
 GTMAppAuthFetcherAuthorization *authorization = [[[GTMAppAuthFetcherAuthorization alloc] initWithAuthState:authState] autorelease];

Using the authorization result you can now call your existing handler:

[self viewControllerFinishedWithAuth:authorization error:error accessToken:authState.lastTokenResponse.accessToken];
 NSLog(@"Got authorization tokens. Access token: %@",
 authState.lastTokenResponse.accessToken);
 } else {
 NSLog(@"Authorization error: %@", [error localizedDescription]);
 }
 }];

}

- (void)viewControllerFinishedWithAuth:(id )auth error:(NSError *)error accessToken:(NSString *)accessToken {
 if (error == nil) {
 // OAuth2 Login was successful
 // Serialize to Keychain
 [GTMOAuth2KeychainCompatibility saveAuthToKeychainForName:keychainNameOAuth2
 authentication:auth];

Now you can use “accessToken” to access Google services. And due to GTMOAuth2KeychainCompatibility you can keep your existing functions that load the authentication data from the keychain.

In the Info.plist file of your app you have to configure the “com.example.yourapp” URL mentioned above so that the browser can open your app and send you the result:

CFBundleURLTypes

    
        CFBundleTypeRole
        Editor
        CFBundleURLSchemes
        
            com.example.yourapp

So that’s all you have to change for an existing iOS app. You can find further information in Google’s blogpost.

Search apps for old iOS versions in the Apple AppStore

Looking for a way to find iOS apps for an older iOS device that does not support the latest iOS version? Here you can search the AppStore and view the release date and the current minimum OS version. Using the release date you can determine if there might be an older version of the app … Continue reading “Search apps for old iOS versions in the Apple AppStore”

Looking for a way to find iOS apps for an older iOS device that does not support the latest iOS version? Here you can search the AppStore and view the release date and the current minimum OS version. Using the release date you can determine if there might be an older version of the app that supports an older iOS version than the current minimum OS version. When installing the app on and old device the AppStore will usually ask you if you would like to install an old version that is compatible to your device.

	Version	Rating	Release date	Price	Title
	{{row.minimumOsVersion}}	{{row.averageUserRating}}	{{row.releaseDate}}	{{row.formattedPrice}}	{{row.trackName}}

Using a free SSL certificate from Let’s encrypt with Jetty

Let’s encrypt offers free SSL certificates that can also be used with Jetty. The following steps show how to get an install such a certificate: Installation To install the letsencrypt client on a Linux system, just enter these commands: $ git clone https://github.com/letsencrypt/letsencrypt $ cd letsencrypt $ ./letsencrypt-auto –help Request the certificate To request the … Continue reading “Using a free SSL certificate from Let’s encrypt with Jetty”

Let’s encrypt offers free SSL certificates that can also be used with Jetty. The following steps show how to get an install such a certificate:

Installation
To install the letsencrypt client on a Linux system, just enter these commands:

$ git clone https://github.com/letsencrypt/letsencrypt
$ cd letsencrypt
$ ./letsencrypt-auto --help

Request the certificate
To request the certificate run this command:
```
./letsencrypt-auto certonly -d yourdomain.com --webroot -w /var/www/
```
To verify the address of your server letsencrypt needs to know the directory of your http server. In this example an Apache is used with the directory /var/www/ (and Jetty runs only on the https port).

Convert the certificate into a format Jetty can use

openssl pkcs12 -export -in /etc/letsencrypt/live/yourdomain.com/fullchain.pem -inkey /etc/letsencrypt/live/yourdomain.com/privkey.pem -out fullchain_and_key.p12 -name jetty
keytool -importkeystore -destkeystore keystore_le -srckeystore fullchain_and_key.p12 -alias jetty
keytool -import -destkeystore keystore_le -file /etc/letsencrypt/live/yourdomain.com/chain.pem -alias root

Install the certificate in Jetty
Just reference the keystore_le file that you have created in the etc/jetty-ssl.xml file:
```
/
/
```
Stop and restart Jetty

URLEncode Online

Here is a simple form that can URLEncode a given text. This can be useful when programming or writing HTML pages. Text: Convert UrlEncode:

Here is a simple form that can URLEncode a given text. This can be useful when programming or writing HTML pages.

Free Table Element/Plugin for RapidWeaver and Stacks

If you are looking for a simple and free way to add a table to your Stacks page, you can use one of these, just unzip them and copy them into ~/Library/Application Support/RapidWeaver/Stacks before starting RapidWeaver: There are two variants: With custom Stack Elements in each cell: Download FreeTableStack.stack With text in each cell: Download … Continue reading “Free Table Element/Plugin for RapidWeaver and Stacks”

If you are looking for a simple and free way to add a table to your Stacks page, you can use one of these, just unzip them and copy them into ~/Library/Application Support/RapidWeaver/Stacks before starting RapidWeaver:

There are two variants:

With custom Stack Elements in each cell:

Download FreeTableStack.stack

With text in each cell:

Download FreeTableTextStack.stack

Settings:

Both Stacks Element allow you to configure the columns and rows of your table and you can specify the colors for the header cells and the lines:

If you would like to add an own style, just open the .stacks file and edit the styles.css file.

Building simple RapidWeaver Stack Elements

I am using RapidWeaver for a few websites. The “Stacks” plugin is really useful and makes RapidWeaver very flexible. You can add new “Stack Elements” to your library in RapidWeaver to get new ways to format or style your content. Most “Stack Elements” have to be bought. Some are really good and worth the money … Continue reading “Building simple RapidWeaver Stack Elements”

I am using RapidWeaver for a few websites. The “Stacks” plugin is really useful and makes RapidWeaver very flexible. You can add new “Stack Elements” to your library in RapidWeaver to get new ways to format or style your content. Most “Stack Elements” have to be bought. Some are really good and worth the money but if you only want something really simple you can easily do it yourself for free. Just follow the steps below:

First you can download a simple example project that contains a nearly empty Stack Element that contains only text:

SimpleExample.stack

Just unzip it and copy it into your Stacks directory ~/Library/Application Support/RapidWeaver/Stacks to make it appear in RapidWeaver (after the next restart):

When you insert it into a page you can enter some text:

This text will then simply appear on the website. Until this point it certainly isn’t very useful yet. But now you can start customizing it to your needs:

Open ~/Library/Application Support/RapidWeaver/Stacks, right click on “SimpleExample.stack” and choose “Show Package Contents”. You should find three files:

Info.plist: Here you can change the version number and add your own ID.
styles.css: Here you can enter any CSS styles you need.
template.html: This is the HTML file that will be inserted into the page. It can contain HTML code and certain variables that Stacks will replace with content. In this example it contains only a div with the keyword “%text%”, which means that your page contains text that should be inserted here.

Now try to modify the template.html file. Add a second div section like this:

div id="SimpleExample%id%">
%text%

%text%

Then click on “Developer > Reload” in RapidWeaver:

Afterward your Stacks Element should have two text fields:

To embed other Stacks Elements just write “%slice%” instead of “%text%” in your template.html file:

This way you can easily add your own custom Stack Elements, style them with CSS and use them in your projects.

You can find a reference explaining all Stacks variables and the folder structure on the Stacks API page.

UI Test under Android (UIAutomator/Espresso)

Android also offers a way to run UI tests. Several libraries are available but the latest officially supported libraries seem to be Espresso and UIAutomator. UIAutomator is newer but requires API Level 14. You can find a short description here: http://developer.android.com/training/testing/ui-testing/uiautomator-testing.html Espresso needs only API level 8 but is more limited and cannot create screenshots … Continue reading “UI Test under Android (UIAutomator/Espresso)”

http://developer.android.com/training/testing/ui-testing/uiautomator-testing.html

Espresso needs only API level 8 but is more limited and cannot create screenshots on its own:

http://developer.android.com/training/testing/ui-testing/espresso-testing.html

While they are similar to the iOS UI tests they seem to be much more hardware dependent. E.g. where iOS can also find and tap table rows that are outside the screen (which makes it easier to support different screen sizes for the tests) Android “sees” only what is on the screen, making it necessary to add swipe gestures, which makes the tests dependent on a certain screen size.

To find out how to access a certain screen element you can use the “uiautomatorviewer” program.

Automatically starting the app on multiple devices

If your app is compatible with older Android versions but you are also using new features, you have to take care not to load the classes that are only available on newer Android versions on old Android versions, otherwise your app will crash. So it is also useful to run the tests on multiple emulators with different Android versions. For this purpose you can add some lines to your build.gradle file:

task testemulator << {
  emulatorstart("Test16")
  emulatorstart("Test23")
  emulatorstart("Test40")
}

def emulatorstart(emulatorname) {
  Process process = ("emulator -avd " + emulatorname + " -gpu off").execute()
  Thread.sleep(60000)
  "adb -e shell input keyevent 82".execute().waitFor() // unlock screen
  "adb -e uninstall com.example.app".execute().waitFor()
  "adb -e install build/outputs/apk/example.apk".execute().waitFor()
  "adb -e shell am start -n com.example.app/com.example.app.Main".execute().waitFor()
  Thread.sleep(10000)

  // Here you could run your tests. In this example a screenshot is saved.
  "adb shell screencap -p /sdcard/screen.png".execute().waitFor()
  ("adb pull /sdcard/screen.png " + emulatorname + ".png").execute().waitFor()
  "adb shell rm /sdcard/screen.png".execute().waitFor()
  process.waitForOrKill(10000)
}

By running

gradle testemulator

your app will be installed on all specified emulators (e.g. "Test16", "Test23" and "Test40") and started. Afterward a screenshot with the name of the emulator will be created. This way you can run it (which takes a while) and then check the screenshots to see if it was successfully started on all these emulators and Android versions.

Screenshots

Screenshots on newer Android devices can be created in the way described above. However e.g. Android 2.x does not have the "screencap" program installed. If you would like to create screenshots with older Android versions or if "screencap" does not work, you can use a Java program that you can find here. To integrate it into the gradle script above just replace the three lines

"adb shell screencap -p /sdcard/screen.png".execute().waitFor()
("adb pull /sdcard/screen.png " + emulatorname + ".png").execute().waitFor()
"adb shell rm /sdcard/screen.png".execute().waitFor()

with

screenshot(emulatorname);

and add the following function to your gradle file:

def screenshot(emulatorname) {
    exec {
        executable "java"
        args "-jar", "/path/to/your/downloaded/screenshot.jar", "-e", "screenshots/" + emulatorname + ".png"
    }
}

Opening all screenshots

To open all screenshots under MacOS to review them, just use the command

open screenshots/*

This will start Preview and open all images in a single window with a list of thumbnails so that you can quickly see if your app was started correctly on all these devices.

Selecting ListView elements

When displaying lists it can often happen that you have to click on an entry that is not visible on the screen. When it isn't visible on the screen then there is not even a view for it, so the normal test functions cannot find and click that view. That's what "onData" is for. Instead of searching for a visible view it searches the adapters of the visible views for matching elements. E.g.

onData(hasToString("Test")).perform(click());

clicks on the row of any ListView (or Spinner or other element with an adapter) that returns "Test" from its "toString()" method. If you have multiple objects with an adapter on the screen (e.g. a ListView and Spinners), you can limit the commmand to the ListView

onData(hasToString("Test")).inAdapterView(withClassName(Matchers.is(ListView.class.getName()))).perform(click());

UI Tests with XCode 7 and XCTestCase

In XCode 7 direct support for two types of tests has been added: Unit tests: These tests can access your project’s classes and are directly linked to your project. They are used for low-level tests where you test the functions of your classes. Usually one test class for one project class is created. UI tests: … Continue reading “UI Tests with XCode 7 and XCTestCase”

In XCode 7 direct support for two types of tests has been added:

Unit tests: These tests can access your project’s classes and are directly linked to your project. They are used for low-level tests where you test the functions of your classes. Usually one test class for one project class is created.
UI tests: These tests run independently of your project and perform UI actions. I.e. they cannot access the classes or data of your app. But they can use the app like a user, i.e. they can interact with it, tap buttons, enter text etc.

To add such tests to your existing project just choose “New > Target” in XCode 7:

It will create example classes that make it easier to start. To create a new UI test is also simple. Just create an empty function, e.g.

- (void)testEverything {
}

Then place the cursor in this function an click on the record button to start the simulator and record your actions as commands into the method:

To run the tests when you are finished just long click on the play button in XCode and select “Test”.

Snippets for UI test

Turning a switch on:

if ([tablesQuery.switches[@"My switch label"].value isEqualToString:@"0"]) {
    [tablesQuery.switches[@"My switch label"] tap];
}

Checking the position of a row in a table:

XCTAssertLessThanOrEqual([[app.staticTexts[@"My row label"] coordinateWithNormalizedOffset:CGVectorMake(0, 0)] screenPoint].y, 90);

Searching for a table row that starts with “Until:” (you can find a reference of the BEGINSWITH and similar commands here):

[[app.staticTexts elementMatchingPredicate:[NSPredicate predicateWithFormat:@"label BEGINSWITH 'Until:'"]] tap];

Displaying all currently visible elements:

NSLog(app.debugDescription);

Overview of the available functions:

http://masilotti.com/xctest-documentation/index.html

New iOS 9 attribute readableContentGuide

With iOS 9 the default UITableViewCell looks different on iPads now. It has a larger margin on the left and right side: This margin is used if the attribute cellLayoutMarginsFollowReadableWidth is set, which is turned on by default. That means by default your table view cells will now have this larger margin. However when creating UITableViewCells from … Continue reading “New iOS 9 attribute readableContentGuide”

With iOS 9 the default UITableViewCell looks different on iPads now. It has a larger margin on the left and right side:

This margin is used if the attribute cellLayoutMarginsFollowReadableWidth is set, which is turned on by default. That means by default your table view cells will now have this larger margin. However when creating UITableViewCells from XIB files, you have to use Auto-Layout and you have to turn “Preserve Superview Margin” and “Follow Readable Width” on for the “Content View” of your UITableViewCell to make your custom cell use the same margins:

And when creating horizontal Auto-Layout constraints you have to ensure that “Constrain to margins” is checked:

Otherwise your custom cells would have no margin and would not be correctly aligned with the other rows in the table.

iOS 11 and iPhone X

The same is now also necessary to display tables in landscape mode on the iPhone X. Because the iPhone X has a notch that is at the side of the screen in landscape mode and can overlap the text of the table cells if the readableContentGuide is not used.

E.g. to programmatically align “textLabel” correctly you could write this:

[self addConstraint:[textLabel.leadingAnchor constraintEqualToAnchor:self.readableContentGuide.leadingAnchor]];
[self addConstraint:[textLabel.trailingAnchor constraintEqualToAnchor:self.readableContentGuide.trailingAnchor]];

If you have tried the above and it still doesn’t work then click on the leading/trailing constraints one by one and ensure that the “Relative to margin” checkmark is set:

iPhone X and custom table headers

When using

- (UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section

to set a custom header for your table view you have to return a normal view. If you use a XIB file you can just check “Follow Readable Width”. But if you are creating the view programmatically, you have to return a view that contains another view (like the contentView of a table cell) and that view then contains your content, e.g. “view(view(label))”. E.g. like this if “self” is the topmost view:

UIView *pane = [[[UIView alloc] init] autorelease];
pane.translatesAutoresizingMaskIntoConstraints = FALSE;
[self addSubview:pane];

[self addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|-[pane]-|" options:0 metrics:nil views:NSDictionaryOfVariableBindings(pane)]];
UILayoutGuide *guide = self.readableContentGuide;
[guide.leadingAnchor constraintEqualToAnchor:pane.leadingAnchor].active = TRUE;
[guide.trailingAnchor constraintEqualToAnchor:pane.trailingAnchor].active = TRUE;

[pane addSubview:textLabel];

self.textLabel = [[[UILabel alloc] init] autorelease];
textLabel.translatesAutoresizingMaskIntoConstraints = FALSE;
[pane addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-[textLabel]-|" options:0 metrics:nil views:NSDictionaryOfVariableBindings(textLabel)]];
[pane addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|[textLabel]|" options:0 metrics:nil views:NSDictionaryOfVariableBindings(textLabel)]];

Adding iCloud to an app

Syncing files via iCloud in an app is easy and can be done with a few steps. It syncs a certain directory between devices so that you have the same files available on every device of the same user: Turn iCloud support on in XCode for your project. You just have to turn the switch … Continue reading “Adding iCloud to an app”

Syncing files via iCloud in an app is easy and can be done with a few steps. It syncs a certain directory between devices so that you have the same files available on every device of the same user:

Turn iCloud support on in XCode for your project. You just have to turn the switch on and turn iCloud Documents on in the next screen that appears.. Afterward the app can use the iCloud and has a directory that is automatically synced between devices.

To move a local file into the iCloud you just have to move it from a local directory into the iCloud directory using a special command. The sync is performed automatically afterward:

NSError *error = nil;
NSURL *ubiq = [[NSFileManager defaultManager] URLForUbiquityContainerIdentifier:nil];
NSURL *targetDirectory = [ubiq URLByAppendingPathComponent:@"Documents"];
[[NSFileManager defaultManager] setUbiquitous:TRUE itemAtURL:sourceFileURL destinationURL:[targetDirectory URLByAppendingPathComponent:filename] error:&error];

When reading files from the iCloud you have to take into account that they might not have been downloaded yet. So to read a file from the iCloud you have to trigger a download and then wait for the file:

[[NSFileManager defaultManager] startDownloadingUbiquitousItemAtURL:fileURL error:&error];

NSFileCoordinator *coordinator = [[[NSFileCoordinator alloc] initWithFilePresenter:nil] autorelease];
[coordinator coordinateReadingItemAtURL:fileURL options:0 error:&error byAccessor:^(NSURL *newURL) {
   // Here you can access the downloaded file.
}];

These are the basic steps to use iCloud with files (there are also other options, this here is just a simple way to sync files). However there are some more useful functions:

Listing files

While OS X automatically downloads all iCloud files, iOS doesn’t. So it can happen that you won’t find all available files in the iCloud directory. Instead you have to use a special function to get a list of available files. It is again asynchronous:

self.queryiCloudMetaData = [[[NSMetadataQuery alloc] init] autorelease];
queryiCloudMetaData.searchScopes = @[NSMetadataQueryUbiquitousDocumentsScope];
[[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(refreshiCloudFiles:) name:NSMetadataQueryDidFinishGatheringNotification object:self.queryiCloudMetaData];
[queryiCloudMetaData startQuery];

- (void)refreshiCloudFiles:(NSNotification *)notification {
    [queryiCloudMetaData stopQuery];

    for(NSMetadataItem *item in [queryiCloudMetaData results]) {
       // process the iCloud file item
    }

    self.queryiCloudMetaData = nil;
}

Deleting a file

To delete a file you have to use an NSFileCoordinator to access the file and then an NSFileManager function to delete it:

NSFileCoordinator* fileCoordinator = [[NSFileCoordinator alloc] initWithFilePresenter:nil];
[fileCoordinator coordinateWritingItemAtURL:fileURL options:NSFileCoordinatorWritingForDeleting
 error:nil byAccessor:^(NSURL* writingURL) {
 NSFileManager* fileManager = [[NSFileManager alloc] init];
 [fileManager removeItemAtURL:writingURL error:nil];
}];

Key-Value table

This is an even easier method to sync via iCloud. To save a value into the synced key value table just write

[[NSUbiquitousKeyValueStore defaultStore] setString:@"test" forKey:@"testkey"];

And to read a value write

[[NSUbiquitousKeyValueStore defaultStore] objectForKey:@"testkey"];

The key-value table is automatically synced between all devices that are connected to the iCloud account. To be informed when something changes register an observer:

- (void)registeriCloudKeyValue {
    // register to observe notifications from the store
    [[NSNotificationCenter defaultCenter]
            addObserver: self
               selector: @selector(storeDidChange:)
                   name: NSUbiquitousKeyValueStoreDidChangeExternallyNotification
                 object: [NSUbiquitousKeyValueStore defaultStore]];

    // get changes that might have happened while this
    // instance of your app wasn't running
    [[NSUbiquitousKeyValueStore defaultStore] synchronize];
}
- (void)storeDidChange:(NSNotification *)notification {
    ...

Then you can access the changed keys using

NSArray *changedKeys = userInfo[NSUbiquitousKeyValueStoreChangedKeysKey];

iOS Simulator

To test these iCloud functions with the iOS Simulator you have to sign in to your iCloud account in the “Settings” app of the iOS Simulator. I have tested it with iOS 8.4 and it mostly works, but there are some problems:

Changes to Key-Value tables seem to be only sent to the iCloud but they are not received.