Rakefile

We already have an app running, and we are ready to start creating buttons, labels, and other UI, but first we need to learn how to customize our app: how to set app's icon, how to change splash screens, how to add custom fonts, etc.

All customizations are done in Rakefile. At this moment superapp's Rakefile. should look like this: 

        # -*- coding: utf-8 -*-
        $:.unshift("/Library/RubyMotion/lib")
        require 'motion/project/template/ios'

        begin
          require 'bundler'
          Bundler.require
        rescue LoadError
        end

        Motion::Project::App.setup do |app|
          # Use `rake config' to see complete project settings.
          app.name = 'superapp'
        end
You can always learn more about Rakefile in Rubymotion's official docs. First three strings give us access to all Rubymotion commands. Lines from 6 to 9 give us access to gems that we will include with Bundler. Block inside Motion::Project::App.setup is where we setup the app. Right now only application name is set. To view all available settings, you can run rake config:

Icon

Let's add an icon to our app. Because Apple's devices have different screen sizes and resolutions, the app requires multiple icons with different sizes. At this moment, we need three icons, but Apple changes this number sometimes. We need:

You can create your images in some editor, or just download icons that I'm going to use in this tutorial: Mova Icons

When you have your icons ready, let's put it into /resources/icons folder. As you may remember, /resources is a folder for all our assets. Icons are one of them, so we are going to put it there. Since we do not want to make a mess we will create /icons folder, and we will put icons inside:

Now we can tell Rakefile where to look for icons. To do it, we need to specify icons relative paths: 

        app.icons = [
          "icons/Icon-60@2x.png",
          "icons/Icon-76.png",
          "icons/Icon-76@2x.png"
        ]

Let's run our app now with rake, and close it in simulator to check the Springboard and our icon with CMD + Shift + H:

Splash Image

Splash image is the image that shown when the app is loading. A number of splash screen images depends on a number of devices and screen orientations you support. If you are going to support only iPhones in portrait orientations, four images should be enough:

If you are going to support iPads with landscape and portrait orientations, you will need another 4: You can create your images, or download Mova Splash Images from here: Mova Splash Images

You can find some splash images in /resources folder already. I think it would be a better idea to create /resources/splash folder, and put all splash images inside:

Now we need to tell Rakefile where to look for splash images. Unfortunately, there is no way to tell where Rubymotion should look for splash images. Rubymotion expects them to be in the root of on of the resources folder. Default resources folder, as you can guess is /resources. However we can add new one: 

        app.resources_dirs << "resources/splash"
This code adds second Resources folder, and Rubymotion will look for our splash images in two places now:
/resources and /resources/splash.

Let's start our app, and see whether splash images work now:

Fonts

You can follow same logic with fonts.

Later we will also use Rakefile to specify provisioning profiles and developer certificates for App Store submitting, adding custom tasks for crash reporting, and more. But for now, let's learn what App Delegate is and how we can use it.

Book Index | Next