Ionic ReactApp - ios 状态栏颜色

Question

We have an ionic react app, from which we built an ios app using capacitor.

We have problem with our status bar color being white on a white background.

I tried looking around for fixes and found this: https://developer.apple.com/forums/thread/16771

But when I insert the code into appDelegate.swift, it says "Cannot find 'splitViewController' in scope. I tried few different imports, but nothing fixed this. What should we import so this solution works? Or, is there a better way to change color of ios status bar?

Please keep in mind that none of us knows swift very much.

import UIKit 
import Capacitor 
import Firebase

@UIApplicationMain 

class AppDelegate: UIResponder, UIApplicationDelegate { 

    var window: UIWindow? 

    func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?) -> Bool { 

        FirebaseApp.configure() 

        // Override point for customization after application launch. 

        splitViewController.navigationController?.navigationBar.tintColor = UIColor.blackColor() 

        return true 

    }

...

Answer 1

Change it in your Info.plist file instead.

...
<key>UIStatusBarStyle</key>
    <string>UIStatusBarStyleDarkContent</string>
...

You can also do it using the interface directly in Xcode by navigating to App > General > Deployment Info > Status Bar Style

This of course will change the status bar across the entirety of your app.

If you would like to do something a little more dynamic, eg change the color based on the screen the user is on, you can follow the CapacitorJS documentation here: https://capacitorjs.com/docs/apis/status-bar