createNavigationController

Creates the low-level grid navigation controller

Available since @roku-sdk/flex-grid 3.3.0

import { createNavigationController } from "@roku-sdk/flex-grid";

createNavigationController(cfg: NavigationConfig): NavigationController

Deprecated.

Use the grid handle and public focus strategies instead. Will be removed from the public exports in the next major version.

Description

Creates the low-level grid navigation controller.

Parameters

Name	Type	Description
`cfg`	NavigationConfig

Return values

Returns NavigationController.

Types

NavigationConfig

Deprecated.

Use the grid handle and public focus strategies instead. Will be removed from the public exports in the next major version.

Configuration consumed by the low-level navigation controller.

Name	Type	Description
`calcScrollTargetX`	`(targetCol: number, baselineSx: number) => number`
`calcScrollTargetY`	`(targetRow: number) => number`
`col`	`Accessor<number>`
`doesRowContentFit`	`(row: number) => boolean`
`findNearestColForRow`	`(destRow: number, sourceFocusX: number) => number`
`focusX`	`Accessor<number>`
`getAliveRowSlot`	`(r: number) => unknown`
`getFirstFloatingCol?`	`(row: number) => number`
`getNumVisibleCols?`	`(row: number) => number`	Returns the number of fully visible columns in the current viewport for the given row. Used by fastforward/rewind paging to compute the page size (floor of fully visible columns). When omitted, fastforward/rewind keys are not handled.
`getRowItemCount`	`(row: number) => number`
`getRowNumCols?`	`(row: number) => number`	Returns the logical column count for a given row (falls back to numCols()).
`getRowY`	`(r: number) => number`
`getTweenDuration?`	`() => number`	Current tween duration (seconds) for scroll/focus highlights.
`holdDelayMs`	`number`
`isFixedFocus`	`boolean`
`isWrap`	`boolean`
`keypressEnd?`	`() => void`
`keypressStart?`	`(key: string) => void`
`msPerStep`	`number`
`noWrapOnLeft`	`boolean`
`numCols`	`() => number`
`numRows`	`() => number`
`onHorizontalNav?`	`() => void`	Called when left/right navigation moves focus to a different column.
`onHorizontalSmoothScrollStart?`	`() => void`	Called when held horizontal smooth scroll starts.
`onVerticalNav?`	`() => void`	Called when up/down navigation moves focus to a different row.
`onVerticalScrollEnd?`	`() => void`	Called when vertical scroll session ends (key release without smooth scroll, or after settle).
`onVerticalSmoothScrollStart?`	`() => void`	Called when held vertical smooth scroll starts.
`requestLayout?`	`() => void`	Request a layout pass when the target row is not yet alive in the window.
`row`	`Accessor<number>`
`rowColMap`	`Map<number, number>`
`rowFloatScrollXMap`	`Map<number, number>`
`scrollX`	`Accessor<number>`
`scrollY`	`Accessor<number>`
`setCol`	`(c: number) => void`
`setFocusedRowY`	`(y: number) => void`
`setFocusedSlotRef`	`(ref: unknown) => void`
`setFocusSettling?`	`(v: boolean) => void`	Holds the focus-highlight easing steady while it glides to the focused item after a held smooth scroll is released. Set true synchronously at settle start.
`setForceSnapRows?`	`(v: boolean) => void`	Snap all row-slot Y positions on the next layout pass (used after jumpTo).
`setRow`	`(r: number, options: { clearPrev: boolean }) => void`
`setScrollOverrideX`	`(v: { durationSec: number; ease: string; to: number } \| null) => void`
`setScrollOverrideY`	`(v: { durationSec: number; ease: string; to: number } \| null) => void`
`setScrollStopX`	`(v: number[]) => void`
`setScrollStopY`	`(v: number[]) => void`
`setSmoothScrolling`	`(v: boolean) => void`	Called immediately when smooth scroll starts/stops (before any setTimeout).
`settleStopCount?`	`number`	Number of stop candidates to send to the tween on settle (default 3).
`setTweenDuration?`	`(sec: number) => void`	Temporarily override tween duration (e.g. snap jump sets 0).
`smoothScroll`	`boolean`
`usesDirectScrollXForRow?`	`(row: number) => boolean`	When true, horizontal scroll for the row comes from calcScrollTargetX, not rowFloatScrollXMap baseline.

NavigationController

Deprecated.

Use the grid handle and public focus strategies instead. Will be removed from the public exports in the next major version.

Low-level navigation controls used by the grid implementation.

Name	Type	Description
`pendingSettleX`	`(index: number, stopPos: number) => void \| null`
`pendingSettleY`	`(index: number, stopPos: number) => void \| null`
`smoothScroll`	`boolean`
`cancelSmoothScrollX`	`() => void`
`cancelSmoothScrollY`	`() => void`
`handleKeyEvent`	`(key: RemoteKeyName, press: boolean) => boolean`
`isHoldTimerYActive`	`() => boolean`
`isSmoothScrollingX`	`() => boolean`
`isSmoothScrollingY`	`() => boolean`
`jumpTo`	`(row: number, col: number, animate: boolean) => void`
`resetHoldState`	`() => void`
`settleFromSmoothScrollX`	`() => void`
`settleFromSmoothScrollY`	`() => void`
`updateAnimStartTimeX`	`(startTime: [number, number]) => void`
`updateAnimStartTimeY`	`(startTime: [number, number]) => void`

Updated about 4 hours ago

What’s Next

createPerfPlugin

Did this page help you?