If you want to create a new page for developers, you should create it on the Moodle Developer Resource site.

Moodle Mobile Building the app for iOS

From MoodleDocs
Revision as of 07:14, 29 April 2022 by Pau Ferrer Ocaña (talk | contribs)
(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)

Warning: This page is no longer in use. The information contained on the page should NOT be seen as relevant or reliable.

Moodle App (Ionic 3 - legacy)

Remember that you can also build the app using an external system called Phonegap Build, see Moodle_Mobile_Customization#Building

Warning: This page is no longer in use. The information contained on the page should NOT be seen as relevant or reliable.


this is a quick guide to build the official Moodle Mobile app on iOS. It should be pretty easy to do it for your own organization.

  1. Install xcode
  2. Install NodeJs
  3. Install cordova-cli
    • sudo xcodebuild -license - agree to xcode license
    • sudo npm install -g cordova - it will install cordova. Note that on my machine I have some warnings about the ios bootstrap process being skipped but all the following steps seem to work ok anyway...
  4. Create a Xcode project
    • /usr/local/lib/node_modules/cordova/bin/cordova create ~/Apps/moodlemobile_android_cordova com.moodle.moodlemobile MoodleMobileBeta
    • cd ~/Apps/moodlemobile_android_cordova
    • sudo /usr/local/lib/node_modules/cordova/bin/cordova platform add ios
    • sudo /usr/local/lib/node_modules/cordova/bin/cordova build - not necessary, just check the build works.
  5. In Finder change the permission on ~/Apps/moodlemobile_android_cordova folder: Read + Write to everyone
  6. Add the cordova plugins
    • git clone git:// ./ChildBrowser - we are now going to install cordova compatible plugin with the plugin install command line.
    • sudo /usr/local/lib/node_modules/cordova/bin/cordova plugin add ChildBrowser/
  7. In Finder open /Users/jerome/Apps/moodlemobile_android_cordova/platforms/ios/MoodleMobileBeta.xcodeproj. Test you can build the default Cordova app on your phone.
  8. Copy the Moodle mobile app into www folder
    • git clone git:// ./moodlemobile
    • mv platforms/ios/www/ platforms/ios/www_old/
    • mv ./moodlemobile/ platforms/ios/www/
    • cp platforms/ios/www_old/cordova.js platforms/ios/www/
    • cp platforms/ios/www_old/childbrowser.js platforms/ios/www/
    • mv platforms/ios/www_old/childbrowser platforms/ios/www/
  9. In Xcode, edit Resources > MoodleMobileBeta-Info.plist
    • Bundle display name: Moodle - "Moodle mobile" would be displayed "Moodl...obile"
    • Bundle version:
  10. Add icons and splash
    • cp platforms/ios/www/img/icon/ios/icon-57.png platforms/ios/MoodleMobileBeta/Resources/icons/icon.png
    • cp platforms/ios/www/img/icon/ios/icon-57-2x.png platforms/ios/MoodleMobileBeta/Resources/icons/icon@2x.png
    • cp platforms/ios/www/img/icon/ios/icon-72.png platforms/ios/MoodleMobileBeta/Resources/icons/icon-72.png
    • cp platforms/ios/www/img/icon/ios/icon-72-2x.png platforms/ios/MoodleMobileBeta/Resources/icons/icon-72@2x.png
    • cp platforms/ios/www/img/splash/ios/* platforms/ios/MoodleMobileBeta/Resources/splash
  11. Go to Targets > Summary
    • check pre-rendered icon
    • enable all orientation
    • Deployment target: 4.3
    • Version: 1.203 Build:
    • Check that all icons and all splash-screens are there.
  12. Clean the app
    • rm -rf platforms/ios/www/img/splash
    • rm -rf platforms/ios/www/img/icon
  13. Build and publish


  • If you previously installed a different platform then you'll get an error when adding the cordova plugin. It's advised to install both platforms at the same time. Then add the cordova plugin(s), then copy the app content into www. Don't forget cordova.js and plugin js/files. Then you can manually install phonegap plugins.
  • The iOS version doesn't need WebIntent android plugin.
  • You must add the childbrowser cordova plugin just after adding the platform. In Cordova 2.5, if you add the plugin after installing the app content, it creates a folder named childbrowser.js, and the plugin doesn't work.

See also