[iOS] 7월 16일 (금) 개발 일지

1. UISearchController와 BackButton 같이 놓기

 

어떻게 구현해볼까?

 

다음과 같은 뷰를 구현하려고 한다. 

우선 BackButton이 있는 것으로 보아 NavigationController 의 Stack 에 쌓여있는 View라고 판단했다.

 

A -> B 로 넘어가는 ViewController 에서

B ViewController를 어떻게 구현할지 생각해봤다. 

 

우선 NavigationBar에 BackButton, SearchBar가 있는 형태이다.

SearchBar 등을 검색해보니 UISearchController가 있었다. 좀 더 찾아보니 이 UISearchController는 StoryBoard 상에서 UI를 아직 지원해주지 않는다고 한다. 즉, 코드로 짜야만 했다. 

 

B ViewController에서 UISearchController를 생성하고 만들어주기로 했다. 그냥 Navigation Bar에 Bar Button, SearchBar를 넣는 것보다 로직 상으로 구현하기 용이한 것들이 많았기 때문. 

 

처음에는 UISearchController를 통해 검색창을 구현하면 맨 위에 있는 형태처럼 UI를 구성하는게 불가능한 줄 알았다. 하지만 며칠이 지나 좀 더 찾아보고 만져보니 다음과 같이 구현할 수 있었다.

 

navigationItem.titleView !!!!!

    private func setupSearchViewController() {
        let searchController = UISearchController(searchResultsController: nil)

              
        
        // 1
        searchController.searchResultsUpdater = self
        // 2
        searchController.obscuresBackgroundDuringPresentation = false
        // 3
        searchController.searchBar.placeholder = ""
        // 4 -> 삭제
	    // navigationItem.searchController = searchController
        // 5
        definesPresentationContext = true
        searchController.automaticallyShowsCancelButton = false

        
        navigationItem.hidesSearchBarWhenScrolling = false

        
        // Include the search bar within the navigation bar.
        self.navigationItem.titleView = searchController.searchBar;

        self.navigationItem.backBarButtonItem = UIBarButtonItem.init(image: UIImage(named: "icBack"), style: .plain, target: self, action: "back:")
        
        
        
    }

 

 

 

2. LifeCycle와 resignFirstResponder 활용하여 이슈 해결

A ViewController -> B ViewController 로 Navigation Stack 이 쌓여 있고, 

A ViewController의 SearchBar를 누르면 B ViewController로 넘어가도록 로직을 짜려고 했다. 

그런데, B ViewController에서 다시 A ViewController로 넘어오면 A ViewController에 있던 SearchBar에 그대로 Focusing이 되어 있다보니 저절로 다시 B ViewController로 넘어오는 것. 

 

어떻게 해결할까 생각하다가 SearchBar를 초기화하고 싶다 -> A ViewController에서 View가 사라질 때 혹은 다시 보일 때 로직을 넣으면 되지 않을까 -> LifeCycle 활용하자.

 

다음은 A ViewController의 코드 일부이다. 

extension HomeViewController: UISearchBarDelegate {
    func searchBarTextDidBeginEditing(_ searchBar: UISearchBar) {        
        guard let searchViewController = self.storyboard?.instantiateViewController(identifier: "SearchViewController") as? SearchViewController else {return}
        self.navigationController?.pushViewController(searchViewController, animated: true)
    }
}

A ViewController에서 SearchBar를 누르는 순간 B ViewController로 이동한다. (코드 상에서는 SearchViewController)

    override func viewDidDisappear(_ animated: Bool) {
         searchBar.resignFirstResponder()
    }

B ViewController로 이동하기 전, A ViewController에서는 화면이 사라질 때 SearchBar를 다시 초기 설정하도록 하여 Focusing 되어 있는 것을 막도록 한다. 

3. didSet을 이용해 Image 비동기 처리

 

 

 

4. TableViewCell의 awakeFromNib이 아닌, layoutSubviews

Cell 내부에 있는 이미지 뷰를 동그랗게 만들고 싶었다. 

import UIKit
import Kingfisher

class HospitalTableViewCell: UITableViewCell {

    let examination: [Int: String] = [1:"피부과", 2:"치과", 3:"성형외과", 4:"안과", 5:"암요양", 6:"정형외과", 7:"한방"]

    @IBOutlet weak var hospitalImageView: UIImageView!
    @IBOutlet weak var examinationTypeLabel: UILabel! // 피부과
    @IBOutlet weak var hospitalNameLabel: UILabel!
    @IBOutlet weak var starLabel: UILabel!
    @IBOutlet weak var hospitalAddressLabel: UILabel!
    @IBOutlet weak var hospitalDistanceLabel: UILabel!
    
    override func awakeFromNib() {
        super.awakeFromNib()
        // Initialization code
    }

    override func setSelected(_ selected: Bool, animated: Bool) {
        super.setSelected(selected, animated: animated)

        // Configure the view for the selected state
    }
    
    
    override func layoutSubviews() {
        super.layoutSubviews() // 이것도 중요. 이거안해주면 밑에 seperator 없어졌었음

        // 헐 이거 여기에 적용해야 동작하네...?
        hospitalImageView.layer.borderWidth = 1.0
        hospitalImageView.layer.masksToBounds = false
        hospitalImageView.layer.borderColor = UIColor.white.cgColor
        hospitalImageView.layer.cornerRadius = hospitalImageView.frame.size.width / 2
        hospitalImageView.clipsToBounds = true
    }
    
    func setupHospitalTableViewCell(hospital: Hospital) {

    }
    
}

5. 좋아요 버튼 로직 구현

https://stackoverflow.com/a/34542768