Skip to content
This repository was archived by the owner on May 20, 2026. It is now read-only.
This repository was archived by the owner on May 20, 2026. It is now read-only.

Feedback on VirtualGrid #83

Description

@Dando-Real-ITA

Testing the VirtualGrid, I have problems with focus and navigation

The grid has 1 row fully visible and another only partially, it is configured as follows:

      <VirtualGrid
        style={styles.SelectionGrid}
        rows={1}
        columns={4}
        buffer={2}
        each={_state.items}
        forwardFocus={0}
      >
        {(getItem, getIndex) => {
          return (
            <Card item={getItem()}/>
          )
        }}
      </VirtualGrid>
  SelectionGrid: {
    x: theme.layout.marginX + theme.layout.gutterX,
    zIndex: 2,
    scroll: 'always',
    gap: 35,
    height: 1080-550-10-50,
  },

When navigating, I can see in the logs with a callback on onSelectedChanged the correct item is selected, however the scroll does not follow the active element. For example, navigating to the second row, it looks like it wants to scroll up ( like an animation is starting ), but then it stops and it stays in the same position. If I navigate down the amount of rows = visible + buffer size, ( like 3 rows down in this case ) then the grid scrolls 1 up, however the active element is well out of screen

Also sometimes the vertical nav jumps the index, for example with 4 columns, instead of going 0 -> 4, it goes 0 -> 6. Left/Right nav seems more consistent, following also the wrap correctly.

Image

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions