[Step Bonus] 연락처관리프로그램 UI ― iyeah, Jenna #17
Conversation
- 불필요한 표현(self) 및 접근 삭제 - 대소문자 상관 없이 검색되도록 개선
- UITableViewDelegate 채택
- 동명이인일 경우에도 정확히 삭제되는지 확인하기 쉬운 더미데이터로 변경 - 동명이인일 경우 나이순으로 정렬되도록 수정 - 아래로 스크롤해도 서치바가 보이도록 처리
- `makeSearchBar()`를 private func로 수정 - extension 내 두 메서드의 순서 교체 (private이 밑으로 오도록) - `tableView(_:commit:forRowAt:)`메서드의 불필요한 로직 생략
| } | ||
|
|
||
| extension ListProfileViewController: UISearchResultsUpdating { | ||
| func updateSearchResults(for searchController: UISearchController) { | ||
| guard let text = searchController.searchBar.text else { return } |
There was a problem hiding this comment.
guard 문의 else 뒤 return은 개행 처리해주세요. 확실하게 return 되는 부분을 구분하는게 좋습니다
There was a problem hiding this comment.
수정했습니다! 앞으로도 개행해서 처리하도록 할게요 🙋🏻♀️
해당 커밋 : c0ce3cb
| extension ListProfileViewController: UISearchResultsUpdating { | ||
| func updateSearchResults(for searchController: UISearchController) { | ||
| guard let text = searchController.searchBar.text else { return } | ||
| filteredProfiles = profiles.filter { $0.name.lowercased() == text.lowercased() } |
There was a problem hiding this comment.
여기도 { , } 부분 개행 해주세요.
한줄에 너무 많은 코드가 있으면 작성자가 아니라면, 가독성이 떨어집니다.
There was a problem hiding this comment.
가독성을 위해 개행 처리하여 수정했습니다 :)
해당 커밋 : c0ce3cb
| return lhs != rhs ? lhs < rhs : $0.age < $1.age | ||
| } | ||
| } | ||
| private lazy var filteredProfiles = [Profile]() |
There was a problem hiding this comment.
lazy var로 선언한 부분 좋네요! 👍👍
filtered보다는 검색결과 프로필들이라는 느낌의 프로퍼티명으로 바꾸면 더 좋을 것 같아요!
There was a problem hiding this comment.
감사합니다! profileSearchResults 로 변경하였어요 👍🏻
해당 커밋 : c0ce3cb
| contactManageSystem.profiles.sorted { | ||
| let (lhs, rhs) = ($0.name.lowercased(), $1.name.lowercased()) | ||
| return lhs != rhs ? lhs < rhs : $0.age < $1.age | ||
| } |
There was a problem hiding this comment.
복잡한 데이터 로직은 컨트롤러에서 보이지 않고, 모델 쪽에서 처리하도록 하는게 어떨까요?
There was a problem hiding this comment.
ContactManageSystem에 sortProfiles()메서드를 만들어 처리하도록 했어요!
훨씬 깔끔해진 것 같아요 감사합니다🙆🏻♀️
해당 커밋: e544c0d
| private var isSearching: Bool { | ||
| let searchBarController = self.navigationItem.searchController | ||
| let isActive = searchBarController?.isActive ?? false | ||
| let isEmpty = searchBarController?.searchBar.text?.isEmpty ?? false |
There was a problem hiding this comment.
isEmpty는 값을 가져오지 못할 때 ??에서 true로 처리해야하지 않을까요? 👀
There was a problem hiding this comment.
맞아요🫢 감사합니다 바로 수정해 두었어요ㅠㅠ!!
해당 커밋: c0ce3cb
| tableView.reloadData() | ||
| } | ||
|
|
||
| private func makeSearchBar() { |
There was a problem hiding this comment.
이 함수는 UISearchResultsUpdating extension에 선언하기 보다는,
UI 요소를 구현하는 부분을 extension으로 정리하면 좋을 것 같네요.
참고만 하세요! :)
There was a problem hiding this comment.
setUp요소() 유형의 메서드들을 모아놓으라는 말씀이시죠?!
확실히 그러면 뷰가 복잡해져도 보기에 훨씬 편할 것 같아요..!!!
이번 기회에 저희 코드를 다시 살펴봤는데 해당 메서드를
'searchBar 저장프로퍼티'와 'setUpSearchBar() 메서드'로 분리하고 후자를 다른 UI세팅용 메서드들과 묶어도 좋겠다는 생각이 들었어요.
지금 프로젝트는 그런 메서드가 각 VC에 하나씩 뿐이라 의논 끝에 말씀 주신 것처럼 참고만 하기로 했지만, 기억해 두었다가 이후 프로젝트들에서 잘 활용하도록 할게요🤠 좋은 팁 감사합니다!!
| let profile = isSearching ? filteredProfiles[indexPath.row] : profiles[indexPath.row] | ||
| contactManageSystem.remove(profile: profile) | ||
| tableView.deleteRows(at: [indexPath], with: .fade) |
- `ContactManageSystem`에 이름, 나이순으로 정렬하는 메서드 `sortProfiles()`를 추가
안녕하세요 Cory 🐶 !! @corykim0829
코리의 빠르고 세세한 리뷰 덕분에 보너스 스텝까지 도전해 볼 수 있게 되었어요 감사합니다 🍀
2주 동안 고생하셨고, 마지막 스텝도 리뷰 잘 부탁드려요 🫶🏻
✅ 구현 사항
✅ 구현 과정
1️⃣ 테이블뷰 셀 편집
사용한 방법
UITableViewDataSource프로토콜 내에 있는tableView(_:commit:forRowAt:)메서드의editingStyle을.delete로 해당 셀의 연락처를 삭제되도록 구현했어요.트러블 슈팅
isSearching에 따라 index로 접근할 프로필 배열이profiles/filteredProfiles중 어느쪽인지 결정하는 로직을 추가했어요.profiles에서 name이 일치하는 결과를 가져오려고 했지만, 동명이인이 대신 삭제되는 문제가 발생했어요.Profile이 Hashable프로토콜(= 즉 Equatable도 채택함)을 채택했으므로 커스텀 이항연산자를 구현해보려다가 아래와 같은 발상이 떠올라 보류했어요.tableView(_:cellForRowAt:)메서드에서indexPath.row로 profile을 불러왔으므로, 역으로 해당 index의 profile을 꺼내어 삭제하면 해당 셀의 profile이 삭제될 거라고 생각하고 구현했어요.2️⃣ 테이블뷰 검색기능 구현
사용한 방법
UISearchBar인스턴스를 넣는 방법과UISearchController인스턴스를 넣는 방법 중 후자를 사용했어요.filteredProfiles: 검색이 시작되기 전에는 불필요하므로 lazy로 선언isSearching: 서치바가 isActive고 검색란이 비어있지 않다면 true인 계산속성트러블 슈팅
lowercased()메서드를 이용해 대소문자 구분없이 오름차순으로 정렬되도록 수정했어요.