Entender as fases de rolagem

A rolagem é dividida em várias fases. O delta de entrada é enviado por uma sequência de fases para garantir que cada uma tenha a oportunidade de consumir ou reagir ao movimento.

Ao longo desse ciclo, o delta de entrada disponível e o delta de entrada consumida são transmitidos em todas as etapas. Isso fornece a cada fase o contexto completo necessário para reagir, consumir ou ouvir o evento de rolagem.

Como ilustrado na Figura 1, o processo de rolagem segue esta ordem exata:

1. Overscroll:recebe primeiro o delta de entrada inicial, o que dá ao overscroll a chance de reagir primeiro (por exemplo, relaxando um efeito de esticamento ativo).
2. Pré-rolagem de rolagem aninhada:oferece uma oportunidade de reagir ao delta de entrada antes da fase Rolagem. Nessa fase, alguns deltas de entrada podem ser consumidos ou apenas monitorados para acionar mudanças na interface, como recolher ou expandir uma barra de apps.
3. Transformar delta de entrada: ajusta o sinal do delta de entrada bruta com base na orientação e direção do layout para garantir um comportamento de rolagem natural. Para mais informações, consulte a seção Transformar delta de entrada.
4. Rolagem:essa fase recebe o delta de entrada disponível e não consumido ajustado para corresponder à configuração do contêiner de rolagem. Normalmente, ele usa esse delta para atualizar o próprio deslocamento de rolagem.
5. Reverter para delta de entrada bruta: reverte o delta disponível e consumido da fase Rolagem para o sinal delta de entrada bruta original.
6. Rolagem aninhada após a rolagem:essa fase reage depois que a fase principal de rolagem é concluída, recebendo os deltas disponíveis e consumidos recém-atualizados. Ele pode consumir qualquer entrada disponível restante ou usar o contexto do que acabou de ser consumido.
7. Overscroll:esta última fase analisa os deltas finais disponíveis e consumidos. Qualquer entrada disponível restante que chegue a essa etapa geralmente é usada para gerar efeitos de borda, como um alongamento ou brilho, indicando que o usuário atingiu o limite da área rolável.

Delta de entrada de transformação

O delta de entrada do ponteiro requer ajustes de sinal em todas as fases de rolagem para corresponder aos contratos esperados. Antes que o delta alcance a fase Scroll, os modificadores de rolagem ajustam o delta de entrada com base na orientação, na direção do layout e nos contextos RTL. Isso acontece porque a entrada bruta rastreia o movimento físico do pixel do ponteiro na tela. Por exemplo, mover para baixo aumenta a coordenada Y da tela, resultando em um delta positivo. No entanto, para conseguir uma "rolagem natural", em que o conteúdo se move com o dedo, arrastar para baixo significa que a janela de visualização precisa subir sobre o conteúdo, o que corresponde a um deslocamento de rolagem negativo.

Deltas de entrada de outras fontes, como uma roda de mouse ou um touchpad, não são transformados durante as fases de rolagem.

Exemplo: o ponteiro se move para a direita usando Modifier.horizontalScroll()

Para entender como os deltas são consumidos e transformados, consulte a Figura 2, que mapeia um gesto em que o ponteiro se move para a direita.

• Pré-rolagem:o gesto começa com um delta de entrada bruta positivo de 100.
  • O overscroll observa isso e consome 10, deixando 90.
  • A pré-rolagem aninhada dá ao componente pai a oportunidade de reagir, consumindo 30. O delta bruto restante é 60.
• Transformação A: antes de entrar na fase de rolagem, horizontalScroll inverte o delta bruto positivo restante (60) em um delta negativo (-60). Isso garante que a janela de visualização seja movida para a esquerda para que o conteúdo pareça se mover para a direita com o dedo do usuário.
• Rolagem:o componente rolável de destino consome uma parte desse delta transformado para atualizar o deslocamento de rolagem. Neste exemplo, ele consome -30, deixando -30 não consumido.
• Transformação B:o delta de rolagem não consumido (-30) é convertido de volta em um delta bruto positivo (30) para corresponder ao contrato de rolagem aninhada e rolagem esticada.
• Pós-rolagem:o delta bruto restante é transmitido de volta pelo pipeline.
  • O Nested scroll post-scroll consome 10, deixando 20.
  • O efeito de rolagem esticada usa os 20 finais para gerar efeitos visuais de borda, como um alongamento ou brilho, resolvendo totalmente o delta de entrada para 0.

Referência de transformação delta de entrada de ponteiro

A tabela a seguir descreve como os deltas de entrada são assinados em diferentes fases e direções para entrada de ponteiro.

	Delta de entrada bruta	Efeito de rolagem	Rolagem aninhada	scrollableArea com orientação horizontal	scrollableArea com orientação horizontal (invertida)	scrollableArea com orientação vertical	scrollableArea com orientação vertical (invertida)
O ponteiro se move para CIMA	Negativa	Negativa	Negativa	N/A	N/A	Positivo	Negativa
O ponteiro se move para BAIXO	Positivo	Positivo	Positivo	N/A	N/A	Negativa	Positivo
O ponteiro se move para a ESQUERDA	Negativa	Negativa	Negativa	Positivo (negativo para RTL)	Negativo (positivo para RTL)	N/A	N/A
O ponteiro se move para a DIREITA	Positivo	Positivo	Positivo	Negativa (positiva para RTL)	Positivo (negativo para RTL)	N/A	N/A