Skip to content

Commit

Permalink
feat(ios): nested scroll api support (#4149)
Browse files Browse the repository at this point in the history
* feat(ios): nested scroll api support

* feat(ios): nested scroll api support part2

* feat(ios): nested scroll api support part3

* feat(ios): nested scroll api support, add test

* docs(js): add nested scroll api's docs
  • Loading branch information
wwwcg authored Dec 11, 2024
1 parent 2b0561e commit 0557e87
Show file tree
Hide file tree
Showing 17 changed files with 903 additions and 19 deletions.
36 changes: 36 additions & 0 deletions docs/api/hippy-react/components.md
Original file line number Diff line number Diff line change
Expand Up @@ -130,6 +130,24 @@ import icon from './qb_icon_new.png';
| editable | 是否可编辑,开启侧滑删除时需要设置为 `true``最低支持版本2.9.0` | `boolean` | `iOS` |
| delText | 侧滑删除文本。`最低支持版本2.9.0` | `string` | `iOS` |
| onDelete | 在列表项侧滑删除时调起。`最低支持版本2.9.0` | `(nativeEvent: { index: number}) => void` | `iOS` |
| nestedScrollPriority* | 嵌套滚动事件处理优先级,`default:self`。相当于同时设置 `nestedScrollLeftPriority``nestedScrollTopPriority``nestedScrollRightPriority``nestedScrollBottomPriority``Android最低支持版本 2.16.0,iOS最低支持版本3.3.3` | `enum(self,parent,none)` | `Android、iOS` |
| nestedScrollLeftPriority | 嵌套时**从右往左**滚动事件的处理优先级,会覆盖 `nestedScrollPriority` 对应方向的值。`最低支持版本 2.16.0,iOS最低支持版本3.3.3` | `enum(self,parent,none)` | `Android、iOS` |
| nestedScrollTopPriority | 嵌套时**从下往上**滚动事件的处理优先级,会覆盖 `nestedScrollPriority` 对应方向的值。`最低支持版本 2.16.0,iOS最低支持版本3.3.3` | `enum(self,parent,none)` | `Android、iOS` |
| nestedScrollRightPriority | 嵌套时**从左往右**滚动事件的处理优先级,会覆盖 `nestedScrollPriority` 对应方向的值。`最低支持版本 2.16.0,iOS最低支持版本3.3.3` | `enum(self,parent,none)` | `Android、iOS` |
| nestedScrollBottomPriority | 嵌套时**从上往下**滚动事件的处理优先级,会覆盖 `nestedScrollPriority` 对应方向的值。`最低支持版本 2.16.0,iOS最低支持版本3.3.3` | `enum(self,parent,none)` | `Android、iOS` |

* nestedScrollPriority 的参数含义:

* `self`:当前组件优先,滚动事件将先由当前组件消费,剩余部分传递给父组件消费;

* `parent`:父组件优先,滚动事件将先由父组件消费,剩余部分再由当前组件消费;

* `none`:不允许嵌套滚动,滚动事件将不会传递给父组件。

* nestedScrollPriority 默认值的说明:

如未设置任何滚动优先级时,iOS平台的默认值为`none`,即与系统默认行为保持一致。当指定任意一方向的优先级后,其他方向默认值为`self`
Android平台默认值始终为`self`

## 方法

Expand Down Expand Up @@ -253,6 +271,24 @@ import icon from './qb_icon_new.png';
| showScrollIndicator | 是否显示滚动条。 `default: false` | `boolean` | `Android、hippy-react-web、Voltron` |
| showsHorizontalScrollIndicator | 当此值设为 `false` 的时候,`ScrollView` 会隐藏水平的滚动条。`default: true` | `boolean` | `iOS、Voltron` |
| showsVerticalScrollIndicator | 当此值设为 `false` 的时候,`ScrollView` 会隐藏垂直的滚动条。 `default: true` | `boolean` | `iOS、Voltron` |
| nestedScrollPriority* | 嵌套滚动事件处理优先级,`default:self`。相当于同时设置 `nestedScrollLeftPriority``nestedScrollTopPriority``nestedScrollRightPriority``nestedScrollBottomPriority``Android最低支持版本 2.16.0,iOS最低支持版本3.3.3` | `enum(self,parent,none)` | `Android、iOS` |
| nestedScrollLeftPriority | 嵌套时**从右往左**滚动事件的处理优先级,会覆盖 `nestedScrollPriority` 对应方向的值。`最低支持版本 2.16.0,iOS最低支持版本3.3.3` | `enum(self,parent,none)` | `Android、iOS` |
| nestedScrollTopPriority | 嵌套时**从下往上**滚动事件的处理优先级,会覆盖 `nestedScrollPriority` 对应方向的值。`最低支持版本 2.16.0,iOS最低支持版本3.3.3` | `enum(self,parent,none)` | `Android、iOS` |
| nestedScrollRightPriority | 嵌套时**从左往右**滚动事件的处理优先级,会覆盖 `nestedScrollPriority` 对应方向的值。`最低支持版本 2.16.0,iOS最低支持版本3.3.3` | `enum(self,parent,none)` | `Android、iOS` |
| nestedScrollBottomPriority | 嵌套时**从上往下**滚动事件的处理优先级,会覆盖 `nestedScrollPriority` 对应方向的值。`最低支持版本 2.16.0,iOS最低支持版本3.3.3` | `enum(self,parent,none)` | `Android、iOS` |

* nestedScrollPriority 的参数含义:

* `self`(默认值):当前组件优先,滚动事件将先由当前组件消费,剩余部分传递给父组件消费;

* `parent`:父组件优先,滚动事件将先由父组件消费,剩余部分再由当前组件消费;

* `none`:不允许嵌套滚动,滚动事件将不会传递给父组件。

* nestedScrollPriority 默认值的说明:

如未设置任何滚动优先级时,iOS平台的默认值为`none`,即与系统默认行为保持一致。当指定任意一方向的优先级后,其他方向默认值为`self`
Android平台默认值始终为`self`

## 方法

Expand Down
36 changes: 36 additions & 0 deletions docs/api/hippy-vue/components.md
Original file line number Diff line number Diff line change
Expand Up @@ -68,6 +68,24 @@
| showsVerticalScrollIndicator | 当此值设为 `false` 的时候,`ScrollView` 会隐藏垂直的滚动条。 `default: true` `(仅在 overflow-y/x: scroll 时适用)`| `boolean` | `iOS、Voltron` |
| nativeBackgroundAndroid | 配置水波纹效果,`最低支持版本 2.13.1`;配置项为 `{ borderless: boolean, color: Color, rippleRadius: number }``borderless` 表示波纹是否有边界,默认false;`color` 波纹颜色;`rippleRadius` 波纹半径,若不设置,默认容器边框为边界; `注意:设置水波纹后默认不显示,需要在对应触摸事件中调用 setPressed 和 setHotspot 方法进行水波纹展示,详情参考相关`[demo](//github.com/Tencent/Hippy/tree/master/examples/hippy-vue-demo/src/components/demos/demo-div.vue) | `Object`| `Android` |
| pointerEvents | 用于控制视图是否可以成为触摸事件的目标。 | `enum('box-none', 'none', 'box-only', 'auto')` | `iOS` |
| nestedScrollPriority* | 嵌套滚动事件处理优先级,`default:self`。相当于同时设置 `nestedScrollLeftPriority``nestedScrollTopPriority``nestedScrollRightPriority``nestedScrollBottomPriority``Android最低支持版本 2.16.0,iOS最低支持版本3.3.3` | `enum(self,parent,none)` | `Android、iOS` |
| nestedScrollLeftPriority | 嵌套时**从右往左**滚动事件的处理优先级,会覆盖 `nestedScrollPriority` 对应方向的值。`最低支持版本 2.16.0,iOS最低支持版本3.3.3` | `enum(self,parent,none)` | `Android、iOS` |
| nestedScrollTopPriority | 嵌套时**从下往上**滚动事件的处理优先级,会覆盖 `nestedScrollPriority` 对应方向的值。`最低支持版本 2.16.0,iOS最低支持版本3.3.3` | `enum(self,parent,none)` | `Android、iOS` |
| nestedScrollRightPriority | 嵌套时**从左往右**滚动事件的处理优先级,会覆盖 `nestedScrollPriority` 对应方向的值。`最低支持版本 2.16.0,iOS最低支持版本3.3.3` | `enum(self,parent,none)` | `Android、iOS` |
| nestedScrollBottomPriority | 嵌套时**从上往下**滚动事件的处理优先级,会覆盖 `nestedScrollPriority` 对应方向的值。`最低支持版本 2.16.0,iOS最低支持版本3.3.3` | `enum(self,parent,none)` | `Android、iOS` |

* nestedScrollPriority 的参数含义:

* `self`(默认值):当前组件优先,滚动事件将先由当前组件消费,剩余部分传递给父组件消费;

* `parent`:父组件优先,滚动事件将先由父组件消费,剩余部分再由当前组件消费;

* `none`:不允许嵌套滚动,滚动事件将不会传递给父组件。

* nestedScrollPriority 默认值的说明:

如未设置任何滚动优先级时,iOS平台的默认值为`none`,即与系统默认行为保持一致。当指定任意一方向的优先级后,其他方向默认值为`self`
Android平台默认值始终为`self`

* pointerEvents 的参数含义:
* `auto`(默认值) - 视图可以是触摸事件的目标;
Expand Down Expand Up @@ -379,6 +397,24 @@ Hippy 的重点功能,高性能的可复用列表组件,在终端侧会被
| endReached | 当所有的数据都已经渲染过,并且列表被滚动到最后一条时,将触发 `endReached` 回调。 | `Function` | `Android、iOS、Web-Renderer、Voltron` |
| editable | 是否可编辑,开启侧滑删除时需要设置为 `true`。`最低支持版本2.9.0` | `boolean` | `iOS` |
| delText | 侧滑删除文本。`最低支持版本2.9.0` | `string` | `iOS` |
| nestedScrollPriority* | 嵌套滚动事件处理优先级,`default:self`。相当于同时设置 `nestedScrollLeftPriority`、 `nestedScrollTopPriority`、 `nestedScrollRightPriority`、 `nestedScrollBottomPriority`。 `Android最低支持版本 2.16.0,iOS最低支持版本3.3.3` | `enum(self,parent,none)` | `Android、iOS` |
| nestedScrollLeftPriority | 嵌套时**从右往左**滚动事件的处理优先级,会覆盖 `nestedScrollPriority` 对应方向的值。`最低支持版本 2.16.0,iOS最低支持版本3.3.3` | `enum(self,parent,none)` | `Android、iOS` |
| nestedScrollTopPriority | 嵌套时**从下往上**滚动事件的处理优先级,会覆盖 `nestedScrollPriority` 对应方向的值。`最低支持版本 2.16.0,iOS最低支持版本3.3.3` | `enum(self,parent,none)` | `Android、iOS` |
| nestedScrollRightPriority | 嵌套时**从左往右**滚动事件的处理优先级,会覆盖 `nestedScrollPriority` 对应方向的值。`最低支持版本 2.16.0,iOS最低支持版本3.3.3` | `enum(self,parent,none)` | `Android、iOS` |
| nestedScrollBottomPriority | 嵌套时**从上往下**滚动事件的处理优先级,会覆盖 `nestedScrollPriority` 对应方向的值。`最低支持版本 2.16.0,iOS最低支持版本3.3.3` | `enum(self,parent,none)` | `Android、iOS` |

* nestedScrollPriority 的参数含义:

* `self`(默认值):当前组件优先,滚动事件将先由当前组件消费,剩余部分传递给父组件消费;

* `parent`:父组件优先,滚动事件将先由父组件消费,剩余部分再由当前组件消费;

* `none`:不允许嵌套滚动,滚动事件将不会传递给父组件。

* nestedScrollPriority 默认值的说明:

如未设置任何滚动优先级时,iOS平台的默认值为`none`,即与系统默认行为保持一致。当指定任意一方向的优先级后,其他方向默认值为`self`;
Android平台默认值始终为`self`。

## 事件

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -46,6 +46,12 @@ @implementation HippyNextBaseListViewManager
HIPPY_EXPORT_VIEW_PROPERTY(showScrollIndicator, BOOL)
HIPPY_EXPORT_VIEW_PROPERTY(scrollEnabled, BOOL)
HIPPY_EXPORT_VIEW_PROPERTY(horizontal, BOOL)
HIPPY_EXPORT_VIEW_PROPERTY(nestedScrollPriority, HippyNestedScrollPriority)
HIPPY_EXPORT_VIEW_PROPERTY(nestedScrollTopPriority, HippyNestedScrollPriority)
HIPPY_EXPORT_VIEW_PROPERTY(nestedScrollLeftPriority, HippyNestedScrollPriority)
HIPPY_EXPORT_VIEW_PROPERTY(nestedScrollBottomPriority, HippyNestedScrollPriority)
HIPPY_EXPORT_VIEW_PROPERTY(nestedScrollRightPriority, HippyNestedScrollPriority)


- (UIView *)view {
return [[HippyNextBaseListView alloc] init];
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -21,6 +21,7 @@
*/

#import <UIKit/UIKit.h>
#import "HippyNestedScrollProtocol.h"

NS_ASSUME_NONNULL_BEGIN

Expand All @@ -35,8 +36,11 @@ NS_ASSUME_NONNULL_BEGIN

@end

@interface HippyNextListTableView : UICollectionView

/// Custom tableView (collectionView) of Hippy
@interface HippyNextListTableView : UICollectionView <HippyNestedScrollProtocol>

/// Layout delegate
@property (nonatomic, weak) id<HippyNextListTableViewLayoutProtocol> layoutDelegate;

@end
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -24,6 +24,8 @@

@implementation HippyNextListTableView

HIPPY_NESTEDSCROLL_PROTOCOL_PROPERTY_IMP

/**
* we need scroll indicator to be at top
* indicator is UIImageView type at lower ios version
Expand All @@ -45,4 +47,14 @@ - (void)layoutSubviews {
}
}

- (BOOL)gestureRecognizer:(UIGestureRecognizer *)gestureRecognizer
shouldRecognizeSimultaneouslyWithGestureRecognizer:(UIGestureRecognizer *)otherGestureRecognizer {
if (self.nestedGestureDelegate &&
gestureRecognizer == self.panGestureRecognizer &&
[self.nestedGestureDelegate respondsToSelector:@selector(shouldRecognizeScrollGestureSimultaneouslyWithView:)]) {
return [self.nestedGestureDelegate shouldRecognizeScrollGestureSimultaneouslyWithView:otherGestureRecognizer.view];
}
return NO;
}

@end
Original file line number Diff line number Diff line change
@@ -0,0 +1,50 @@
/*!
* iOS SDK
*
* Tencent is pleased to support the open source community by making
* Hippy available.
*
* Copyright (C) 2019 THL A29 Limited, a Tencent company.
* All rights reserved.
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/

#import <Foundation/Foundation.h>
#import <UIKit/UIKit.h>
#import "HippyScrollView.h"

NS_ASSUME_NONNULL_BEGIN

/// A coordinator responsible for managing scroll priorities
@interface HippyNestedScrollCoordinator : NSObject <UIScrollViewDelegate, HippyNestedScrollGestureDelegate>

/// Priority of nestedScroll in all direction.
@property (nonatomic, assign) HippyNestedScrollPriority nestedScrollPriority;
/// Priority of nestedScroll in specific direction (finger move from bottom to top).
@property (nonatomic, assign) HippyNestedScrollPriority nestedScrollTopPriority;
/// Priority of nestedScroll in specific direction (finger move from right to left).
@property (nonatomic, assign) HippyNestedScrollPriority nestedScrollLeftPriority;
/// Priority of nestedScroll in specific direction (finger move from top to bottom).
@property (nonatomic, assign) HippyNestedScrollPriority nestedScrollBottomPriority;
/// Priority of nestedScroll in specific direction (finger move from left to right).
@property (nonatomic, assign) HippyNestedScrollPriority nestedScrollRightPriority;

/// The inner scrollable view
@property (nonatomic, weak) UIScrollView<HippyNestedScrollProtocol> *innerScrollView;
/// The outer scrollable view
@property (nonatomic, weak) UIScrollView<HippyNestedScrollProtocol> *outerScrollView;

@end

NS_ASSUME_NONNULL_END
Loading

0 comments on commit 0557e87

Please sign in to comment.