[iOS] Grouped Style TableView에서 자동으로 생기는 footer 문제 해결하기

 

회사에서 유저들의 정보를 테이블뷰 형태로 보여줘야하는 피쳐가 있었다.

테이블뷰에 헤더를 붙이고 그 헤더가 위로 스크롤 했을 때 상단에 걸려있지 않도록 grouped style로 변경해야하는 문제였다.

 

그런데.. 추가하지도 않은 footer가 등장했다.

회사가 원한 것 vs. 내 코드가 뱉은 것

구분을 쉽게하기 위해서 테이블뷰의 background color를 pink로 지정했다. 즉 오른쪽 이미지에서 pink 색상으로 보이는 영역이 내가 원하지 않던 extra padding인 것이다.

 

버그인줄 알고 온갖 글을 읽어보았지만.. 애플이 (이유는 모르겠으나) 의도한 정상작동으로 판단된다.

해결방법은 footer view에 훼이크(?) 뷰를 하나 넣어주고 height을 .leastNonzeroMagnitude로 잡아주는 것이다.

    func tableView(_ tableView: UITableView, viewForFooterInSection section: Int) -> UIView? {
        let view = UIView()
        view.backgroundColor = .clear
        return view
    }

    func tableView(_ tableView: UITableView, heightForFooterInSection section: Int) -> CGFloat {
        return .leastNonzeroMagnitude
    }

 

이렇게 해주면 위 이미지에서 회사가 원했던대로 빈 공간이 사라진 것을 볼 수 있다.

 

Plain Style도..

참고로 Grouped Style이 아닌 Plain Style 테이블뷰는 아래 영역 뿐만 아니라 헤더 위에도 빈 공간이 삽입되는 현상이 있다.

(분명히 예전엔 안그랬던 것 같은데 뭔가 iOS 15 업뎃 이후부터 이렇게 바뀐 것 같은 느낌이 든다)

뭐꼬!!

이런 경우 헤더는 헤더대로 보여줘야해서 .leastNonzeroMagnitude로 height을 잡아줄 수 없었다.

self.tableView.sectionHeaderTopPadding = 0

이 코드로 해결 가능하다. 공식문서를 보니 iOS 15.0+ 부터 도입된 새로운 녀석이다.

Plain Style 테이블뷰에서 헤더 윗 공간에 padding이 삽입되는 건 iOS 15부터 바뀐 것 같긴 하넹

 

사소하지만 짱났던 테이블뷰와의 사투 끝!