iOS App creation tutorial for MZ/MV (xcode 12)

● ARCHIVED · READ-ONLY
Started by mvstone 20 posts View original ↗
  1. Hello, thanks to all the great minds we've figured out how to deploy MZ/MV project to iOS devices.
    I especially would like to thank
    - MiltonSSR for kicking off the discussion
    - BreakerZero for giving me hints on initial steps
    - HoofedEar for many many many tests with me
    - yymess for solving the tap issue

    Now for the actual program!

    Prerequisites:
    You will need a RPG Maker MZ/MV project, a Mac, an iOS device, and xcode 12. The process is tad different for xcode 11. If you absolutely have to use xcode 11, please refer to the original threads.
    Also, be sure to get yourself an Apple Developer signing certificate if you want to test or distribute on actual iOS devices.

    Process:
    Step 1: Export your game

    • Under File menu, select Deployment. Make sure to use Web as the platform
    Step 2: Open xcode 12, and create a new project
    • For template, select iOS from the top, and App from Application section.
    detailed settings
    • Enter your product name (we use newmzproj as an example)
    • Select your Apple Developer ID for Team
    • For Organization Identifier, enter your own domain name (if you have any) in reverse. For example, if I have iloverpgmaker.com, I would enter com.iloverpgmaker
      • This will create unique identifier for you - so make sure you use something unique to YOU.
    • For Interface, select [Storyboard]
    • For Life Cycle, select [UIKit App Delegate]
    • Language, [Swift]
    • You can untick Include Tests
    • Could tick Use Core Data but needs further investigation/understanding**
      • RPG Maker uses localforage to store data when running under iOS
      • I am not sure if the locally stored data will be persistent after an App update

    Step 3: Modify the code and create a WKWebView
    • Once you have your project created, you should see ViewController.swift on left panel. Open the file.
    • There should be around 20 or so lines of codes. Replace with following codes.
    swift code
    Swift:
    //
    //  ViewController.swift
    //
    //  https://forums.rpgmakerweb.com/index.php?threads/ios-app-creation-tutorial-for-mz-mv-xcode-12.128674/
    
    import UIKit
    // Add WebKit
    import WebKit
    
    // Add WKNavigationDelegate, WKUIDelegate for navigation and ui delegation
    class ViewController: UIViewController, WKNavigationDelegate, WKUIDelegate {
    
        var webView: WKWebView!
    
        // This gets called when loading the WKWebView
        override func loadView() {
            super.loadView()
       
            webView = WKWebView()
       
            let webViewConfig = WKWebViewConfiguration()
            webViewConfig.dataDetectorTypes = []
            webViewConfig.allowsInlineMediaPlayback = true
            webViewConfig.mediaTypesRequiringUserActionForPlayback = []
            webView = WKWebView(frame: view.frame, configuration: webViewConfig)
            webView.configuration.preferences.setValue(true, forKey: "allowFileAccessFromFileURLs")
       
        }
    
        // Called after the WebView was created
        override func viewDidLoad() {
            super.viewDidLoad()
       
            let htmlPath = Bundle.main.url(forResource: "index", withExtension: "html", subdirectory: "www")!
            webView.loadFileURL(htmlPath, allowingReadAccessTo: htmlPath)
       
            webView.navigationDelegate = self
            webView.uiDelegate = self
            view = webView
        }
       
        // This is to allow JavaScript Alert() for debugging
        func webView(_ webView: WKWebView, runJavaScriptAlertPanelWithMessage message: String, initiatedByFrame frame: WKFrameInfo, completionHandler: @escaping () -> Void) {
            // alert
            let alertController = UIAlertController(title: "", message: message, preferredStyle: .alert)
            let action = UIAlertAction(title: "OK", style: .default) { _ in
                completionHandler()
            }
            alertController.addAction(action)
            present(alertController, animated: true, completion: nil)
        }
    }

    Step 4: Import MZ/MV game
    • Right click the ViewControllwer.swift on the left panel
    • Select Add Files to "newmzproj"... from the menu
    • Select your games www folder and hit Add
      • Make sure to tick Copy items if needed
      • Select Create folder references
    • Your www folder should be same level as ViewController.swift file
    Step 5: Allow MZ to start without focus (can skip for MV projects)
    • From left panel, navigate to www > js > rmmz_managers.js
    • Around line 2107, there should be SceneManager.isGameActive function. Modify the code to skip the check on focus.
    scenemanager
    JavaScript:
    SceneManager.isGameActive = function() {
        return true;
       
        // [Note] We use "window.top" to support an iframe.
        try {
            return window.top.document.hasFocus();
        } catch (e) {
            // SecurityError
            return true;
        }
    };

    Step 6: Tune-ups
    • Add a custom iconsto your app!
      • Click on Assets.xcassets from left panel
      • Select AppIcon
      • Just drag&drop files with right size here!
    • Make it landscape only (force side view on ios)
      • Click on your project name from left panel (the most top one)
      • Check the appropriate settings from Device Orientation
        • If you want to force side, tick Landscape Left and Landscape Right

    That's all! Hope to see many awesome games on AppStore :guffaw:
    Happy coding :rock-right:
  2. Works perfectly! Thanks so much for writing this up!
  3. I received a blank screen on starting the emulator up. There was a loading icon running and it became just black.
  4. Lee Sang said:
    I received a blank screen on starting the emulator up. There was a loading icon running and it became just black.
    Same here. Followed the steps exactly. Just a hunch but it may have to do with MZ not having a 'www' folder.
  5. Apologies for posting twice. I was at least able to figure out how to get the game to show. In the swift code change 'www' to whatever the name of the project (I don't think mz deployment changes the name of the project to www). But I have two issues now. One is that when you make the build, the screen is still white. What I have to do is refresh the app. A second and bigger problem is that it's very laggy. Pretty much unplayable. I'm still trying to figure this out for anyone who is interested.

    EDIT: There's a third problem too. Music doesn't play for some reason. I hear sound effects but no music.
  6. Sorry I've been away from this, but if I remember this correctly it won't run on the emulator. You need to test it on the actual device (connect via lightning cable)
  7. What different steps do you need for a Mac deployment through Xcode?
  8. Thank you very much! I can't wait for implementing it!
  9. Thanks, that's awesome!
  10. Edit: Figured out the issue, I'll leave my original post in case someone gets stuck here as well, as well as the solution. The problem just has to do with a dirty WWW folder, as for how I fixed the problem, this is the only method that worked for me. Delete the WWW folder from the xCode project, select remove reference, in finder move the folder to trash. Go to RPG Maker, export as Android/iOS (export as web didn't work for me) and put it in a folder that's not your xCode project. Go back to xCode project, and add the WWW folder + reference again. Clean Build Folder (Product -> Clean Build Folder), and then go ahead and run the project.

    Original: I'm having two issues, well one issue, and a concern really. I'm on MV, and the only sounds that are playing are the BGM's but SE and the like are not working. Also, the game is super laggy when it comes to menus or text appearing, I'm unsure if this has to do with NWJS and if updating the version might fix the problem. I'm running this on an iPad 5th generation on version 15.3 if that matters at all. Last question, is there a certain way to debug that might be better, I'm currently just going through safari's debug menu.
  11. DevByDane said:
    Apologies for posting twice. I was at least able to figure out how to get the game to show. In the swift code change 'www' to whatever the name of the project (I don't think mz deployment changes the name of the project to www). But I have two issues now. One is that when you make the build, the screen is still white. What I have to do is refresh the app. A second and bigger problem is that it's very laggy. Pretty much unplayable. I'm still trying to figure this out for anyone who is interested.

    EDIT: There's a third problem too. Music doesn't play for some reason. I hear sound effects but no music.
    Did you ever figure out the lagging issue ? running into this problem right now
  12. jupiterki said:
    Did you ever figure out the lagging issue ? running into this problem right now
    I don't know why but it works for me now. I also usually just test it directly on my iphone as supposed to the virtual iphone.
  13. Has anyone else run into the issue of the game staying in a somewhat portrait mode, even when locked to landscape? The game seemingly runs perfectly, except for this issue. I have yet to test on REAL hardware as my personal phone is too old (7+)
  14. how does resolution scaling work on mobile? if i make something that’s 480p but 16x9, will it go full screen to fill the frame?
  15. I'm getting a couple of errors along with a build failed in xcode after following these steps

    1670624418589.png
  16. Followed the steps (and the solution with replacing files) but still get a white screen. Tryed the different modes regarding landscape or portrait but doesnt seem to matter. Anyone got any idea to why this would happen?

    Game works fine on android, have never gotten it to work on apple
  17. hello!
    I am developing game with RPG Maker MV.
    this code perfect work.
    but I have this issue:
    • sound is playing
    • when I minimize the app, sound stop (as excepted), or switch to another app
    • then I resume back to game, maximalize or switch to game
    • sound start play just for about 1 second
    • and then fadeout and never play again
    • I need to end task the game and start again
    application is built with Xcode 15.
    I have tried Xcode 10, and no problem on simulation. but binary .ipa from version 10 can't use in app store, due to old version.

    I also try test from MZ version - and everything is OK, because, the javascript engine is diffrent as MV - there is pixi.js version 5.x.

    Please How to resolve this issue with sound after resuming back to game? thanks.
  18. May I ask a question? If iOS uses WKWebView, it will not automatically recycle or clear the cache, which can cause iOS to run the game for a long time, causing the game to go blank and crash. What is a good way to do this, like in the past when UIWebView automatically released the cache when it was almost full?
  19. this code solved my above problem with a blank screen. Now it seems like the app is working fine.

    In rmmz_managers.js
    starting at line 2107

    SceneManager.isGameActive = function() {
    // [Note] We use "window.top" to support an iframe.
    return true;
    };
  20. is this tutorial still works on Xcode 26? or can some one update it please?