🛫여행 멤버(우리들) 뷰 구현, 살펴보기 뷰 연동
여행 멤버 뷰에서 '우리들'부분을 구현했고, 우리 아요 팀원 민재가 구현한 '살펴보기' 뷰와 연동까지 완료했습니다.
수정할 부분이 많긴 한데, 서버API가 배포되면 수정하기로 하고 push했습니다.
🛬배운 점
챌린지 요소는 하나도 없었는데... 테이블 뷰를 아직 별로 사용해보지 않아 저에겐 나름 어려웠습니다 ㅠㅠㅠ
우리 리드개발자 태현이형이 정말 많이 도와줘서 겨우겨우 완성했습니다.
헤더, 푸터, 섹션이 아직도 헷갈리고 delegate 메소드도 모르는 것들이 많습니다 ㅠㅠ
섹션 헤더는 viewForHeaderInSection이라는 메소드를 활용해 UIView를 가져와 넣어줬습니다.
func tableView(_ tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? {
let headerView = MemberHeaderView.loadFromXib()
switch section {
case 0:
//~~~
case 1:
//~~~
default:
return UIView()
}
return headerView
}UIView를 xib로 불러오고 섹션 헤더에 넣어줄 수 있다는 것도 처음 알게 되었습니다.
그리고 PR 코드리뷰를 통해 신기한 것도 배웠습니다.
if myStyleList.count == 0 {
headerView.memberHeaderButton.isHidden = true
} else {
headerView.memberHeaderButton.isHidden = false
}위와 같이 배열의 개수가 0개이면 버튼의 hidden을 true로 바꿔주는 코드를
headerView.memberHeaderButton.isHidden = myStyleList.count == 0이렇게 한 줄로 정리를 해줄 수 있는 것입니다.
myStyleList.count == 0 은 bool 형식으로 true/false가 반환되기 때문에 이에 따라 isHidden에 적용되는 방식이었습니다.
너무 신기했습니다.
이 뷰는 어려운 요소는 없는데 제가 실력이 부족해서 시간이 많이 소요됐었습니다.
테이블 뷰는 정말 많이 사용되기 때문에 제대로 익혀두어야겠다고 많이 느꼈습니다 ㅠㅠ
🛫메인 뷰 - 여행 시작 연동
메인 뷰에서 '새로운 여행 시작하기' 버튼 클릭시 이어지는 플로우에 해당하는 뷰들을 모두 연동했습니다.
🛬배운 점
'새로운 여행 시작하기' 버튼을 누르면 present 후 dissmiss와 navigation push가 동시에 이뤄지는 플로우라서 계층이 꼬이는 문제가 있었습니다.
혜진누나의 도움으로 해결했는데, 해결법의 가장 핵심은 presentingViewController 라는 요소였습니다.
@IBAction func startButtonClicked(_ sender: Any) {
guard let navi = presentingViewController as? UINavigationController else {
return
}
dismiss(animated: true) {
let addDateStoryboard = UIStoryboard(name: "AddTripStoryboard", bundle: nil)
guard let nextVC = addDateStoryboard.instantiateViewController(identifier: "AddTripViewController") as? AddTripViewController else { return }
nextVC.modalPresentationStyle = .fullScreen
navi.pushViewController(nextVC, animated: true)
}
}Swift에는 presentingViewController 라는 것과 presentedViewController라는 것이 있는데, 현재 해당 뷰를 present한 뷰/present된 뷰가 이 요소들에 들어가는 형식입니다.
저는 메인 뷰에서 present 된 뷰를 dissmiss하는 동시에, 메인 뷰에서 다른 뷰를 navigation push 했어야하는 상황이라 Protocol-Delegate패턴을 사용하려 했는데, 위와 같은 방법으로 해결하니 코드도 훨씬 간단해지고 쉽게 해결할 수 있었습니다.
🛫성향 테스트 결과 뷰 연습
성향 테스트 결과 뷰를 연습해봤습니다.
🛬배운 점
서버에서 이미지URL을 받고, 스크롤뷰에 이미지를 뿌려줘야하는 작업입니다.
디바이스마다 가로-세로 크기가 다르기 때문에 이미지 크기를 조정해 레이아웃을 잡아주는 것이 어려웠습니다.
extension UIImage {
public func resized(to target: CGSize) -> UIImage? {
let ratio = min(
target.height / size.height, target.width / size.width
)
let newSize = CGSize(
width: size.width * ratio, height: size.height * ratio
)
UIGraphicsBeginImageContextWithOptions(newSize, false, 1.0)
draw(in: CGRect(origin: .zero, size: newSize))
defer { UIGraphicsEndImageContext() }
return UIGraphicsGetImageFromCurrentImageContext()
}
}구글링을 통해 이미지 크기를 조정해주는 방법을 배웠습니다.
가로 세로의 비율을 측정하고 비율에 맞게 사이즈를 조정해주는 것입니다.
이 Extension 메소드를 통해 이미지 URL을 받으면 크기를 조정해 스크롤뷰에 알맞게 뿌려줄 수 있었습니다.
🛫내일의 목표
이제 뷰 작업은 자잘한 요소들을 제외하곤 거의 마무리 되었습니다.
오늘 서버파트 팀원들이 API를 배포해주었는데, 내일부터는 서버를 붙이는 작업을 진행할 예정입니다.
이전엔 단순히 데이터를 GET하여 활용하는 작업만 해봤는데, 이번 두리번 프로젝트에서는 로그인을 통해 사용자들에 따라 데이터를 구별하는 작업도 필요하여 걱정이 많습니다.
토큰이 뭔지도 잘 몰라서......
내일은 앞으로 서버 붙이는 작업을 원활하게 할 수 있게 서버 공부를 열심히 하고, 뷰 1~2개 정도에 서버를 붙여보는 연습을 하며 서버 붙이기에 익숙해지는 것이 목표입니다.
