[UIKit] UIBarButton 원하는 이미지 넣는 법

UIBarButton이 원하는 아이콘으로 안나오고, 검정색으로 나옴

해결방법

// ⭐️ Bar Button Item
        let image = UIImage(named: "addButton")
        let renderedImage = image?.withRenderingMode(.alwaysOriginal)
        let barButtonItem = UIBarButtonItem(image: renderedImage, style: .plain, target: self, action: #selector(nextButtonTapped))
        navigationItem.rightBarButtonItem = barButtonItem

• UIBarButtonItem에 이미지를 추가할 때 이미지가 검정색으로 표시되는 경우, 이는 일반적으로 이미지의 배경이 투명하지 않은 경우 발생한다. 이 경우 이미지를 로드 할 때 배경을 투명하게 만들어야 한다.

다음은 이미지의 배경을 투명하게 만드는 방법이다.

• UIImage의 withRenderingMode(_:) 메서드를 사용하여 이미지의 렌더링 모드를 .alwaysOriginal로 설정하여 이미지 배경을 투명하게 만든다. 그런 다음 UIBarButtonItem생성자에 변경된 이미지를 전달하여 UIBarButtonItem객체를 만들고 네비게이션 바에 추가한다.

이제 잘나옴 😆

---

private func configureNavigation() {
        
        let deleteImage = UIImage(named: "deleteButton")
        let saveImage = UIImage(named: "saveButton")
        let renderedDeleteImage = deleteImage?.withRenderingMode(.alwaysOriginal)
        let renderedSaveImage = saveImage?.withRenderingMode(.alwaysOriginal)
        
        let firstButton = UIBarButtonItem(image: renderedDeleteImage, style: .plain, target: self, action: #selector(saveButtonTapped))
        let secondButton = UIBarButtonItem(image: renderedSaveImage, style: .plain, target: self, action: #selector(deleteButtonTapped))
        
        let buttons = [firstButton, secondButton]
        navigationItem.rightBarButtonItems = buttons
        
    }

두 개도 문제없이 나옴!

리팩토링

private func configureNavigation() {
        let deleteButton = UIBarButtonItem(image: UIImage(named: "deleteButton")?.withRenderingMode(.alwaysOriginal),
                                            style: .plain,
                                            target: self,
                                            action: #selector(deleteButtonTapped))
        
        let saveButton = UIBarButtonItem(image: UIImage(named: "saveButton")?.withRenderingMode(.alwaysOriginal),
                                          style: .plain,
                                          target: self,
                                          action: #selector(saveButtonTapped))
        
        navigationItem.rightBarButtonItems = [deleteButton, saveButton]
    }

• 이 코드에서는 UIBarButtonItem 객체를 생성할 때, 이미지의 배경을 투명하게 만들기 위해 withRenderingMode(.alwaysOriginal)를 이미지 생성 코드 안에 삽입하였다. 또한, buttons 배열을 사용하지 않고 navigationItem.rightBarButtonItems에 배열을 직접 할당하여 코드를 간소화하였다.