O carrossel infinito é um elemento de interface essencial no desenvolvimento iOS moderno, permitindo a exibição cíclica de conteúdos como banners publicitários, vitrines de produtos ou galerias de mídia. Diferente de uma lista estática, o carrossel infinito exige uma lógica de manipulação de índices e deslocamentos para simular uma continuidade ininterrupta para o usuário.

Fundamentos com UIScrollView e UIPageControl

A base de um carrossel em Swift geralmente reside na combinação do UIScrollView para a movimentação física e do UIPageControl para o feeedback visual da posição atual. O UIScrollView deve ser configurado com a propriedade isPagingEnabled como verdadeira para garantir que o conteúdo "trave" em cada página.

func configurarEstruturaBase() {
    let containerScroll = UIScrollView(frame: self.view.bounds)
    containerScroll.isPagingEnabled = true
    containerScroll.showsHorizontalScrollIndicator = false
    containerScroll.delegate = self
    
    let controlePagina = UIPageControl()
    controlePagina.numberOfPages = listaItens.count
    controlePagina.currentPage = 0
    
    self.view.addSubview(containerScroll)
    self.view.addSubview(controlePagina)
}

Para sincronizar o indicador visual com o movimento do scroll, utilizamos o protocolo UIScrollViewDelegate. O cálculo do índice atual é feito dividindo o deslocamento horizontal pela largura do frame do componente.

func scrollViewDidEndDecelerating(_ scrollView: UIScrollView) {
    let larguraPonto = scrollView.frame.width
    let paginaAtual = Int(floor((scrollView.contentOffset.x - larguraPonto / 2) / larguraPonto) + 1)
    meuPageControl.currentPage = paginaAtual
}

Lógica de Loop Infinito e Transições Suaves

A técnica mais comum para criar a ilusão de um loop infinito consiste em manipular o array de dados. Adicionamos uma cópia do último item no início e uma cópia do primeiro item no final. Quando o usuário atinge as extremidades falsas, o scroll é reposicionado instantaneamente para a posição real correspondente, sem animação, criando a percepção de continuidade.

• Passo 1: Preparar o conjunto de dados como [Item N, Item 1, Item 2, ..., Item N, Item 1].
• Passo 2: Monitorar o contentOffset.
• Passo 3: Se o offset atingir o índice 0 (cópia do último), saltar para o índice N.
• Passo 4: Se atingir o último índice (cópia do primeiro), saltar para o índice 1.

Encapsulamento em Componentes Reutilizáveis

Para escalar o desenvolvimento, é recomednável criar uma classe customizada, como AppInfiniteBanner, que abstraia essa complexidade. Esse componente deve aceitar diversos tipos de conteúdo (imagens, views customizadas ou textos).

class AppInfiniteBanner: UIView {
    private var scrollerPrincipal: UIScrollView!
    var fontesDeDados: [AnyObject] = [] {
        didSet {
            renderizarConteudo()
        }
    }

    private func renderizarConteudo() {
        // Lógica para instanciar subviews dinamicamente baseada no tipo de dado
        for (indice, dado) in fontesDeDados.enumerated() {
            let viewItem = criarViewParaDado(dado)
            viewItem.frame = CGRect(x: CGFloat(indice) * bounds.width, y: 0, width: bounds.width, height: bounds.height)
            scrollerPrincipal.addSubview(viewItem)
        }
        scrollerPrincipal.contentSize = CGSize(width: bounds.width * CGFloat(fontesDeDados.count), height: bounds.height)
    }
}

Integração de Vídeo com AVPlayer

Carrosséis modernos frequentemente exigem suporte a vídeo. A integração do AVPlayer dentro de um carrossel requer gerenciamento cuidadoso do ciclo de vida da reprodução para economizar recursos de hardware e bateria.

private func prepararPlayerDeVideo(com url: URL, no container: UIView) {
    let player = AVPlayer(url: url)
    let camadaVideo = AVPlayerLayer(player: player)
    camadaVideo.frame = container.bounds
    camadaVideo.videoGravity = .resizeAspectFill
    container.layer.addSublayer(camadaVideo)
    
    // Inicia apenas se a view estiver visível
    player.play()
}

É fundamental pausar o player assim que a página do vídeo sair da área visível do UIScrollView para evitar consumo desnecessário de processamento.

Utilizando UICollectionView para Layouts Complexos

Quando o carrossel exige layouts mais elaborados, como efeitos de profundidade, escalas diferenciadas para o item central ou múltiplas colunas, o UICollectionView é a ferramenta ideal. Com um UICollectionViewFlowLayout customizado, podemos manipular os atributos de layout durante o scroll.

class CarrosselEspecialLayout: UICollectionViewFlowLayout {
    override func layoutAttributesForElements(in rect: CGRect) -> [UICollectionViewLayoutAttributes]? {
        let atributos = super.layoutAttributesForElements(in: rect)
        let centroVisivel = collectionView!.contentOffset.x + collectionView!.bounds.width / 2
        
        atributos?.forEach { attr in
            let distancia = abs(attr.center.x - centroVisivel)
            let escala = max(1 - (distancia / collectionView!.bounds.width), 0.8)
            attr.transform = CGAffineTransform(scaleX: escala, y: escala)
        }
        return atributos
    }
}

Esta abordagem permite que o item central ganhe destaque enquanto os itens laterais diminuem de tamanho, proporcionando uma experiência visual premium e fluida.