Hành vi của công cụ tập trung tùy chỉnh cho UICollectionView

Question

Tôi sử dụng tiêu chuẩn UICollectionView với các phần. Các tế bào của tôi được bố trí như một lưới điện. Ô kế tiếp theo hướng được chọn sẽ được lấy nét chính xác nếu người dùng di chuyển tiêu điểm xung quanh bằng điều khiển từ xa của Apple TV. Nhưng nếu có một "khoảng trống" trong lưới, công cụ lấy nét mặc định sẽ nhảy qua các phần. Nó làm điều này để tập trung một tế bào có thể là một vài phần đi nhưng trong cùng một cột.

Ví dụ đơn giản: Có 3 phần. Phần đầu tiên có 3 ô. Cái thứ hai có 2 ô và ô cuối cùng có 3 ô. Xem hình ảnh sau:

Nếu ô màu xanh lá cây là tập trung và người dùng chạm vào hướng xuống, các tế bào màu vàng được tập trung và phần hai được bỏ qua bởi các công cụ tập trung.

Tôi muốn ép buộc rằng không có phần nào có thể bị nhảy qua. Vì vậy, thay vì tập trung các tế bào màu vàng tôi muốn tập trung các tế bào màu xanh.

Tôi biết rằng công cụ Apple TV Focus hoạt động bên trong như hệ thống lưới và hành vi được mô tả là hành vi mặc định. Để cho phép các chuyển động khác (ví dụ: đường chéo), chúng tôi cần trợ giúp công cụ lấy nét bằng cách đặt các số vô hình UIFocusGuide s có thể chuyển hướng công cụ lấy nét đến preferredFocusedView. Vì vậy, trong hình dưới đây có một hướng dẫn lấy nét màu đỏ vô hình được đặt vào không gian trống của phần UICollectionView sẽ chuyển hướng tiêu điểm xuống đến ô màu xanh mong muốn. Tôi nghĩ rằng đó sẽ là giải pháp hoàn hảo, trong theorie.

Nhưng làm thế nào tôi sẽ thêm UIFocusGuide s cho tất cả các khoảng trống của UICollectionView phần? Tôi đã thử nhiều thứ nhưng không có gì hiệu quả. Có thể thêm nó như là một trang trí xem nhưng điều đó có vẻ sai. Hoặc là các ô bổ sung, nhưng điều đó phá vỡ lớp dữ liệu và các ràng buộc neo không hoạt động.

Có ai có ý tưởng về cách thêm UIFocusGuide s vào số UICollectionView không?

Answer 1

Một giải pháp là phân lớp UICollectionViewFlowLayout với bố cục bổ sung Chế độ xem bổ sung với UIFocusGuide s ở trên cùng cho tất cả các vùng trống.

Về cơ bản bố trí dòng chảy tùy chỉnh tính toán bố trí cần thiết thuộc tính trong prepareLayout như thế này:

self.supplementaryViewAttributeList = [NSMutableArray array]; 
if(self.collectionView != nil) { 
    // calculate layout values 
    CGFloat contentWidth = self.collectionViewContentSize.width - self.sectionInset.left - self.sectionInset.right; 
    CGFloat cellSizeWithSpacing = self.itemSize.width + self.minimumInteritemSpacing; 
    NSInteger numberOfItemsPerLine = floor(contentWidth/cellSizeWithSpacing); 
    CGFloat realInterItemSpacing = (contentWidth - (numberOfItemsPerLine * self.itemSize.width))/(numberOfItemsPerLine - 1); 

    // add supplementary attributes 
    for (NSInteger numberOfSection = 0; numberOfSection < self.collectionView.numberOfSections; numberOfSection++) { 
     NSInteger numberOfItems = [self.collectionView numberOfItemsInSection:numberOfSection]; 
     NSInteger numberOfSupplementaryViews = numberOfItemsPerLine - (numberOfItems % numberOfItemsPerLine); 

     if (numberOfSupplementaryViews > 0 && numberOfSupplementaryViews < 6) { 
      NSIndexPath *indexPathOfLastCellOfSection = [NSIndexPath indexPathForItem:(numberOfItems - 1) inSection:numberOfSection]; 
      UICollectionViewLayoutAttributes *layoutAttributesOfLastCellOfSection = [self layoutAttributesForItemAtIndexPath:indexPathOfLastCellOfSection]; 

      for (NSInteger numberOfSupplementor = 0; numberOfSupplementor < numberOfSupplementaryViews; numberOfSupplementor++) { 
       NSIndexPath *indexPathOfSupplementor = [NSIndexPath indexPathForItem:(numberOfItems + numberOfSupplementor) inSection:numberOfSection]; 
       UICollectionViewLayoutAttributes *supplementaryLayoutAttributes = [UICollectionViewLayoutAttributes layoutAttributesForSupplementaryViewOfKind:ARNCollectionElementKindFocusGuide withIndexPath:indexPathOfSupplementor]; 
       supplementaryLayoutAttributes.frame = CGRectMake(layoutAttributesOfLastCellOfSection.frame.origin.x + ((numberOfSupplementor + 1) * (self.itemSize.width + realInterItemSpacing)), layoutAttributesOfLastCellOfSection.frame.origin.y, self.itemSize.width, self.itemSize.height); 
       supplementaryLayoutAttributes.zIndex = -1; 

       [self.supplementaryViewAttributeList addObject:supplementaryLayoutAttributes]; 
      } 
     } 
    } 
} 

và sau đó trả về bố trí cần thiết trong phương pháp layoutAttributesForSupplementaryViewOfKind: như thế này:

if ([elementKind isEqualToString:ARNCollectionElementKindFocusGuide]) { 
    for (UICollectionViewLayoutAttributes *supplementaryLayoutAttributes in self.supplementaryViewAttributeList) { 
     if ([indexPath isEqual:supplementaryLayoutAttributes.indexPath]) { 
      layoutAttributes = supplementaryLayoutAttributes; 
     } 
    } 
} 

Bây giờ bổ sung bạn Số lượt xem chỉ cần một số UIFocusGuide có cùng kích thước với chế độ xem bổ sung. Đó là nó.

Thực hiện đầy đủ phương pháp được mô tả có thể được tìm thấy here on gitHub

Answer 2

Hai cách để đạt được mục tiêu của bạn. Ít nhất những gì tôi đã cố gắng và làm cho nó hoạt động. =). Có thể có những cách khác nữa.

1:

Cách dễ nhất để đạt được mục tiêu của bạn là thêm chế độ xem bộ sưu tập dọc với ô có chế độ xem bộ sưu tập theo chiều ngang. Mỗi bộ sưu tập ngang là phần của bạn.

Hãy chắc chắn rằng bạn thêm đoạn mã sau vào xem bộ sưu tập dọc:

func collectionView(collectionView: UICollectionView, canFocusItemAtIndexPath indexPath: NSIndexPath) -> Bool { 
    return false 
} 

2:

Nếu bạn muốn sử dụng UIFocusGuide Tôi nghĩ rằng một nơi tốt để thêm tập trung hướng dẫn là phần tiêu đề. Đảm bảo hướng dẫn tập trung của bạn trong tiêu đề phần và cập nhật preferredFocusedView như chuyển sang từng phần. Trong trường hợp của tôi, tôi chỉ định ô đầu tiên của mỗi phần khi tôi rời khỏi phần đó.