개요

고속 스크롤

tvOS10.2부터 스크롤 뷰가 세로로 길면 Accelerated Scroll(고속 스크롤)이라는 기능이 추가되었습니다.
이것은

같은 방향으로 여러 번 스 와이프

터치 표면의 오른쪽 가장자리를 위아래로 스 와이프

중 하나로 발화합니다.



표준으로 활성화되어 있으며 비활성화할 수 없습니다.

목록 시스템의 인덱스 레이블

또한 UITableView 및 UICollectionView의 경우 인덱스 레이블을 사용자 지정할 수 있습니다.
빠른 스크롤이 시작되면 다음 delegate가 호출되고 적절한 값을 반환하면 지정된 레이블이 표시됩니다.



상하 스와이프로 조작하면, 라벨에 대응하는 IndexPath에 단번에 점프해 줍니다. 매우 편리하다고 생각합니다.

프로그램 표의 재생 버튼 할당 문제

AbemaTV 프로그램 표는 날짜 변경을 위해 재생 버튼을 사용합니다.



본래라면 재생 버튼은 프로그램표로부터의 직접 재생에 할당하고 싶은 곳입니다만, 현재 이런 UX로 침착하고 있습니다.
인덱스 라벨에 날짜 변경의 기능을 맡기면, 직접 재생을 해방할 수 있을 것 같습니다.

실제로 구현해 보았습니다.

실제로 해보고 깨달았지만, 이 라벨, 폰트나 배경색, 표시 위치를 지정할 수 없습니다. 표시상 컨텐츠와 겹쳐 버려, 매우 보기 힘든 느낌이 되어 버렸습니다.
그리고 반각 5문자 정도가 한도로, 그 이상이라고 truncate되어 버렸습니다😇

해결 방법

숨기기

빠른 스크롤은 비활성화할 수 없지만 인덱스 레이블을 숨길 수 있는 것 같습니다.
다음과 같이 숨길 수 있습니다. 물론 프로그램표의 케이스에서는 이것이라면 재생 버튼 할당 문제의 해결은 되어 있지 않습니다.

if #available(tvOS 10.2, *) {
    collectionView.indexDisplayMode = .alwaysHidden
}

자작하다

그래서 표준 UI가 미묘하기 때문에 자작하자는 것입니다.
자꾸 사양을 정리해 보면 이런 느낌입니다.

오른쪽 가장자리 스 와이프 감지

인덱스를 스크롤하는 동안도 스 와이프에 스크롤이 반응한다

오른쪽 가장자리를 위아래로 드래그하는 동안 스크롤이 가속되어 단번에 점프합니다.

인덱스 표시/숨기는 약간 lazy에 반응한다

오른쪽 끝 스와이프 감지

어쩌면 과제가 되는 것은 「우단의 스와이프를 검지한다」라고 하는 곳이라고 생각합니다만, 이미 이 기사 로 해결이므로, 이것을 이용해 래퍼 라이브러리를 만들었습니다.

만들어 보았다.

이 GestureTV를 이용하여 얼른 다음과 같은 것을 만들어 보았습니다.

오른쪽 가장자리에 손가락이있을 때 오른쪽보기를 표시하여 포커스 업데이트

오른쪽의 뷰에서 포커스 인덱스가 바뀌면 왼쪽의 테이블 뷰에 반영

라는 구현이 되어 있습니다. 샘플 코드를 GestureTV 리포지토리와 함께 제공 하고 있으므로 봐 주세요.

표준 인덱스 라벨의 경우, 인덱스 라벨이 나올 때의 포커스의 이동 속도가 보다 빠르고, 인덱스간의 점프가 보다 편하게 할 수 있는 인상이므로, 아직 튜닝의 여지는 있다고 생각합니다.

요약

리스트계의 인덱스 라벨을 자작해 보았습니다. 이벤트조차 잡히면, 나머지는 꽤 같다.
이것으로 조금은 프로그램표가 사용하기 쉬워지면 좋습니다만.