Make An iOS App With Xamarin: Steps & Tips

Even before it was acquired by Microsoft in February this year, Xamarin was a fairly popular framework for cross-platform mobile app development. The total number of developers worldwide using the tool had touched the 1 million mark last year itself (from almost 125 countries). The fact that Microsoft plans to make the coding tools and resources of Xamarin open-source (as announced at the Build Conference) is almost certain to pull up its popularity even further. The framework uses C# for coding and compiling applications, and in today’s discussion, we will highlight how you can make an iOS app with Xamarin:

1. Prepare your system – Before downloading Xamarin.iOS, iPhone app developers need to get the latest iOS SDK and the Xcode IDE (Xcode 7.3) on their Mac systems. To serve as the build host, the system needs to be upgraded to OS X 10.10 Yosemite or later versions. Coders have the option of getting the newest Xcode version from the Mac app store or the official iOS Developer Center.
2. Install Xamarin.iOS – Once the system components are ready, you can now proceed to the installation of the Xamarin Unified Installer. It is available for download at http://xamarin.com/download – and the installer has the property of detecting all the components required for building apps with it. Double-clicking the logo of Xamarin installer starts the actual download process. A pop-up alert message might appear at the start (select ‘Open’), and the license agreements have to be accepted. Next up, select the components of Xamarin you wish to download. For iOS app development, developers need Xamarin.iOS and Mac (the third component is Xamarin.Android, required for making custom Android applications). You also have to download Xamarin Studio.
3. Activate your Xamarin account – First-time users of the Xamarin tool need to register themselves first, at store.xamarin.com and then log in to their accounts. Once the correct sign in credentials are provided, the Xamarin account will become active (a message – ‘Your license has been activated on this machine’ – appears). That’s it, you are now ready to make a sample iOS app with the framework.

Note: Xamarin can also be installed on Windows PCs (Windows 7 or later). A Mac OS system has to be networked with it, for installing Visual Studio and making the components function properly.

4. Launch Xamarin Studio and get to work – On the Xamarin Studio window (launch it from Spotlight or the Applications folder), you will find a ‘New Solution’ tab on the top left corner. Click on it, and select the app template on the pop-up window that appears next. Experts from the domain of mobile app development generally advise new Xamarin users to start off with a Single-View app (select this after choosing ‘App’ under ‘iOS’ in the left column). You will also see that there are options to build OpenGL, SpriteKit, Metal and SceneKit games with Xamarin.
5. Move to app configuration – Beside the ‘Single View App’ option you had selected in the previous step, you will find a drop-down list of programming languages. Check whether C# is selected there (if not, select it). Leave the default values of ‘Target’, ‘Identifiers’ and ‘Device’ as they are. Don’t forget to name your app at this stage (let’s say, ‘Projecta_ios’).

Note: The ‘Target’ option here refers to the minimum version of iOS that you want your app to support. For instance, if you wish to make the app compatible with only iOS 8 and above platforms, select ‘iOS 8’ from ‘Target’.

6.  Choose project name and location – A straightforward step, where you need to a) name your project, and b) choose where it would be stored. A common mistake that many iPhone app development experts make over here is adding special characters (which are not supported) in the project name. You cannot include spaces either. Ideally, leave the location path as default, and click the ‘Create’ button below.
7. Move on to the Storyboard – App developers working with Xamarin have to navigate to Solution Pad section of the framework. The Main.Storyboard file is located here. Double click on the file to start working on the visual features of your app’s user interface. Make sure that the size classes are already activated.

Note: Developers making iOS apps with Xamarin will also have to uncheck Xamarin Test Cloud and Xamarin Insights.

8. Add labels and modify text property – On the design surface, iOS developers can drag and drop new text labels (generated by typing the word ‘label’ in the search area of Toolbox). The label can be resized by changing its ‘Dragging Handles’, i.e., the circles that are visible around it. Once the correct size is chosen, coders can alter the Text Property from the ‘Properties Pad’.
9. Make use of the Component Store – For app-makers working on iOS applications with Xamarin, the Component Store comes in really handy. It can be accessed from Xamarin Studio as well as Visual Studio – and does not depend on the type/template of app you had initially chosen. There is a separate Xamarin Components Manager, which stores all the downloaded components (for new users, this will be blank). Developers have to log on to their Xamarin accounts to access the Component Store.
10. Add button(s) – For the very first iOS app built with Xamarin, a couple of buttons should be enough. For this, you have to select a Button from ‘Toolbox’, drag it to the design area, and change its ‘Title’ property and ‘Name’ property (from ‘Properties Pad’). Adjust the height and width of the button so that it matches the label(s) you have created earlier. Avoid adding too many buttons, since that can make matters confusing.
11. View your app – Okay then – now it’s time to check out how your app is looking like. On the design toolbar, you will find a ‘View As’ option. Select your target iOS version here, and change the ‘Generic’ option (selected by default) to the device you wish to see your application on (say, iPhone 6). If any feature seems out of place, make the necessary changes at this stage.
12. Create an empty C# class – While coding for iPhone apps with Xamarin, a blank C# class is required for replacing the template codes. The class can be created by clicking on General → Empty Class (do not forget to name the file). Remove the template code and paste your own app code in its place, and save the .cs file. Wire up all the components (for example, buttons) to ensure that they are working properly.
13. Build your app – Things are now set for you to compile your code. Select ‘Build → Build All’ to start the compilation. If there are any errors, you will be prompted about them – and will have to go back to the concerned section(s) to rectify the problems. If everything is okay and code compiles successfully, a ‘Build Successful’ message is generated.
14. Fill up the iOS Application Target section – Over here, developers have to put in the name of their apps as well as the ‘Bundle Identifier’. Since we have created a test app over here, the ‘Build’ and ‘Version’ can both be set to 1.0. Specify the correct value for the ‘Deployment Target’as well. From the drop down list next to ‘Devices’, select ‘iPhone/iPad’.
15. Use the simulator to test your app – The importance of thorough mobile app testing cannot be overemphasized. In the Xamarin IDE, testing an app is easy enough – thanks to the presence of a built-in simulator. From the drop down menu near the top of the window, choose ‘Debug’, select the device simulator you want to test your app on (say, iPhone 6 iOS 8.3), and click ‘Start’ (the arrow button).

That’s it – your first Xamarin.iOS app is now ready. The framework also allows developers create apps for Apple Watch with WatchKit and the Xamarin.iOS SDK. One of the biggest advantages of the tool is that it depends only on C# – providing coders with a way out from learning Obj-C, Swift and Java (for Android). Even though native app development has certain extra benefits, working with Xamarin is something that mobile developers should learn well.