포스트

Final (28)

나의 지역을 제일 상단에 올리는 기능 구현

변경 배경

기존에는 채널 리스트가 이름 순으로만 정렬되어 있어, 사용자의 현재 지역에 해당하는 채널을 찾기 어려웠다. 사용자가 자주 사용하는 채널이 현재 위치 기반의 채널일 가능성이 높기 때문에, 해당 채널을 리스트 최상단에 올려주는 UX 개선이 필요했다.


구현 방식

1. addChannelToTable(_:) 함수 정렬 방식 변경

기존에는 채널을 단순히 이름순으로 정렬하고 테이블에 추가했다. 하지만 변경 후에는 currentAddress에 해당하는 채널을 먼저 찾아 맨 앞에 삽입하고, 나머지 채널은 이름 기준으로 정렬한다.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
private func addChannelToTable(_ channel: Channel) {
    guard channels.contains(channel) == false else { return }

    channels.append(channel)

    if let currentAddressIndex = channels.firstIndex(where: { $0.name == currentAddress }) {
        let currentAddressChannel = channels.remove(at: currentAddressIndex)
        channels.sort(by: { $0.name < $1.name })
        channels.insert(currentAddressChannel, at: 0)
    } else {
        channels.sort(by: { $0.name < $1.name })
    }

    guard let index = channels.firstIndex(of: channel) else { return }
    channelTableView.insertRows(at: [IndexPath(row: index, section: 0)], with: .automatic)
}

2. 현재 위치 텍스트 표시

채널 셀에 현재 위치한 지역이라는 표시를 시각적으로 제공하기 위해 다음 코드가 추가됨.

1
2
3
if channels[indexPath.row].name == currentAddress {
    cell.myLabel.text = "현재 지역"
    }

3. 위치 기반 currentAddress 설정 및 listener 호출 시점 제어

기존에는 뷰가 로드되자마자 setupListener()를 호출했다. 하지만 이 경우 currentAddress가 설정되기 전에 채널이 불러와져 정렬이 적용되지 않는 문제가 발생했다. 이를 해결하기 위해 아래와 같이 흐름을 수정했다.

1
2
3
4
5
6
7
8
9
10
11
func locationManager(_ manager: CLLocationManager, didUpdateLocations locations: [CLLocation]) {
    if let location = locations.last {
        userLocation = location
        getAddress(coordinate: userLocation) { [weak self] address in
            guard let self = self else { return }
            self.currentAddress = address ?? ""
            self.locationManager.stopUpdatingLocation()
            self.setupListener()
        }
    }
}

결론

  • 현재 위치 기반의 채널을 가장 앞에 표시하여 UX 향상
  • 시각적으로 “현재 지역” 텍스트를 통해 인지성을 높임
  • 위치 정보가 준비된 후에 채널 스트리밍을 시작하여 정렬 정확성 확보

이 개선을 통해 사용자는 더 직관적이고 자신과 관련된 채널을 쉽게 탐색할 수 있게 되었다.

이 기사는 저작권자의 CC BY 4.0 라이센스를 따릅니다.