[새싹 iOS] 7주차_UIButton backgroundColor = .clear

• 버튼의 배경색이 투명일 때, 텍스트가 적힌 곳 이외의 부분은 터치해도
  함수가 실행되지 않는 이슈가 생겼다.

1. 이슈

---

// ModifyProfileView.swift

 static func makeButton(_ sender: String) -> UIButton {
        let button = UIButton()
        
        button.setTitle(sender, for: .normal)
        button.setTitleColor(.lightGray, for: .normal)
        button.contentHorizontalAlignment = .leading
        button.layer.borderColor = UIColor.white.cgColor
        button.layer.borderWidth = 1
        
        return button
}

let nameButton = makeButton("이름")
let userNameButton = makeButton("사용자 이름")
let introButton = makeButton("소개")


// ModifyProfileViewController.swift
override func setConfigure() {
        mainView.nameButton.addTarget(self, action: #selector(nameButtonClicked), for: .touchUpInside)
        mainView.userNameButton.addTarget(self, action: #selector(userNameButtonClicked), for: .touchUpInside)
        mainView.introButton.addTarget(self, action: #selector(introButtonClicked), for: .touchUpInside)
}

• 디자인은 멀쩡하게 보이지만, 회색 글씨가 아닌 곳을 터치하면
  addTarget으로 연결한 함수가 작동하지 않는다

• 만약 배경 색을 넣어주면, 버튼의 모든 곳에 터치가 가능하다

    button.backgroundColor = .blue

  

2. 실패

---

1. 레이아웃 수정

• 기존

  nameButton.snp.makeConstraints { make in
              make.top.equalTo(nameTitle)
              make.leading.equalTo(nameTitle.snp.trailing)
              make.trailing.equalTo(self).inset(20)
  //            make.width.equalTo(200)
              make.height.equalTo(50)
  }

• 수정

  nameButton.snp.makeConstraints { make in
              make.top.equalTo(nameTitle)
              make.leading.equalTo(nameTitle.snp.trailing)
  //            make.trailing.equalTo(self).inset(20)
              make.width.equalTo(200)
              make.height.equalTo(50)
  }

2. 버튼 색상

• backgroundColor를 지정해주기만 하면 될까 하고 .clear 지정

  button.backgroundColor = .clear

3. .plain()

• 버튼을 생성할 때 configuration을 plain()으로 선언

  let button = UIButton(configuration: .plain())

3. 타협

---

• swift 자체에서 투명한 곳은 터치가 안되게 막은 것 같았다
  • 사용자 입장에서 버튼이라고 인식하기 어렵기 때문..?

• opacity와 alpha로 투명도를 조절해서 타협하기로 했다
  • 색상을 넣어주긴 하지만,
    사용자 입장에서 거의 투명하게 보일 정도로 조절했다

1. button.layer.opacity

button.layer.opacity = 0.1

• opacity가 0.01 초과일 때, 터치가 가능하다
• 문제는 버튼의 text와 border까지 opacity가 적용되어서, 아무것도 안보인다
  

2. UIColor.white.cgColor.copy(alpha: )

button.layer.backgroundColor = UIColor.white.cgColor.copy(alpha: 0.001)

• alpha가 0.001 이상일 때, 터치가 가능하다
• text나 border의 색상도 그대로이고, 거의 투명해보이기 때문에 사용하기 좋다
  

3. UIColor.white.withAlphaComponent( )

button.backgroundColor = UIColor.white.withAlphaComponent(0.001)

• alpha가 0.001 이상일 때, 터치가 가능하다
• 2와 마찬가지로 사용하기 괜찮아 보인다
  

4. 문서

---

hitTest

• This method ignores view objects that are hidden, that have disabled user interactions, or that have an alpha level less than 0.01.

5. 원인

---

• 화면의 backgroundColor를 지정하지 않았다

• 과제 예시 화면의 배경색이 black이어서
  당연히 backgroundColor를 black으로 설정한 줄 알았는데,
  아무것도 설정하지 않아서 black으로 보였던 것이었다

• 즉, 아무것도 없는 곳을 자꾸 터치하려고 했다....

• baseViewController를 따로 만들고,
  이걸 상속받는 형식으로 클래스를 선언하다 보니
  baseViewController에서만 backgroundColor를 지정해두고
  super 메서드를 호출하지 않아서 실질적인 화면에선 배경색이 나타나지 않았다

• 웬만하면 super 호출하는 걸로..