For AI agents: the complete documentation index is available at /zh/llms.txt, the full documentation bundle is available at /zh/llms-full.txt, and this page is available as Markdown at /zh/api/elements/built-in/scroll-view-API.md.
Lynx
  • 简体中文
  • 属性

    bounces

    iOS
    Desktop
    Harmony
    1.4
    // @默认值: true
    bounces?: boolean;

    启用回弹效果

    enable-scroll

    Android
    iOS
    Desktop
    Harmony
    1.4
    // @默认值: true
    'enable-scroll'?: boolean;

    启用拖动

    initial-scroll-offset

    Android
    iOS
    Desktop
    Harmony
    2.17
    // @默认值: 0
    'initial-scroll-offset'?: number;

    初始滚动位置,仅生效一次,单位为像素

    initial-scroll-to-index

    Android
    iOS
    Harmony
    2.17
    // @默认值: 0
    'initial-scroll-to-index'?: number;

    首次加载时滚动到指定子节点,仅生效一次。所有直接子节点必须设置 flatten=false。

    lower-threshold

    Android
    iOS
    Desktop
    Harmony
    1.4
    // @默认值: 0
    'lower-threshold'?: number;

    设置触发 bindscrolltolower 事件的下阈值。

    scroll-bar-enable

    iOS
    Desktop
    Harmony
    1.4
    // @默认值: true
    'scroll-bar-enable'?: boolean;

    启用滚动条

    scroll-orientation

    Android
    iOS
    Desktop
    Harmony
    3.0
    // @默认值: 'vertical'
    'scroll-orientation'?: 'vertical' | 'horizontal';

    替代 scroll-x 和 scroll-y

    upper-threshold

    Android
    iOS
    Desktop
    Harmony
    1.4
    // @默认值: 0
    'upper-threshold'?: number;

    设置触发 bindscrolltoupper 事件的上阈值。

    事件

    前端可以绑定相应的事件回调来监听元素的运行时行为,如下所示。

    bindcontentsizechanged

    Android
    iOS
    Harmony
    1.6
    bindcontentsizechanged = (e: ContentSizeChangedEvent) => {};

    当滚动视图的内容大小发生变化时,会触发此事件。

    bindscroll

    Android
    iOS
    Desktop
    Harmony
    1.4
    bindscroll = (e: ScrollEvent) => {};

    当滚动视图正在滚动时,会触发此事件。

    bindscrollend

    Android
    iOS
    Desktop
    Harmony
    1.6
    bindscrollend = (e: ScrollEndEvent) => {};

    当滚动视图的滚动结束时,会触发此事件。

    bindscrolltolower

    Android
    iOS
    Harmony
    1.4
    bindscrolltolower = (e: ScrollToLowerEvent) => {};

    当滚动区域的下/右边缘与由 lowerThreshold 定义的可见区域相交时,会触发此事件。

    bindscrolltoupper

    Android
    iOS
    Harmony
    1.4
    bindscrolltoupper = (e: ScrollToUpperEvent) => {};

    当滚动区域的上/左边缘与由 upperThreshold 定义的可见区域相交时,会触发此事件。

    方法

    前端可以通过 SelectorQuery API 调用组件方法。

    autoScroll

    Android
    iOS
    Desktop
    Harmony
    
    lynx.createSelectorQuery()
         .select('#id')
         .invoke({
          method: 'autoScroll',
          params: {
            /**
             * 每秒滚动的距离,支持正负数。距离单位可以是 "px"、"rpx"、"ppx" 或 null(对于 iOS,该值必须大于 1/屏幕缩放比例 px)。
             * @Android
             * @iOS
             * @Harmony
             * @PC
             */
            rate: 60,
            /**
             * 开始/停止自动滚动。
             * @Android
             * @iOS
             * @Harmony
             * @PC
             */
            start: true,
          },
          success: function (res) {},
          fail: function (res) {},
        })
        .exec();
    

    自动滚动

    getScrollInfo

    Android
    iOS
    Harmony
    interface GetScrollInfoResult {
      /**
       * 沿方向的总可滚动范围,单位为 PX
       * @Android
       * @iOS
       * @Harmony
       * @PC
       */
      scrollRange: number;
      /**
       * X 轴上的内容偏移量,单位为 PX
       * @Android
       * @iOS
       * @Harmony
       * @PC
       */
      scrollX: number;
      /**
       * Y 轴上的内容偏移量,单位为 PX
       * @Android
       * @iOS
       * @Harmony
       * @PC
       */
      scrollY: number;
    }
    
    lynx.createSelectorQuery()
         .select('#id')
         .invoke({
          method: 'getScrollInfo',
          success: function (res: GetScrollInfoResult) {},
          fail: function (res) {},
        })
        .exec();
    

    获取滚动信息

    scrollBy

    Android
    iOS
    Harmony
    interface ScrollByParams {
      /**
       * 滚动的偏移量
       */
      offset?: number;
    }
    
    const params: ScrollByParams = { offset: 100 };
    
    lynx.createSelectorQuery()
         .select('#id')
         .invoke({
          method: 'scrollBy',
          params,
          success: function (res) {},
          fail: function (res) {},
        })
        .exec();
    

    按指定偏移量滚动

    scrollTo

    Android
    iOS
    Desktop
    Harmony
    interface ScrollToParams {
      /**
       * 目标项索引
       * @defaultValue 0
       */
      index?: number;
      /**
       * 相对于目标节点的偏移量
       */
      offset?: number;
      /**
       * 启用滚动动画
       */
      smooth?: boolean;
    }
    
    const params: ScrollToParams = { index: 0, offset: 0, smooth: true };
    
    lynx.createSelectorQuery()
         .select('#id')
         .invoke({
          method: 'scrollTo',
          params,
          success: function (res) {},
          fail: function (res) {},
        })
        .exec();
    

    滚动到指定位置

    除非另有说明,本项目采用知识共享署名 4.0 国际许可协议进行许可,代码示例采用 Apache License 2.0 许可协议进行许可。