Wednesday, April 24, 2013

N=3: Kitten Cells on iPhone (N+1 days of MvvmCross)

This video recording was a bit of a disaster - sorry!

I think I hit every technical gremlin possible during this recording...

But still I managed to get this done inside 30 minutes - so I hope this video is useful to you :)

I also hope you don't mind me posting this 'as is' - I obviously could have removed the mistakes/problems or I could have re-recorded this session - but I thought seeing the problems would be heplful to you.


With that explanation out of the way....

The flow I tried to demonstrate was:

  • Switch yesterday's N+2 solution across to the Mac
  • Load the solution inside Xamarin Studio
  • Change the configuration of the solution so that it correctly worked for the 'iPhone Simulator' configuration
  • Use the Add->New wizard to add a new 'iPhone Table Cell'
  • Use the xCode XIB editor to change the Table Cell layout
  • Use the xCode Assistant editor to link the UI controls in the layout to 'Outlets' 
  • Save in xCode and return to Xamarin Studio
  • Let the automation in Xamarin Studio create C# properties from the 'Outlets'
  • Use the code editor to change the UITableViewCell to an MvxTableViewCell
  • Use the code editor to add some Data-Bindings for the cell
  • Use a special MvxImageViewLoader to load the image from the Internet
  • Run the app

During the demo I hit several gremlins and made a couple of mistakes myself - but I hope you can learn from these. If nothing else, you can learn not to trust everything I say :)

The video is:

Previously in N+1:

Next up... maybe some value converters

Please do let me know if these N+1 demos are useful, if you'd like to see these recorded slightly differently, if you'd like a topic covered, if you'd like to record a session or if you have anything at all to say :)



  1. Hi Stuart

    Followed this tutorial to try and create a custom view (but not a UITableViewCell). I complete all the steps, but get an error:

    Objective-C exception thrown. Name: NSUnknownKeyException Reason: [ setValue:forUndefinedKey:]: this class is not key value coding-compliant for the key NameLabel

    (where NameLabel is an Outlet to a label in the XIB).

    I have taken the liberty to share the code with you on bitbucket (mrtnkrstn/mvvmcrosscustomwidget). Could you perhaps have a look and tell me what I am doing wrong? I have removed the Outlets in the XIB for now. (You helped me with a similar issue before, I was hoping moving to MvvmCross would solve the problem).

    Also, when I try to add a number of the widgets to the MvxViewController in a loop, only the last one appears?

    Am using MvvmCross v 3.0.14, Xamarin Studio (Beta channel) v 4.2.2 and Xcode 5.0.2 (btw the Header file in Interface Builder is littered with errors and warnings; I think the reason is that the C# code inherits an MvxView, while the Objective-C code inherits UIView?)

    I appreciate your help, thanks!

    1. Thanks. Please ask this question via StackOverflow. There are lots of people there who can help - especially for general Xamarin/iOS questions. Sorry - I've tried and I simply can't provide individual private help/support for free via email, closed repositories, etc - I find this is better provided via the community

      Thanks for understanding


    2. Hi Stuart

      No problem, I understand. I will redo the sample code as it does contain some business-sensitive information, and then post on SO.

      For now I have implemented the view using a UICollectionView with a custom UICollectionViewCell (as demo'd in I get the feeling that UICollectionViewCell and UITableViewCell are the two most easily customisable views at the moment.

      Btw MvvmCross is awesome; bit of a steep learning, but slowly getting the hang of it. Still lots to learn!