您可以使用“滚动变体”使导航栏在用户向下滚动页面时更改其外观,例如更改其背景颜色或调整元素的位置。或者在向下滚动页面时突出显示活动部分的侧边栏。...组件创建之后会存在于Assets 里面,我们直接从里面拖入页面即可导入.
给组件加入滚动变体动画
下面就来给组件加入滚动变体动画....Demo2: 实现一个滚动到不同部分,更改左侧的icon图标
效果:
在上个效果的基础上,我添加了
渐变背景
填充了文本,并使用绝对定位固定到页面上.
给每个页面添加了 粘性布局, 达到视差的效果....然后就说下创建变体Icon 图标. 观察上方的Gif图片,我们就会发现,滚动到不同部分.右边的ICON 图标 在进行相应的变化....具体步骤:
第一步: 我们创建一个组件, 引入3个图标(Framer内置了,可以在import里面找到).
第二步: 引入到页面上,使用固定定位,定位在指定位置.