Creating a FireMonkey iOS Application (FireMonkey Quick Start)

Go Up to FireMonkey Quick Start Guide - Tutorials - My First FireMonkey Application

A FireMonkey application destined for iOS is created and tested initially as a native Win32 application in RAD Studio. But the second half of the FireMonkey iOS application development process occurs on the Mac and on a test iOS device. That is, you do your production debugging on the Mac using the Xcode development platform, you compile the source files on the Mac using Free Pascal, and you run the iOS app using the Free Pascal RTL.

• Tutorial: Installing FireMonkey-iOS Tools on Mac describes steps to install required tools to your Mac OS X to develop iOS applications.

Step 1: Create a New FireMonkey HD Application for iOS

Now we are ready to create a FireMonkey iOS application.

To create a new FireMonkey iOS application

1. Select File > New > Other to see object gallery (New Items).
2. Select FireMonkey HD iOS Application.

   

Now the Form Designer shows a new form for an iOS Application.

Step 2: Place Components Onto the FireMonkey iOS HD Form

The first step in creating a FireMonkey application is designing the user interface, the same as targeting desktop platforms. There are a lot of reusable components available in the IDE for creating user interfaces. Move the mouse pointer over the Tool Palette and expand the Standard category by clicking the plus (+) icon. Then select the TEdit component and drop it onto the Form Designer. An instance TEdit component will appear on the form.

Repeat these steps for adding the TLabel and TButton components onto the form. Now you should see 3 components on the Form Designer.

Once you place these components onto the Form Designer, the IDE automatically sets names for these components. To see a name, click the component on the Form Designer, and then see the Name property on the Object Inspector.

For a TButton component, the component name is set to Button1 (Button2, Button3, and so on) by default. You can find these components on the Structure View as well.

The form on which these components are located also has a name. Select the background of the Form Designer, and select the Name property on the Object Inspector. The name of form Form1 (or Form2, Form3, depending on how many form projects you have created by now) is displayed. You can easily locate the name of the form in the Structure View.

You can easily switch to source code. Select the Code tab at the bottom of the Form Designer or press the F12 key. You can flip between the Form Designer and the Source Code editor anytime you want.

Once you switch to the Source Code Editor, you will find source code so far the IDE has generated. You can find that there are 3 components (Edit1, Label1, and Button1) defined.

Step 3: Write a Response in Delphi Code When a User Clicks a Button

The next step is defining an event handler for the TButton component. You can define event handlers for your FireMonkey iOS application in the same way you do it for desktop applications. For the TButton component, the most typical event is a button click. By double-clicking the button on the Form Designer, RAD Studio creates skeleton code to implement an event handler for the button click event.

Now you can implement responses within 'begin' and 'end' of the Button1Click method. Let’s implement a response to show a small dialog that reads “Hello + <name entered into the edit box>”.

 Label1.Text := 'Hello ' + Edit1.Text + ' !';

In Delphi, the quotation marks that must surround string literals are ' '. Also, you can also use the plus (+) sign to concatenate strings. While you are typing code, some hints indicating what kind of parameter you need to specify will appear. Also, you will see what kinds of members are supported in a given class.

Step 4: Test Your iOS Application on Windows

The implementation of this application is finished, so you can run it. You can click the Run button in the IDE, press F9, or select Run > Run from the RAD Studio main menu.

Once you have executed the application, a form with an edit box and a button will be displayed. Enter text into the edit box, and press the Say Hello button.

Step 5: Deploy the Application Code to xcode on Mac OS X

As explained at the beginning of this tutorial, the application must be recompiled on xcode on Mac OS X in order to run it with iOS Simulator (or to an actual device).

Deploying the application code

1. Share your folder on your Windows machine so that you can load the project from xcode on Mac OS X. Please note that you need to give read/write access to the remote machine.
2. The project file format of xcode is different from the one on RAD Studio. You need to execute the dpr2xcode utility to convert the project every time you make changes to your project. If you have the dpr2xcode tool already configured (see link below), simply click Export to xcode.

   

   • Installing FireMonkey-iOS Tools on Mac describes the steps to install the required tools for your Mac OS X to develop iOS applications.
3. Start xcode and open the project located on your Windows machine.

Step 6: Compile, and Then Deploy It to iOS

Now you are ready to execute your iOS application on your iOS Simulator. Select the device (simulator or actual device) and click the Run button on the xcode toolbar. Your FireMonkey application is now running on iOS Simulator (or even on your iPhone).

Related Help Topic

• FireMonkey Development Setup for iOS