Skip to content

Commit 1a547fa

Browse files
committed
Fix debug overlay for native inversion
1 parent c192c8f commit 1a547fa

File tree

4 files changed

+7
-10
lines changed

4 files changed

+7
-10
lines changed

packages/@react-native-windows/virtualized-list/src/VirtualizedList.js

Lines changed: 3 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1480,17 +1480,13 @@ class VirtualizedList extends React.PureComponent<Props, State> {
14801480
};
14811481

14821482
_renderDebugOverlay() {
1483-
// Windows-only: this is not implemented for inverted lists
1484-
if (this.props.inverted) {
1485-
console.warn('Debug overlay is not yet supported for inverted lists.');
1486-
}
14871483
const normalize =
14881484
this._scrollMetrics.visibleLength /
14891485
(this._scrollMetrics.contentLength || 1);
14901486
const framesInLayout = [];
14911487
const itemCount = this.props.getItemCount(this.props.data);
14921488
for (let ii = 0; ii < itemCount; ii++) {
1493-
const frame = this.__getFrameMetricsApprox(ii);
1489+
const frame = this.__getFrameMetricsApprox(ii, true);
14941490
/* $FlowFixMe[prop-missing] (>=0.68.0 site=react_native_fb) This comment
14951491
* suppresses an error found when Flow v0.68 was deployed. To see the
14961492
* error delete this comment and run Flow. */
@@ -1524,7 +1520,8 @@ class VirtualizedList extends React.PureComponent<Props, State> {
15241520
styles.debugOverlayBase,
15251521
styles.debugOverlayFrameLast,
15261522
{
1527-
top: windowTop * normalize,
1523+
// Windows-only: Invert the position of the render window offset
1524+
top: (this.props.inverted ? this._scrollMetrics.contentLength - windowLen - windowTop : windowTop) * normalize,
15281525
height: windowLen * normalize,
15291526
},
15301527
]}

vnext/Microsoft.ReactNative/Views/Impl/ScrollViewViewChanger.cpp

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -47,7 +47,7 @@ void ScrollViewViewChanger::OnViewChanging(
4747
const auto scrollingToEnd =
4848
IsScrollingToEnd(scrollViewer, args.NextView().HorizontalOffset(), args.NextView().VerticalOffset());
4949
UpdateScrollAnchoringEnabled(scrollViewer, !scrollingToEnd);
50-
} else if (IsScrollingToEnd(scrollViewer, m_targetScrollToEndOffset.value(), m_targetScrollToEndOffset.value())) {
50+
} else if (!IsScrollingToEnd(scrollViewer, m_targetScrollToEndOffset.value(), m_targetScrollToEndOffset.value())) {
5151
// If we were previously in an active ScrollToEnd command, we may need to
5252
// restart the operation if the content size has changed
5353
ScrollToEnd(scrollViewer, true);
@@ -64,7 +64,7 @@ void ScrollViewViewChanger::OnViewChanged(
6464
if (m_inverted) {
6565
const auto scrolledToEnd =
6666
IsScrollingToEnd(scrollViewer, scrollViewer.HorizontalOffset(), scrollViewer.VerticalOffset());
67-
UpdateScrollAnchoringEnabled(!scrolledToEnd);
67+
UpdateScrollAnchoringEnabled(scrollViewer, !scrolledToEnd);
6868
}
6969
}
7070
}

vnext/Microsoft.ReactNative/Views/Impl/ScrollViewViewChanger.h

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,7 @@ class ScrollViewViewChanger {
2929
return m_targetScrollToEndOffset.has_value();
3030
}
3131

32-
static void UpdateScrollAnchoringEnabled(const xaml::Controls::ScrollViewer &scrollViewer, bool enabled);
32+
void UpdateScrollAnchoringEnabled(const xaml::Controls::ScrollViewer &scrollViewer, bool enabled);
3333
bool
3434
IsScrollingToEnd(const xaml::Controls::ScrollViewer &scrollViewer, double horizontalOffset, double verticalOffset);
3535
};

vnext/src/Libraries/Components/View/ViewWindowsProps.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -81,5 +81,5 @@ export interface IViewWindowsProps extends IKeyboardProps, ViewProps {
8181
/**
8282
* Indicates that view must not be used as scroll anchor candidate.
8383
*/
84-
overflowAnchor?: "none" | "auto";
84+
overflowAnchor?: 'none' | 'auto';
8585
}

0 commit comments

Comments
 (0)