iOS UIView backgrounds turning black on devices but not in the simulator

[Doctor Q]

I'm working on an iOS/iPadOS app that looks fine in the Xcode simulator but has a nasty difference when run on a real device.

For example, I set a UINavigationBar title on my Settings screen as follows:

self.navigationItem.title = "Settings"

Here's how the top of the iPad screen looks in the simulator:

Here's how it looks on a real iPad when connected to my Mac and run via the simulator:

And here's how it looks if I stop running the simulator and launch it independently on the iPad. As you can see, the black text gets a black background, making it unreadable.

Black text in a UITableView (on a white background) also turns to black-on-black and becomes unreadable. Example:

UIButtons with the "Filled" style have white text on a blue background in the simulator, but running directly on the iPad they have white text with a black background, inside a frame of blue. Example in the simulator:

On a real device:

Even some third-party custom views I'm using get black backgrounds.

I've tried running the app on each possible simulated device, and they all work correctly, as the app is designed to look. I've tried running the app on several real devices, and every one has the black background problem. Updating to the latest iOS/iPadOS didn't resolve it. I don't have any special "accessibility" settings turned on.

I've tried tinkering with the properties of these various views, like changing background colors from Default to Clear, but no change of properties makes the behavior change.

Any ideas?

 

[chown33]

I'm only going to run through some troubleshooting ideas.


First, try switching the device to Dark Mode and see what happens.

Related to that, try some of the Accessibility settings regarding inverted colors, contrast, etc. You wrote that the Accessibility settings are turned off, so see what happens when you turn them on.


Second, try adding a completely new button or label to the view. Make sure it's not using any presets or inheritance from any other component. In other words, make sure it's completely new.

I mention this because if there's some inheritance or replication going on, then the real cause of the problem could be another component either up the view tree, or something that's serving as a prototype or template that other components of the same type are copied from.

How old is this app project in Xcode? That is, what versions of Xcode have been used to edit it in the past?

It could be that some incompatibility crept in at some point, or Xcode itself bungled something as newer versions were used.


Third, set the color of the text to something other than white, like maybe red. Is the background still black?

I'm asking because black is the opposite of white, so if the background for red text is the opposite of red, then that's a different clue than always getting a black background.


Fourth, try making a completely new but trivial app, that only has a view with a label and a button, or other trivial controls.

If that new app displays correctly on the device, then the problem is with some setting or configuration in the original app.


Finally, the black area looks like it's just the background of the text itself, as distinct from any component that has a textual sub-component. I think this is still called the "bounding box" of the text, but it's been awhile, so maybe that like "the bee's knees".


Oh, and exactly which OS version is this running under on the iPad?
And which Xcode version, on which OS?

 

[Doctor Q]

Thanks! I'm giving these suggestions a try.

 

[chown33]

Dang it, I left out the all-important suggestion, "Send home-made brownies to chown33".

 

[Doctor Q]

I did, but the package had insufficient postage so it was returned to me, and I ate all of the brownies before realizing they were for you.

 

[Doctor Q]

I used all of the suggestions above, which proved that the problem is unique to this project, affecting all buttons and certain other views. The project has some imported third-party code, so I disabled one component at a time to see if one of them might be the guilty party. Sure enough, one of them included a backgroundColor extension to UIView with a getter and a setter that looked harmless, but weren't in fact harmless. That extension is not needed, is now disabled, and the black backgrounds are gone at last! Thanks for the help.

For the record, I'm using Xcode 13.3, macOS12.3.1, and iPadOS 15.4.1.