Toy Project/Netflix Style Application(iOS)

2. SearchBar 구현

개발자킹콩 2021. 4. 25. 17:33

SearchBar 구현

 

 

1. Search Bar와 collectionView가 필요하다.

2. 빈틈없게 Auto Layout을 적용한다. 

 

 

 


 

 

 

SearchViewController

 

우선 적용한 searchBar와 collectionView를 ViewContoller에 outlet으로 연결한다. 

 

 

 

 


 

 

 

searchBar의 경우 searchbar에 의한 결과들을 ViewContoller에 위임시켜서 거기에 해당하는 일들을 VC에서 담당하도록 할 것이다. —> searchBar를 ViewContoller에 Delegate 연결

 

 

여기서 SearchBar와 관련된 메소드를 구현할 것이다. 

 

 

 

 


 

 

 

 

여기서 search를 눌렀을 때, ViewContoller에게 알려주는 method가 존재한다. 

 

—> searchBarSearchButtonClicked

해당 SearchBar의 text를 출력해보도록 하겠다. 

 

 

 

 

 

 

 


 

 

 

 

 

이제 우리는 무엇을 해야하는가?

 

일단 검색어를 갖고 실제 네트워킹을 이용해 검색 요청을 해야한다. 

그리고 키보드가 계속 on 상태인 것을 제어해주어야하고 (검색된 자료가 많으면 키보드가 가리게 된다.),

검색어가 없을때 “검색” 버튼이 눌리면 네트워킹을 하지 않도록 구현할 것이다. 

 

 

 

 

 

 

 


 

 

 

코드 해석

 

 

자! 코드 해석 해보자

 

우선 현재 searchBar를 클릭하게 되면 가장 집중되어 있는 것을 searchBar이다.

그렇다면 “검색” 버튼을 누르게 되면 검색된 자료들이 가려질 수 있기 때문에 키보드를 내리는 작업이 필요하다.

가장 집중되어 있는 것 —> 첫번째로 반응해야 하는것 —> First Responder이다. 

이를 resign해주는 것이 dismissKeyboard 메소드 이다. —> searchBar에 대한 집중을 resign 하는 것이다.

이로인해 “검색” 버튼을 누르면 키보드가 내려가도록 구현하였다.

 

이제 searchBar에 들어 있는 text가 존재하는지를 판단할 것이다. 

—> 없으면 굳이 네트워킹 작업이 필요없고, 쓸데없는 리소스 낭비가 없어진다.