Utilização

Scroll a list to a particular item.

tsx
// Scroll a list to a particular item.
import { Button, List, Text, ref, type ListHandle, type ScrollToIndexOptions } from 'kuito';

function Chapters(props: { titles: string[]; current: number }) {
  const list = ref<ListHandle>();
  // Centers the current chapter, with room for the header above it.
  const toCurrent: ScrollToIndexOptions = {
    index: props.current,
    align: 0.5,
    margin: 16,
    animated: true,
  };

  return (
    <>
      <Button onPress={() => list.current?.scrollToIndex(toCurrent)}>Current chapter</Button>
      <List ref={list} data={props.titles} renderItem={({ item }) => <Text>{item}</Text>} />
    </>
  );
}

Declaração do tipo

ts
export interface ScrollToIndexOptions {
  index: number;
  animated?: boolean;
  /** Where the item lands: 0 at the start of the list, 0.5 centered, 1 at the end. */
  align?: number;
  /** Points to keep before the item, as CSS's `scroll-margin`. */
  margin?: number;
}

Membros 4

NomeTipoObrigatórioDescrição
indexnumberSim—
animatedbooleanNão—
alignnumberNãoWhere the item lands: 0 at the start of the list, 0.5 centered, 1 at the end.
marginnumberNãoPoints to keep before the item, as CSS's scroll-margin.
Gerado a partir das declarações TypeScript públicas: assinaturas, props e predefinições vêm da fonte verificada, as descrições da sua JSDoc. Nenhuma predefinição é inventada.