FramerJS

Question

在FramerJS中使用是真的吗-滑动页面内容的垂直滚动？例如： 1. 我在 Sketch 中有 2 个带遮罩的组。 2.组被导入到FramerJS 3. 包装在 framer 中的每个组都添加了垂直滚动 4. 我可以将这些层与包装组一起用于水平滑动的页面吗？？

是否可以通过水平滑动使页面内容垂直滚动？

有人举个例子吗？ :(

Answer 1

是的，这是可能的。您可以将 ScrollComponent 层包装在 PageComponent 中。下面是一些帮助您入门的示例代码：

# This page component holds the horizontally aligned pages
pageComponent = new PageComponent
    y: sketch.navigationBar.height
    height: Screen.height - sketch.navigationBar.height
    width: Screen.width
    # The scroll direction is restricted to only allow for horizontal scrolling
    scrollVertical: false
    # The direction lock is enabled to only allow either horizontal or vertical scrolling
    directionLock: true

for pageIndex in [0...3]

    # A scroll component is created
    scrollComponent = new ScrollComponent
        size: pageComponent.size
        x: pageIndex * pageComponent.width
        contentInset: bottom: 40
        # Only vertical scrolling is allowed and the direction is locked
        scrollHorizontal: false
        directionLock: true

这来自 Framer JS 网站图库中的 Medium 应用示例：

http://framerjs.com/gallery/preview/#medium-app.framer

FramerJS - 滑动页面内容的垂直滚动

FramerJS - the vertical scrolling for content on the pages with swiping

prototype