30

It changes on their native keyboard/emoji board, depending which of the two are open. I thought it would change the color automatically based on UIInputViewController, however it is not occurring with custom keyboard extensions:

enter image description here

VDog
  • 1,083
  • 2
  • 13
  • 35

2 Answers2

37

One thing you can do to solve this. Change backgroundcolor of your ViewController's View for home indicator. And set status bar appearance separately through coding as per your needs.

This will change your home indicator, status bar color plus a safe area to Chocolate color, Add separate view in safe area for your other design, as I've added yellow.

enter image description hereenter image description here

enter image description here

If you want different color for your status bar, call it somewhere from viewDidLoad with color you want - 

func setStatusBarBackgroundColor(color: UIColor) {

        guard let statusBar = UIApplication.shared.value(forKeyPath: "statusBarWindow.statusBar") as? UIView else { return }
        statusBar.backgroundColor = color
    }

enter image description here

Apart from this, You won't be able to do any other changes in appearance, at least for now till apple provides any way to control appearance of home indicator. let me show you.

enter image description here

These are the availability of bars, where you can control appearance of it. There is no home indicator bar option Apple has provide for it's alteration.

These are the only bars you can control appearance -
Navigation Bars
Search Bars
Status Bars
Tab Bars
Tool Bars

Referral Link - iPhone-X Interface Guidelines

Kiran Jasvanee
  • 6,362
  • 1
  • 36
  • 52
  • 2
    You'd think they would allow us to do this for custom apps so that there isn't a jarring difference between your background color, and theirs. And it seems to work fine in full screen apps me thinks :/ – VDog Sep 26 '17 at 18:21
  • I've changed my answer, so it may help you as per your needs may be. – Kiran Jasvanee Sep 27 '17 at 04:43
  • I'll do some testing and get back to you :). Thank you for the post. Keep in mind I am trying this with a custom keyboard, and not just for a regular app. – VDog Sep 28 '17 at 03:31
  • 1
    This doesn’t answer the question. This changes appearance of your own app, not the bottom bar in your custom keyboard extension. – Jordan H Nov 10 '17 at 04:09
  • 1
    Yeah Joey, this is unfortunately true. I got excited thinking this will change the bottom keyboard color :/ but did not work – VDog Nov 10 '17 at 19:37
  • Actually I haven't seen or about to find out any apple documention mentioning about how to specifically change bottom keyboard color. This is the alternate way we can follow for now till apple comes out with specific solution for this issue. – Kiran Jasvanee Nov 12 '17 at 15:49
  • 1
    But this wouldn't work on a custom keyboard, as the custom keyboard has no access to the parent app (aside for the one parent app that you make). This means that every other app my keyboard is used in will have my background color, and a harsh grey background color on the bottom :/ – VDog Nov 14 '17 at 19:11
  • 3
    This doesn't change the bottom bar color even for a regular app. It just change color for the status bar. Did I miss anything here? – nuynait Nov 21 '17 at 01:57
  • Is there a programmatic way to access the setting you've shown in your first image? You show how to do it in Interface Builder, but if it can be done programmatically, would it be possible to post that, just like you posted the other code for just changing the top bar? – Le Mot Juiced Apr 13 '18 at 14:28
  • Can you try to add viewController.modalPresentationStyle = .fullScreen before call present(viewController, animated: true, completion: nil) method? Because i got bottom bar color problem after run my project on iOS 13 similator with Xcode 11.1. – oguzhan Oct 18 '19 at 14:31
0

If you wanna use other background color for the layout which differs with top and bottom edges, or want to keep status bar background color while switching apps, you could try to add two different views of different background color with height 50 or more (pt) in each layout nib. One constraints bottom alignment with top of the safe area, another one constraints top alignment with bottom of the safe area, and then make IBOutlet reference of these two views to set backgroundColor programmatically in code.

Shrdi
  • 359
  • 4
  • 13