0

Take me 7 hours to researching around the coding and nothing to answer it. I believed Apple created its own Apple Map with only a status bar area in the navigation bar. I have tried to look for this trick code to enable it like that green background of safe area guidelines.

enter image description here

Let me know if you know the code.

Thank you.

Antonio Adrian Chavez
  • 1,016
  • 1
  • 7
  • 12

1 Answers1

0

If I understand well, you can use a simply trick: add a containerView and do your stuff in it and assign the color that you want to dummy status bar simply changing the background color of the view: declare containerView and the label in it:

let containerView = UIView()
let labelInfo = UILabel()

now in viewDidLoad set objects and constraints:

view.backgroundColor = .green // change color for status bar color
    
labelInfo.text = "do your stuff here"
labelInfo.font = .systemFont(ofSize: 24, weight: .semibold)
labelInfo.textColor = .black
labelInfo.textAlignment = .center
labelInfo.translatesAutoresizingMaskIntoConstraints = false
    
containerView.backgroundColor = .lightGray
containerView.translatesAutoresizingMaskIntoConstraints = false
    
view.addSubview(containerView)
containerView.topAnchor.constraint(equalTo: view.safeAreaLayoutGuide.topAnchor).isActive = true
containerView.bottomAnchor.constraint(equalTo: view.safeAreaLayoutGuide.bottomAnchor).isActive = true
containerView.leadingAnchor.constraint(equalTo: view.safeAreaLayoutGuide.leadingAnchor).isActive = true
containerView.trailingAnchor.constraint(equalTo: view.safeAreaLayoutGuide.trailingAnchor).isActive = true
    
containerView.addSubview(labelInfo)
labelInfo.trailingAnchor.constraint(equalTo: containerView.trailingAnchor).isActive = true
labelInfo.leadingAnchor.constraint(equalTo: containerView.leadingAnchor).isActive = true
labelInfo.heightAnchor.constraint(equalToConstant: 50).isActive = true
labelInfo.centerYAnchor.constraint(equalTo: containerView.centerYAnchor).isActive = true

this is the results: enter image description here

Fabio
  • 5,432
  • 4
  • 22
  • 24
  • Nice one! I could try that method. One thing that I have felt about Apple Map and Snapchat with the new update has show blur background with the status bars look like Apple's Navigation bar codes. I know Navigation Bar always uses it to show the top layer, and anything is under the layer like that. – Antonio Adrian Chavez Nov 21 '20 at 04:40
  • @AntonioAdrianChavez Hi, I haven't seen this update yet, do you have a link or a screenshot where I can see it? Thx :) – Fabio Nov 21 '20 at 07:08
  • I am not talking about blur effect, but Navigation Bar like this: https://stackoverflow.com/questions/52112621/how-to-get-blur-effect-similar-to-apple-maps-status-bar – Antonio Adrian Chavez Dec 04 '20 at 22:58
  • @AntonioAdrianChavez but that in your example link is a status bar not navigation bar... – Fabio Dec 06 '20 at 09:46