HarmonyOS 鸿蒙Next中HDSTabs手势冲突

HarmonyOS 鸿蒙Next中HDSTabs手势冲突 HDSTabs和应用功能的左右手势相冲突，怎么禁止左右滑动？

10 回复

scrollable

scrollable(value: boolean)

设置是否可以通过滑动页面进行页面切换。

模型约束： 此接口仅可在Stage模型下使用。

系统能力： SystemCapability.UIDesign.HDSComponent.Core

设备行为差异： 该接口在TV无效果，在其他设备类型中可正常调用。

起始版本： 6.0.0(20)

参数：

参数名 类型 必填 说明
value boolean 是 是否可以通过滑动页面进行页面切换。
true：可以通过滑动页面来切换页面。
false：不可通过滑动页面来切换页面。
默认值：true。

更多关于HarmonyOS 鸿蒙Next中HDSTabs手势冲突的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


背景知识：

给 HdsTabs 加上 .scrollable(false)，就能彻底禁用左右滑动切换，只保留点击页签切换，解决手势冲突

问题解决：

示例代码：

private tabsController: HdsTabsController = new HdsTabsController();

HdsTabs({ controller: this.tabController }) {
  // 你的各个 Tab 页面
  TabContent() { Text('页面1') }
  TabContent() { Text('页面2') }
}
.scrollable(false) // 关键：禁止左右滑动
// 其他样式保持不变
.barPosition(BarPosition.End)
.vertical(false)

学习了

期待HarmonyOS能在未来推出更多针对企业用户的解决方案。

请提供需要转换的HTML内容。

可以通过Scrollable的“false”属性来禁用沉浸光感的手势操作（左右手势操作），

可以通过设置scrollable属性为false禁止左右滑动切换。

scrollable(value: boolean)

设置是否可以通过滑动页面进行页面切换。

参数：

参数名 类型 必填 说明
value boolean 是 是否可以通过滑动页面进行页面切换。true：可以通过滑动页面来切换页面。false：不可通过滑动页面来切换页面。默认值：true。

可考虑使用 scrollable 禁用 HDSTabs 的滑动切换

在HarmonyOS Next中，HDSTabs手势冲突通常源于滑动方向未锁定。可设置tabBarGestureEnabled(false)禁止TabBar响应手势，或通过onGestureJudgeBegin回调拦截并指定事件归属。若嵌套可滑动容器，建议为TabContent设置edgeEffect或调整scrollable轴方向，以明确手势优先级。

在HarmonyOS Next中，HDSTabs组件默认支持左右滑动手势切换标签页，若与外部手势冲突，可通过设置 swipeEnabled 属性为 false 来禁止滑动切换：

HDSTabs({ ... }) {
  // 标签内容
}
.swipeEnabled(false)

若未暴露该属性，可改用 scrollable 属性：

.scrollable(false)

这样就能禁止左右滑动手势，仅保留点击切换。

回到顶部