Xib-Free iOS App with C# – Part 2 – Clock

This is Part 2 of our series building a xib-free iOS app with C#.

Create a New Project in Xamarin Studio

Start by creating an iOS solution in Xamarin Studio using the iPhone Empty Project template just like you did last time when following the Xamarin article, Creating iOS Applications in Code. Name the project CurrentWeatherClock.

New Solution

Xamarin Studio will create a new solution, open it, and open the AppDelegate.cs file:

using System;
using System.Collections.Generic;
using System.Linq;
using MonoTouch.Foundation;
using MonoTouch.UIKit;

namespace CurrentWeatherClock
{
    // The UIApplicationDelegate for the application. This class is responsible for launching the
    // User Interface of the application, as well as listening (and optionally responding) to
    // application events from iOS.
    [Register ("AppDelegate")]
    public partial class AppDelegate : UIApplicationDelegate
    {
        // class-level declarations
        UIWindow window;
        //
        // This method is invoked when the application has loaded and is ready to run. In this
        // method you should instantiate the window, load the UI into it and then make the window
        // visible.
        //
        // You have 17 seconds to return from this method, or iOS will terminate your application.
        //
        public override bool FinishedLaunching (UIApplication app, NSDictionary options)
        {
            // create a new window instance based on the screen size
            window = new UIWindow (UIScreen.MainScreen.Bounds);

            // If you have defined a root view controller, set it here:
            // window.RootViewController = myViewController;

            // make the window visible
            window.MakeKeyAndVisible ();

            return true;
        }
    }
}

If you build and run, you’ll get a black screen and an error message in the console window of Xamarin Studio:

Application windows are expected to have a root view controller at the end of application launch

Create a Custom View Controller

Add a new class named CurrentWeatherClockViewController via one of the following methods:

  • Select menu File > New > File
  • Press Command-N
  • Right click on the project and select menu option Add > New File…

CurrentWeatherClockViewController.cs

Edit your new class to add the MonoTouch.UIKit namespace and inherit from UIViewController:

using System;

using MonoTouch.UIKit;

namespace CurrentWeatherClock
{
    public class CurrentWeatherClockViewController : UIViewController
    {
        public CurrentWeatherClockViewController ()
        {
        }
    }
}

If you build and run at this point, you won’t see anything different because we haven’t hooked this view controller into the main window yet.

Initialize the View

Get rid of the constructor for now and override the ViewDidLoad method as follows:

using System;

using MonoTouch.UIKit;

namespace CurrentWeatherClock
{
    public class CurrentWeatherClockViewController : UIViewController
    {
        public override void ViewDidLoad()
        {
            base.ViewDidLoad();
            this.View.BackgroundColor = UIColor.White;
        }
    }
}

Before you build and run, we need to create an object of this class and hook it into the main window’s RootViewController. Open the AppDelegate class and replace this code:

// If you have defined a root view controller, set it here:
// window.RootViewController = myViewController;

with this:

window.RootViewController = new CurrentWeatherClockViewController ();

Create and Add the Clock View

Add an instance of UILabel class:

private UILabel timeLabel;

Create the object and add it to the view controller’s view:

using System;
using System.Drawing;

using MonoTouch.UIKit;

namespace CurrentWeatherClock
{
    public class CurrentWeatherClockViewController : UIViewController
    {
        private UILabel timeLabel;

        public override void ViewDidLoad()
        {
            base.ViewDidLoad();
            this.View.BackgroundColor = UIColor.White;

            this.timeLabel = new UILabel
            {
                Frame = new RectangleF(0, 180, this.View.Bounds.Width, 100),
                Text = "00:00:00 AM",
                Font = UIFont.SystemFontOfSize(56)
            };

            this.View.AddSubview (this.timeLabel);
        }
    }
}

Now when you build and run, you will be see your clock label on a white background. Congratulations, you’ve just created a xib-free iOS app in C#!

In the immortal words of Ron Popeil, “But wait, there’s more!”

Next time, we will discuss how to get the clock running and displaying the current time.

Advertisements
This entry was posted in iPhone Dev and tagged , , , , . Bookmark the permalink.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s