[Swift] 화면이동시 SafeArea Background Color이 변경 되는 이슈

안녕하세요 욱승임당

이번 포스팅에서는 사소한데 사소하기엔 시간이 좀 걸린 이슈에 대해 포스팅 해볼까 합니다

 

이거 외 않데?  ㅋㅋ

 

이슈

화면 이동 할때 상단에 SafeArea Background Color가 일시적으로 변경되는게 보이시나요?

결론부터 말해주면 문제점은 SafeArea의 색과 네비바의 색이 불일치 하기 때문에 저러코롬 이상하게 화면이동 되는 것! 임!

그래서 SafeArea Background Color를 .white로 변경해주믄 댐

이슈 해결

그 중 'SafeAreaBrush'라는 라이브러리를 사용하여 이슈를 해결했다.

 

Reference

[iOS/Swift] Safe Area를 색칠하는 방법

 

Podfile

pod 'SafeAreaBrush' # safeAreaColor

 

import

import SafeAreaBrush

 

구현

// MARK: - SafeArea Background Color 변경
    func setSafeAreaBackgroundColor() {
        fillSafeArea(position: .top, color: .white)
        fillSafeArea(position: .left, color: .white)
        fillSafeArea(position: .right, color: .white)
        fillSafeArea(position: .bottom, color: .white)
    }

 

Full Code

import Foundation
import UIKit
import SafeAreaBrush

final class MainViewController: UITabBarController {
    let fontManager = FontManager.shared
    
    override func viewDidLoad() {
        super.viewDidLoad()
        
        setSafeAreaBackgroundColor()
        setTabbar()
        setAttribute()
    }
    
    // MARK: - SafeArea Background Color 변경
    func setSafeAreaBackgroundColor() {
        fillSafeArea(position: .top, color: .white)
        fillSafeArea(position: .left, color: .white)
        fillSafeArea(position: .right, color: .white)
        fillSafeArea(position: .bottom, color: .white)
    }
    
    // MARK: - Tabbar Setting
    func setTabbar() {
        let appearanceTabbar = UITabBarAppearance()
        appearanceTabbar.configureWithOpaqueBackground()
        appearanceTabbar.backgroundColor = UIColor.white
        tabBar.standardAppearance = appearanceTabbar
        tabBar.tintColor = .black
        tabBar.backgroundColor = .white
    }
    
    // MARK: - Tabbar 화면이동 및 눌렸을때/눌리지 않았을때 이미지 Set
    func setAttribute() {
        // MARK: - UIBar Create NavigtaionController
        viewControllers = [
          createNavController(for: HomeViewController(), title: NSLocalizedString("Home", comment: ""), image: UIImage(named: "Home")!, selectedImage: UIImage(named: "Home_fill")!),
          createNavController(for: OrderViewController(), title: NSLocalizedString("Order", comment: ""), image: UIImage(named: "Coffee")!, selectedImage: UIImage(named: "Coffee_fill")!),
          createNavController(for: MyPageViewController(), title: NSLocalizedString("My Page", comment: ""), image: UIImage(named: "User_box_light")!, selectedImage: UIImage(named: "User_box_duotone_line")!)
        ]
    }
    
    // MARK: - Tabbar 화면이동 및 눌렸을때/눌리지 않았을때 이미지 Set
    fileprivate func createNavController(for rootViewController: UIViewController, title: String?, image: UIImage, selectedImage: UIImage) -> UIViewController {
        
        let navController = UINavigationController(rootViewController: rootViewController)
        navController.navigationBar.isTranslucent = false
        navController.navigationBar.backgroundColor = .white
        navController.tabBarItem.title = title
        navController.tabBarItem.image = image
        navController.tabBarItem.selectedImage = selectedImage
        navController.interactivePopGestureRecognizer?.delegate = nil // 스와이프 제스처 enable true
        return navController
    }
}

 

Full Code라 기존에 쓰던 코드도 같이 첨부 하였음..

Tabbar를 만들고 구현하는 로직인데 활용 해도 좋을듯 함 ㅎㅎ

 

결과

 

결론

'뭐이런 황당한 버그가?' 했었지만 언제나 그랬듯 정답을 찾쟈 ㅋ 

나 좀 멋있을지도?