How to detect whether a row is visible in .NET MAUI DataGrid?
Overview
This article explains how to reliably detect whether a specific row in .NET MAU DataGrid is currently visible in the viewport and how to conditionally scroll to it. This avoids unnecessary programmatic scrolling that can trigger visual rendering glitches on different device sizes.
Problem
When moving selection programmatically (for example after the user completes an Entry in a row) you may want to scroll the grid, so the newly selected row is visible. Some apps used a fixed “visible rows” threshold to decide when to scroll; this fails across device sizes and can cause a rendering bug where rows shift incorrectly if the grid is scrolled when the row is already visible.
Recommended Approach
Use the grid’s VisualContainer and its ScrollRows.GetVisibleLines() API to determine which row indices are currently visible. Scroll only when the target row index is not present in the visible lines collection.
Key idea
- Query orderEntryDataGrid.GetVisualContainer().ScrollRows.GetVisibleLines() (see VisualContainer and GetVisibleLines)
- Each returned item has a LineIndex that represents the visible row index
- If the target SelectedIndex exists among those LineIndex values, skip scrolling
Steps to Implement
Step 1: Move selection to the next row
In your existing Entry_Completed handler, increment the grid’s SelectedIndex to move selection.
Step 2: Check visibility using GetVisibleLines() and conditionally scroll
Use the following pattern (C#):
private async void Entry_Completed(object sender, EventArgs e)
{
// Move to next row
orderEntryDataGrid.SelectedIndex++;
// Ensure the visual container is available
var visualContainer = orderEntryDataGrid.GetVisualContainer();
if (visualContainer == null)
return; // grid not ready yet
// Get visible lines (rows)
var visibleLines = visualContainer.ScrollRows.GetVisibleLines();
bool isRowVisible = visibleLines.Any(line => line.LineIndex == orderEntryDataGrid.SelectedIndex);
if (!isRowVisible)
{
// Scroll only when necessary
await orderEntryDataGrid.ScrollToRowIndex(
orderEntryDataGrid.SelectedIndex,
ScrollToPosition.MakeVisible,
false // disable animation if you previously saw rendering glitches
);
}
}
Notes:
- Call GetVisualContainer() only after the grid is rendered (e.g., in OnAppearing or after rows are loaded). If you call too early, it may return null.
- If you still observe visual issues on some devices, try adding a very small delay before scrolling:
Dispatcher.Dispatch(async () =>
{
await Task.Delay(30);
await orderEntryDataGrid.ScrollToRowIndex(...);
});
Key Benefits of This Approach
- Accurate detection of row visibility across devices and orientations
- Avoids unnecessary scrolling and the rendering glitch caused by scrolling when already visible
- Works with the grid’s layout system rather than hard-coded row counts
Output
When implemented, the grid will only scroll when the next row is actually outside the viewport. Users will see the selected row brought into view only when needed, and the rendering shift issue should be avoided.
Download Sample
Download the complete sample from GitHub.
Conclusion
Use GetVisualContainer().ScrollRows.GetVisibleLines() to reliably detect visible rows and only call ScrollToRowIndex when necessary. This avoids device-dependent hardcoded thresholds and prevents the rendering issue caused by unnecessary scrolling.
You can refer to our .NET MAUI DataGrid’s feature tour page to learn about its other groundbreaking feature representations. You can also explore our .NET MAUI DataGrid Documentation to understand how to present and manipulate data.
For current customers, you can check out our .NET MAUI components on the License and Downloads page. If you are new to Syncfusion, you can try our 30-day free trial to explore our .NET MAUI DataGrid and other .NET MAUI components.
If you have any queries or require clarifications, please let us know in the comments below. You can also contact us through our support forums, Direct-Trac or feedback portal, or the feedback portal. We are always happy to assist you!