【横向分类切换内容】这种方式的内容分类如何实现?

小程序 文章 2022-02-25 10:20 266 0 全屏看文

AI助手支持GPT4.0

【横向分类切换内容】这种方式的内容分类如何实现?[Horizontal classification switching content] How to realize content classification in this way?

【横向分类切换内容】这种方式的内容分类如何实现?

因为小程序使用毛玻璃样式定制了导航栏(样子和图片中的样式差不多),

遇到了一个问题:如何在使用这种分类方式的情况下,不影响内容往上翻滚呢?

如果使用 swiper + scroll-view 的方式实现,就无法实现图三的样子(内容被毛玻璃导航面板遮挡,无法遮挡,那毛玻璃效果就多此一举了),

如果使用 view 的 hidden 实现,由无法实现横向切换和保存滚动位置。

希望懂的大神指点一二。😁

Because the applet uses the ground glass style to customize the navigation bar (which looks similar to the style in the picture), there is a problem: how to use this classification method without affecting the content to scroll up? If you use the method of swiper + scroll view, you can't realize the appearance of Figure 3 (the content is blocked by the ground glass navigation panel, so the ground glass effect is unnecessary). If you use the hidden method of view, you can't realize horizontal switching and save the rolling position. Hope to understand the guidance of the great God. 😁

回答:

🐳 William:

也比较简单,你可以做两个导航栏。一个是navbar-normal,另一个是navbar-fixed. 两个导航栏的内部内容,可以共用同一个Taro 组件或者小程序组件(也必须是同一个),然后判断向上滚动,向上滚动的时候展示 navbar-fixed(就有浮动效果啦),向下滚动就展示 navbar-normal,你可以尝试一下。

dreamhunter:

截图不是你做的效果,是你想要的效果?

小黎:

我实在没读懂你想表达什么

-EOF-

AI助手支持GPT4.0