Skip to content

Commit 8ce9545

Browse files
chiuamchiuam
authored
Revert Flatlist changes (#1306)
1 parent aebbcf1 commit 8ce9545

File tree

7 files changed

+111
-199
lines changed

7 files changed

+111
-199
lines changed

‎Libraries/Components/ScrollView/ScrollView.js

Lines changed: 36 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1201,10 +1201,42 @@ class ScrollView extends React.Component<Props, State> {
12011201
nativeEvent.contentOffset.y +
12021202
nativeEvent.layoutMeasurement.height,
12031203
});
1204-
} else if (key === 'HOME') {
1205-
this.scrollTo({x: 0, y: 0});
1206-
} else if (key === 'END') {
1207-
this.scrollToEnd({animated: true});
1204+
} else if (key === 'LEFT_ARROW') {
1205+
this._handleScrollByKeyDown(event, {
1206+
x:
1207+
nativeEvent.contentOffset.x +
1208+
-(this.props.horizontalLineScroll !== undefined
1209+
? this.props.horizontalLineScroll
1210+
: kMinScrollOffset),
1211+
y: nativeEvent.contentOffset.y,
1212+
});
1213+
} else if (key === 'RIGHT_ARROW') {
1214+
this._handleScrollByKeyDown(event, {
1215+
x:
1216+
nativeEvent.contentOffset.x +
1217+
(this.props.horizontalLineScroll !== undefined
1218+
? this.props.horizontalLineScroll
1219+
: kMinScrollOffset),
1220+
y: nativeEvent.contentOffset.y,
1221+
});
1222+
} else if (key === 'DOWN_ARROW') {
1223+
this._handleScrollByKeyDown(event, {
1224+
x: nativeEvent.contentOffset.x,
1225+
y:
1226+
nativeEvent.contentOffset.y +
1227+
(this.props.verticalLineScroll !== undefined
1228+
? this.props.verticalLineScroll
1229+
: kMinScrollOffset),
1230+
});
1231+
} else if (key === 'UP_ARROW') {
1232+
this._handleScrollByKeyDown(event, {
1233+
x: nativeEvent.contentOffset.x,
1234+
y:
1235+
nativeEvent.contentOffset.y +
1236+
-(this.props.verticalLineScroll !== undefined
1237+
? this.props.verticalLineScroll
1238+
: kMinScrollOffset),
1239+
});
12081240
}
12091241
}
12101242
}

‎Libraries/Lists/FlatList.js

Lines changed: 0 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -369,19 +369,6 @@ class FlatList<ItemT> extends React.PureComponent<Props<ItemT>, void> {
369369
}
370370
}
371371

372-
// [TODO(macOS GH#750)
373-
/**
374-
* Move selection to the specified index
375-
*
376-
* @platform macos
377-
*/
378-
selectRowAtIndex(index: number) {
379-
if (this._listRef) {
380-
this._listRef.selectRowAtIndex(index);
381-
}
382-
}
383-
// ]TODO(macOS GH#750)
384-
385372
/**
386373
* Provides a handle to the underlying scroll responder.
387374
*/

‎Libraries/Lists/VirtualizedList.js

Lines changed: 41 additions & 82 deletions
Original file line numberDiff line numberDiff line change
@@ -588,14 +588,10 @@ class VirtualizedList extends React.PureComponent<Props, State> {
588588
const newOffset = Math.min(contentLength, visTop + (frameEnd - visEnd));
589589
this.scrollToOffset({offset: newOffset});
590590
} else if (frame.offset < visTop) {
591-
const newOffset = Math.min(frame.offset, visTop - frame.length);
591+
const newOffset = Math.max(0, visTop - frame.length);
592592
this.scrollToOffset({offset: newOffset});
593593
}
594594
}
595-
596-
selectRowAtIndex(rowIndex: number) {
597-
this._selectRowAtIndex(rowIndex);
598-
}
599595
// ]TODO(macOS GH#774)
600596

601597
recordInteraction() {
@@ -886,13 +882,7 @@ class VirtualizedList extends React.PureComponent<Props, State> {
886882
index={ii}
887883
inversionStyle={inversionStyle}
888884
item={item}
889-
// [TODO(macOS GH#774)
890-
isSelected={
891-
this.props.enableSelectionOnKeyPress &&
892-
this.state.selectedRowIndex === ii
893-
? true
894-
: false
895-
} // TODO(macOS GH#774)]
885+
isSelected={this.state.selectedRowIndex === ii ? true : false} // TODO(macOS GH#774)
896886
key={key}
897887
prevCellKey={prevCellKey}
898888
onUpdateSeparators={this._onUpdateSeparators}
@@ -1333,12 +1323,10 @@ class VirtualizedList extends React.PureComponent<Props, State> {
13331323
// $FlowFixMe[prop-missing] Invalid prop usage
13341324
<ScrollView
13351325
{...props}
1336-
// [TODO(macOS GH#774)
1337-
{...(props.enableSelectionOnKeyPress && {focusable: true})}
1338-
onScrollKeyDown={keyEventHandler}
1326+
onScrollKeyDown={keyEventHandler} // TODO(macOS GH#774)
13391327
onPreferredScrollerStyleDidChange={
13401328
preferredScrollerStyleDidChangeHandler
1341-
} // TODO(macOS GH#774)]
1329+
} // TODO(macOS GH#774)
13421330
refreshControl={
13431331
props.refreshControl == null ? (
13441332
<RefreshControl
@@ -1357,11 +1345,11 @@ class VirtualizedList extends React.PureComponent<Props, State> {
13571345
// $FlowFixMe Invalid prop usage
13581346
<ScrollView
13591347
{...props}
1360-
{...(props.enableSelectionOnKeyPress && {focusable: true})} // [TODO(macOS GH#774)
1361-
onScrollKeyDown={keyEventHandler}
1348+
onScrollKeyDown={keyEventHandler} // TODO(macOS GH#774)
13621349
onPreferredScrollerStyleDidChange={
1363-
preferredScrollerStyleDidChangeHandler
1364-
} // TODO(macOS GH#774)]
1350+
// TODO(macOS GH#774)
1351+
preferredScrollerStyleDidChangeHandler // TODO(macOS GH#774)
1352+
}
13651353
/>
13661354
);
13671355
}
@@ -1519,13 +1507,6 @@ class VirtualizedList extends React.PureComponent<Props, State> {
15191507
return rowAbove;
15201508
};
15211509

1522-
_selectRowAtIndex = rowIndex => {
1523-
this.setState(state => {
1524-
return {selectedRowIndex: rowIndex};
1525-
});
1526-
return rowIndex;
1527-
};
1528-
15291510
_selectRowBelowIndex = rowIndex => {
15301511
if (this.props.getItemCount) {
15311512
const {data} = this.props;
@@ -1540,81 +1521,61 @@ class VirtualizedList extends React.PureComponent<Props, State> {
15401521
}
15411522
};
15421523

1543-
_handleKeyDown = (event: ScrollEvent) => {
1524+
_handleKeyDown = (e: ScrollEvent) => {
15441525
if (this.props.onScrollKeyDown) {
1545-
this.props.onScrollKeyDown(event);
1526+
this.props.onScrollKeyDown(e);
15461527
} else {
15471528
if (Platform.OS === 'macos') {
15481529
// $FlowFixMe Cannot get e.nativeEvent because property nativeEvent is missing in Event
1549-
const nativeEvent = event.nativeEvent;
1550-
const key = nativeEvent.key;
1530+
const event = e.nativeEvent;
1531+
const key = event.key;
15511532

15521533
let prevIndex = -1;
15531534
let newIndex = -1;
15541535
if ('selectedRowIndex' in this.state) {
15551536
prevIndex = this.state.selectedRowIndex;
15561537
}
15571538

1558-
// const {data, getItem} = this.props;
1559-
if (key === 'UP_ARROW') {
1560-
newIndex = this._selectRowAboveIndex(prevIndex);
1561-
this._handleSelectionChange(prevIndex, newIndex);
1562-
} else if (key === 'DOWN_ARROW') {
1539+
const {data, getItem} = this.props;
1540+
if (key === 'DOWN_ARROW') {
15631541
newIndex = this._selectRowBelowIndex(prevIndex);
1564-
this._handleSelectionChange(prevIndex, newIndex);
1542+
this.ensureItemAtIndexIsVisible(newIndex);
1543+
1544+
if (prevIndex !== newIndex) {
1545+
const item = getItem(data, newIndex);
1546+
if (this.props.onSelectionChanged) {
1547+
this.props.onSelectionChanged({
1548+
previousSelection: prevIndex,
1549+
newSelection: newIndex,
1550+
item: item,
1551+
});
1552+
}
1553+
}
1554+
} else if (key === 'UP_ARROW') {
1555+
newIndex = this._selectRowAboveIndex(prevIndex);
1556+
this.ensureItemAtIndexIsVisible(newIndex);
1557+
1558+
if (prevIndex !== newIndex) {
1559+
const item = getItem(data, newIndex);
1560+
if (this.props.onSelectionChanged) {
1561+
this.props.onSelectionChanged({
1562+
previousSelection: prevIndex,
1563+
newSelection: newIndex,
1564+
item: item,
1565+
});
1566+
}
1567+
}
15651568
} else if (key === 'ENTER') {
15661569
if (this.props.onSelectionEntered) {
1567-
const item = this.props.getItem(this.props.data, prevIndex);
1570+
const item = getItem(data, prevIndex);
15681571
if (this.props.onSelectionEntered) {
15691572
this.props.onSelectionEntered(item);
15701573
}
15711574
}
1572-
} else if (key === 'OPTION_UP') {
1573-
newIndex = this._selectRowAtIndex(0);
1574-
this._handleSelectionChange(prevIndex, newIndex);
1575-
} else if (key === 'OPTION_DOWN') {
1576-
newIndex = this._selectRowAtIndex(this.state.last);
1577-
this._handleSelectionChange(prevIndex, newIndex);
1578-
} else if (key === 'PAGE_UP') {
1579-
const maxY =
1580-
event.nativeEvent.contentSize.height -
1581-
event.nativeEvent.layoutMeasurement.height;
1582-
const newOffset = Math.min(
1583-
maxY,
1584-
nativeEvent.contentOffset.y + -nativeEvent.layoutMeasurement.height,
1585-
);
1586-
this.scrollToOffset({animated: true, offset: newOffset});
1587-
} else if (key === 'PAGE_DOWN') {
1588-
const maxY =
1589-
event.nativeEvent.contentSize.height -
1590-
event.nativeEvent.layoutMeasurement.height;
1591-
const newOffset = Math.min(
1592-
maxY,
1593-
nativeEvent.contentOffset.y + nativeEvent.layoutMeasurement.height,
1594-
);
1595-
this.scrollToOffset({animated: true, offset: newOffset});
1596-
} else if (key === 'HOME') {
1597-
this.scrollToOffset({animated: true, offset: 0});
1598-
} else if (key === 'END') {
1599-
this.scrollToEnd({animated: true});
16001575
}
16011576
}
16021577
}
16031578
};
1604-
1605-
_handleSelectionChange = (prevIndex, newIndex) => {
1606-
this.ensureItemAtIndexIsVisible(newIndex);
1607-
if (prevIndex !== newIndex) {
1608-
const item = this.props.getItem(this.props.data, newIndex);
1609-
if (this.props.onSelectionChanged) {
1610-
this.props.onSelectionChanged({
1611-
previousSelection: prevIndex,
1612-
newSelection: newIndex,
1613-
item: item,
1614-
});
1615-
}
1616-
}
1617-
};
16181579
// ]TODO(macOS GH#774)
16191580

16201581
_renderDebugOverlay() {
@@ -2221,7 +2182,6 @@ class CellRenderer extends React.Component<
22212182
return React.createElement(ListItemComponent, {
22222183
item,
22232184
index,
2224-
isSelected,
22252185
separators: this._separators,
22262186
});
22272187
}
@@ -2298,7 +2258,6 @@ class CellRenderer extends React.Component<
22982258
{itemSeparator}
22992259
</CellRendererComponent>
23002260
);
2301-
// TODO(macOS GH#774)]
23022261

23032262
return (
23042263
<VirtualizedListCellContextProvider cellKey={this.props.cellKey}>

‎React/Views/ScrollView/RCTScrollView.m

Lines changed: 21 additions & 36 deletions
Original file line numberDiff line numberDiff line change
@@ -1180,22 +1180,16 @@ - (void)uiManagerWillPerformMounting:(RCTUIManager *)manager
11801180

11811181
#if TARGET_OS_OSX // [TODO(macOS GH#774)
11821182

1183-
- (NSString*)keyCommandFromKeyCode:(NSInteger)keyCode modifierFlags:(NSEventModifierFlags)modifierFlags
1183+
- (NSString*)keyCommandFromKeyCode:(NSInteger)keyCode
11841184
{
11851185
switch (keyCode)
11861186
{
11871187
case 36:
11881188
return @"ENTER";
11891189

1190-
case 115:
1191-
return @"HOME";
1192-
11931190
case 116:
11941191
return @"PAGE_UP";
11951192

1196-
case 119:
1197-
return @"END";
1198-
11991193
case 121:
12001194
return @"PAGE_DOWN";
12011195

@@ -1206,44 +1200,35 @@ - (NSString*)keyCommandFromKeyCode:(NSInteger)keyCode modifierFlags:(NSEventModi
12061200
return @"RIGHT_ARROW";
12071201

12081202
case 125:
1209-
if (modifierFlags & NSEventModifierFlagOption) {
1210-
return @"OPTION_DOWN";
1211-
} else {
1212-
return @"DOWN_ARROW";
1213-
}
1203+
return @"DOWN_ARROW";
12141204

12151205
case 126:
1216-
if (modifierFlags & NSEventModifierFlagOption) {
1217-
return @"OPTION_UP";
1218-
} else {
1219-
return @"UP_ARROW";
1220-
}
1206+
return @"UP_ARROW";
12211207
}
12221208
return @"";
12231209
}
12241210

12251211
- (void)keyDown:(UIEvent*)theEvent
12261212
{
12271213
// Don't emit a scroll event if tab was pressed while the scrollview is first responder
1228-
if (!(self == [[self window] firstResponder] && theEvent.keyCode == 48)) {
1229-
NSString *keyCommand = [self keyCommandFromKeyCode:theEvent.keyCode modifierFlags:theEvent.modifierFlags];
1230-
if (![keyCommand isEqual: @""]) {
1231-
RCT_SEND_SCROLL_EVENT(onScrollKeyDown, (@{ @"key": keyCommand}));
1232-
} else {
1233-
[super keyDown:theEvent];
1234-
}
1235-
}
1236-
1237-
// AX: if a tab key was pressed and the first responder is currently clipped by the scroll view,
1238-
// automatically scroll to make the view visible to make it navigable via keyboard.
1239-
if ([theEvent keyCode] == 48) { //tab key
1240-
id firstResponder = [[self window] firstResponder];
1241-
if ([firstResponder isKindOfClass:[NSView class]] &&
1242-
[firstResponder isDescendantOf:[_scrollView documentView]]) {
1243-
NSView *view = (NSView*)firstResponder;
1244-
NSRect visibleRect = ([view superview] == [_scrollView documentView]) ? NSInsetRect(view.frame, -1, -1) :
1245-
[view convertRect:view.frame toView:_scrollView.documentView];
1246-
[[_scrollView documentView] scrollRectToVisible:visibleRect];
1214+
if (self == [[self window] firstResponder] &&
1215+
theEvent.keyCode != 48) {
1216+
NSString *keyCommand = [self keyCommandFromKeyCode:theEvent.keyCode];
1217+
RCT_SEND_SCROLL_EVENT(onScrollKeyDown, (@{ @"key": keyCommand}));
1218+
} else {
1219+
[super keyDown:theEvent];
1220+
1221+
// AX: if a tab key was pressed and the first responder is currently clipped by the scroll view,
1222+
// automatically scroll to make the view visible to make it navigable via keyboard.
1223+
if ([theEvent keyCode] == 48) { //tab key
1224+
id firstResponder = [[self window] firstResponder];
1225+
if ([firstResponder isKindOfClass:[NSView class]] &&
1226+
[firstResponder isDescendantOf:[_scrollView documentView]]) {
1227+
NSView *view = (NSView*)firstResponder;
1228+
NSRect visibleRect = ([view superview] == [_scrollView documentView]) ? NSInsetRect(view.frame, -1, -1) :
1229+
[view convertRect:view.frame toView:_scrollView.documentView];
1230+
[[_scrollView documentView] scrollRectToVisible:visibleRect];
1231+
}
12471232
}
12481233
}
12491234
}

0 commit comments

Comments
 (0)