Skyline Scroll Api

This is your go-to for controlling scroll views programmatically in WeChat's Skyline renderer. You get three API families: ScrollViewContext for triggering pull-to-refresh and scrolling to positions from the logic thread, DraggableSheetContext for controlling half-sheet panels, and worklet.scrollViewContext for direct scroll manipulation on the UI thread during gestures. The main gotcha is that ScrollViewContext only works when you enable the enhanced attribute on scroll-view, and the worklet version requires you to grab refs through a SharedValue rather than using node(). Good for auto-triggering refresh states, programmatically opening second-level drawers, or syncing scroll position with gesture animations. Requires baseline library 2.14.4 or higher depending on which APIs you need.

skills.sh installs: 955
GitHub stars: 56
last updated: Aug 21, 2026

View on GitHub

Install

$ npx -y skills add wechat-miniprogram/skyline-skills --skill skyline-scroll-api --agent claude-code

Installs into .claude/skills of the current project.

Files

Skyline 滚动控制 API

适用场景

程序化触发 scroll-view 下拉刷新或关闭刷新
程序化触发/关闭下拉二级（"二楼"页面）
通过 ScrollViewContext 控制滚动位置和行为
控制 DraggableSheet 半屏面板滚动到指定位置
在 worklet 函数中（UI 线程）直接控制 scroll-view 滚动

核心概念

三大 API 族群

API 族群	获取方式	线程	最低基础库
ScrollViewContext	`NodesRef.node()` + `enhanced` 属性	逻辑线程	2.14.4
DraggableSheetContext	`NodesRef.node()`	逻辑线程	3.2.0
worklet.scrollViewContext	`NodesRef.ref()` + SharedValue	UI 线程	3.3.0

获取实例

// ScrollViewContext（需开启 enhanced）
wx.createSelectorQuery().select('#scrollview').node()
  .exec(res => { const ctx = res[0].node })

// DraggableSheetContext
wx.createSelectorQuery().select('.sheet').node()
  .exec(res => { const ctx = res[0].node })

// worklet.scrollViewContext（通过 ref）
this.scrollRef = wx.worklet.shared()
this.createSelectorQuery().select('.scrollable')
  .ref(res => { this.scrollRef.value = res.ref }).exec()