iOS) 맛집소개 | 매장소개 뷰 기능구현

유재우·2022년 1월 23일
1

매장소개 뷰 기능구현



처음 구상 했을 때엔 리스트를 활용하여 각 행의 사진, 음식 종류, 매장 이름의 종류를 넣어 인덱스를 이용하여 행마다 출력 하려했지만, 생각해보니 Swift에는 리스트형이 없다.
그래서 다시 생각한게 enum(열거형)을 이용해서 각 case에 변수를 지정해서 정보를 저장 하는 코드를 구상해보았다.

var name : String = ""
var category : String = ""
enum Name : Int {
    case a = 0
    case b
    case c
    case d
    case e
    case f
    func aName() {
        switch self{
        case .a:
            var name : String = "민들레뜨락"
            var category : String = "술집"
        case .b:
            var name : String = "민들레초밥"
            var category : String = "일식"
        case .c:
            var name : String = "오늘, 버거싶어"
            var category : String = "패스트푸드"
        case .d:
            var name : String = "밥은화"
            var category : String = "덮밥"
        case .e:
            var name : String = "하다식당"
            var category : String = "일식"
        case .f:
            var name : String = "다온"
            var category : String = "한식"
        }
    }
}
Name의 열거형의 rawValue를 0부터 시작하게 해서 Name의 생성자를 생성할 때
indexPath의 값을 활용하여 Name.indexPath를 시용하면 해당하는 행의 정보를 불러오게끔 설정해보았다.


하지만 이런 식으로 계속 오류가 뜨고 원하는대로 적용이 되지 않는다.
아무리 검색을 해봐도 모르겠어서 다른 방법을 검색했더니 처음 생각했던 리스트형과 비슷한 배열방법이 있었다.


let restName:[String] = ["민들레뜨락", "민들레초밥", "오늘, 버거싶어", "밥은화", "하다식당", "다온"]
    let restCategory:[String] = ["술집", "일식", "패스트푸드", "덮밥", "일식", "한식"]

  • 우선 매장사진 순서에 맞게 매장이름과 분류를 설정해서 배열을 만든다.

  • 행의 개수를 배열의 개수로 지정한다.

  • 생성자 cell에 배열의 행에 대비되는 텍스트를 초기화한다.

  • 성공적으로 적용된 모습


  • Search Bar기능 구현

    Search Bar 기능으로 Table의 정보를 검색하기 위해서는 Search Bar가 Table안에 즉 Table에 종속되어 있어여한다.
    하지만 나의 경우에는 Search Bar가 Table에 종속되어 있지 않게 구상을 했으므로 다시 수정을 해야한다.

  • 이와같이 Table밑에 Search Bar가 있어야한다.

  • UISearchBarDelegate를 클래스에 선언을 해준다.

  • Outlet변수 선언과 연결

  • ViewDidLoad()함수에 이벤트 등록

  • filteredData 배열 생성
검색한 정보의 배열을 저장할 곳 생성
첫 화면에서는 모든 행이 출력되어야 하기 때문에 모든 배열 정보를 저장

  • 함수 작성

  • 검색된 매장이름 출력
cell.nameLbl.text = self.filteredData[indexPath.row]
에서 filteredData로 바꾼 이유는 검색된 정보를 바탕으로 배열을 출력하기 위해서이다.

  • 행의 개수 또한 필터링된 배열의 개수만큼 출력한다.



  • 정상적으로 작동되는 모습

  • 수정할 부분
시뮬레이터에서 작동을 해보니 텍스트 공백 설정은 어차피 x버튼이 따로 있어서 없앴다.

Search Bar기능 구현에 도움받은 사이트


  • GitHub에 푸시
profile
끝없이 탐구하는 iOS 개발자 유재우입니다!

0개의 댓글