Tuesday 29 September 2015

iOS 9-ify your Xamarin.Forms App

It's not just regular Xamarin.iOS apps that can implement fancy iOS 9 features :) Check out the quick hacks I did to this Restaurant Guide Xamarin.Forms sample to add iOS 9 features:





Mostly using the magic of Dependency Service I added:


No special work was required to get the app running with iPad Multitasking, other than to ensure there was a Storyboard (or XIB) Launchscreen.



Finally, I added the Application Transport Security "opt-out" tags to the Info.plist file, so that the links to all the different restaurants would work in the WebView control.

Download the code from github to try for yourself!

p.s. Ignore the fact that this sample uses Razor templates to generate the restaurant detail view. That is merely a coincidence - this existing Xamarin.Forms sample was the most appropriate to add iOS 9 features to. iOS 9 features can be added to any Xamarin.Forms app, whether it displays data with XAML, C#, or in a Razor HTML template ;)

Sunday 27 September 2015

iOS 9-ify your Xamarin App

With the iPhone 6s models now available, it's possible to build and test all the great new features of iOS 9 with Xamarin. To demonstrate, I've tried to squeeze as many iOS 9 features as possible into one sample: To9o app (that's "Todo" but with a "9" :-) The c# code is on github and screenshots of each iOS 9 feature are shown below.

3D Touch

3D Touch can used a few different ways, but requires an iPhone 6s to test (the Simulator doesn't support 3D Touch). I started by adding these two:

Multitasking for iPad

If the app can resize its UI appropriately, it should work fine for multi-tasking!

ContactsUI

The "Todo" app doesn't traditionally need an interface to the Contacts list, but I added it just to give this new API a try :)

New Search APIs

The new search APIs let you expose content to search and Siri. I've added both:
Notice the Back to Search button in the navigation bar.

UIStackView

This new layout option makes it much easier to build screens that 'scale', and also makes it even easier to support RTL languages (see below).
* Note: currently UIStackViews must be drawn using Xamarin's Xcode integration, but the built-in Xamarin iOS Designer will support them soon!

Collection View Changes

The main Todo list is a UICollectionView rather than a table, so it can demonstrate how easy it now is to re-order items with two simple methods added in code.

Right-to-Left Language Support

The entire app can now automatically flip (including UINavigationController animations) when displaying RTL languages like Arabic and Hebrew (note: machine translation used for example, apologies for any inaccuracies).

SFSafariViewController

This new API makes it easy to implement an in-app web browsing experience with a line or two of code. I've used it just for an "About" window.



All these improvements are explained in Xamarin's iOS 9 docs, and the code is available to review. It is still a work-in-progress so check back for more updates. 

Wednesday 18 March 2015

Microsoft Band SDK + Xamarin

Band-fans were happy to see Microsoft release their Java Android SDK for Microsoft Band a few weeks ago, and their Objective-C iOS SDK this week. Xamarin was then able to almost immediately release the Microsoft Band SDK component for iOS and Android, giving you the same functionality but entirely in C# for all three mobile platforms...

I decided to give it a try, converting my "magic eight ball" apps for Xamarin.Forms and Apple Watch to the Band. The idea is: you shake your wrist and the "prediction" appears on the Band!


It works because there is an Android app running on the paired phone, using the Band SDK. The app is tracking the Band's accelerometer, and using the readings to decide when you've shaken your wrist a couple of times.

When the shake-detection is triggered, the app picks a random number, pushes a new Tile onto the Band (if it doesn't already exist), and then sends a message for the tile with a random "prediction".

The Android app is simple, it contains only a Connect button to connect to the Band, and a Vibrate button to test the connection (plus a label that displays the "prediction" text that is sent to the Band).


The code for this Android sample is available on github, hopefully I'll get the iOS version running soon.

If you want to get more info about developing for the Band, check out Matt's detailed blogpost with code.



Finally, Microsoft built a quite detailed Android app that demonstrates all aspects of their SDK, and Matt did an amazing job of porting it to Xamarin - check that out too!




Saturday 21 February 2015

Apple Watch Kit round-up

It's Saturday, a good excuse for a 'fun' post. Here's a little collection of tidbits about the Apple Watch...



Apple: Watch Kit - if you're thinking of developing for the platform, might as well start at the source :)

Wareable: The best Apple Watch apps... - some great screenshots of apps already being built, including Clear, BMW, and Nike. It's interesting to see the UI design approach being taken by different developers. Check out the similar list on ibtimes.com

WatchAware: Watch Apps - great catalog of watch app demos.

FastCompany: How the Apple Watch will work... - a couple of thoughts on app design, and screenshots of Todoist.

eleks labs' unofficial Tesla app - more design thoughts and prototype video (unofficial development, not affiliated with Tesla)..

Daring Fireball: On the Pricing of the Apple Watch - so yeah, "starting at $349" sounds like it's going to be the understatement of the year.

WatchKit FAQ - awesome collection of questions and answers (and cute watch drawings too).

MartianCraft: Designing for the Apple Watch with Briefs - even if you don't use the tool (which looks great) this is a lovely post on Watch app design.

Five Minute Watch Kit - good collection of blog posts.

If that's got you interested in building apps for the Apple Watch, it's time to check out Xamarin's Watch Kit Preview and how to get started (inc video) and my first watch app.



I've also got a couple of samples, including Magic 8 Ball, Calculator, Insta, and Todo for you to try.

^ watch frame screenshots generated with Bezel thanks to the fine folks at infinitapps.

Tuesday 20 January 2015

Apple Watch Kit programming with C# (and Xamarin)

For my "Your First Xamarin.Forms App" talk at Evolve this year I built a very simple version of the classic "Magic Eight Ball" fortune-telling app. Seemed like a perfect example to adapt for my First Apple Watch App. It's built in C# using Xamarin (of course); Xamarin's Watch Kit Preview came out today!

Here is the finished app: a simple display that answers any question you ask ;-) Force Touch on the screen to pop-up the menu to ask another question (Shake), or simply say "Thanks". Grab the code from Github.
^ watch frame screenshots generated with Bezel thanks to the fine folks at infinitapps.

Apple Watch Projects

The solution structure for watch apps consists of three projects (notice that watch apps are split in two parts):
  • an iPhone app which delivers the watch app to the user (and is also obviously a regular iPhone app),
  • an Watch Kit Extension where the code for the watch app runs (on the iPhone, but separate to the iPhone app),
  • a Watch app which is only the storyboard and image resources that go to the watch itself.

Storyboard User Interface

After creating the three projects in a new solution, the first step is to draw the user interface in Interface Builder. Right-click on the Interface.storyboard (already in the template) and open in Xcode.

I did the following:
  • gave the interface controller a Title: 8Ball
  • dragged a Label and centered it
  • Ctrl + dragged an outlet from the label into the header file called result
  • dragged a Menu onto the scene (this is triggered by Force Touch)
  • added and named the two MenuItems: Shake & Back
  • Ctrl + dragged an action from the first menu item called shake
Remember: the storyboard (and any image resources) are the the only things that get installed on the watch itself.

WatchKit C# Code

With the user interface defined in the storyboard, I just needed to wire-up the outlet and action I created in C# to make the app work. The C# code will run in the Watch Kit Extension - on the iPhone itself, not on the CPU of the watch.

First I copied the Magic Eight Ball responses from my Xamarin.Forms app (it's a simple string array, called options) and then I started to implement methods in the InterfaceController.

The Awake method is called when the scene is created, so this is where the code selects its first random response to show the user. I store it in a local variable lastResult and also in NSUserDefaults (for the Glance, explained later).

public override void Awake (NSObject context)
{
 base.Awake (context);
 var rnd = new System.Random();
 lastResult = options[rnd.Next(0, options.Length - 1)]; 
 NSUserDefaults.StandardUserDefaults.SetString 
  (lastResult, "lastResult");
}

Then in WillActivate I set the label's text to the random value:

public override void WillActivate ()
{
 result.SetText (lastResult);
}
Finally, the menu's Shake button should choose a new random response, so the action is implemented to generate new new answer, set the local lastResult variable, the NSUserDefault, and also the label's text.

partial void shake () {
 var rnd = new System.Random();
 lastResult = options[rnd.Next(0, options.Length - 1)]; 
 result.SetText (lastResult);
 NSUserDefaults.StandardUserDefaults.SetString 
  (lastResult, "lastResult");
}

That's all the code required to get the app running! I did a couple more things, however, to demonstrate how to programmatically modify the Menu...

In the Awake method I add another menu item called Thanks:

AddMenuItem (WKMenuItemIcon.Accept, "Thanks", new ObjCRuntime.Selector ("tapped"));
The Selector is implemented as shown - notice the [Export] is required:
[Export("tapped")]
void MenuItemTapped () {
 result.SetText ("You're welcome!");
}

Glance Mode

I also implemented Glance mode, which simply displays the last response generated by the app.

The watch app template already includes a GlanceInterfaceController so I just had to drag a couple of Labels onto it, and Ctrl + drag an outlet for one, so I could change the text programmatically.



Because I always store a generated result in NSUserDefaults the GlanceInterfaceController, the code for the glance is really simple:
var r = NSUserDefaults.StandardUserDefaults.StringForKey("lastResult");
lastResult.SetText (r);


Currently you cannot test Glances from within Xamarin Studio, but it's easy to trigger it using Terminal and the following command (make sure you update path to match your app):

/Library/Frameworks/Xamarin.iOS.framework/Versions/Current/bin/mtouch --sdkroot=/Applications/Xcode-Beta.app/Contents/Developer/ --device=:v2:runtime=com.apple.CoreSimulator.SimRuntime.iOS-8-2,devicetype=com.apple.CoreSimulator.SimDeviceType.iPhone-6 --launchsimwatch=/Users/craigdunn/Projects/Watch8Ball/Watch8Ball/bin/iPhoneSimulator/Debug/Watch8Ball.app --watchlaunchmode=Glance

The finished glance display looks like this:

And that's it! Around 10 lines of C# code to build an Apple Watch app.

Download the Xamarin Watch Kit Preview, get the code from Github and try it for yourself!

Saturday 17 January 2015

Microsoft Band: the end

I had a lot of fun with the Band initially.

Then after literally two seconds in the shower after a long run, it died. I doubt it got that wet - I literally stepped into the shower, noticed the Band was still on my wrist, then took it off and placed it out to dry.

But that was enough to kill it. The screen went all crazy and illegible. It was dead.




I had paid the $20 'extended warranty' fee, so the guys at the Microsoft Store grudgingly replaced it. I say grudgingly because one staff member really didn't seem sure about it; luckily another guy got involved and was more than happy to help me. They made it clear that if I hadn't paid for the extended warranty, they would not be replacing it at all.

Then they asked for another $20. To cover this Band with extended warranty. I was very annoyed by this. I didn't pay. But now I'm too scared to use the Band. What if, while running outdoors, it rains? The Band apparently will die at the slightest hint of water, and next time Microsoft promised they would NOT be replacing it unless I paid the additional $20.

So now I hardly wear it. It's in a drawer somewhere. So long, Microsoft Band, I hardly knew yea...

Microsoft: if you put a GPS in a fitness device, you're saying it's okay to use it outdoors. If that same device fails in the slightest mist of rain, the device itself is a failure.