问题标签 [flutter-sliver]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
2 回答
27316 浏览

flutter - 是否有明确的 Sliver 小部件列表

我正在尝试使用 Sliver 来实现可折叠列表标题。当我将小部件从正常更改为 Sliver 时,我经常会遇到如下错误:

我的理解是这是因为普通小部件不能直接用于在 Sliver 小部件中渲染。

框架中是否有明确的 Sliver 小部件列表?

sliver.dart显示不多

0 投票
1 回答
273 浏览

dart - 有什么办法可以在 ScrollView 之外使用 SliverGrid?

我试图使用没有滚动行为的 GridView,我通过将“primary”属性设置为 false 来实现它。通过这样做,我注意到当一个可滚动小部件嵌套到另一个时,卡片阴影会产生这种奇怪的效果。

注意两张卡阴影的区别

所以我尝试使用 SliverGrid 让它工作,但我发现我需要将它包装在 CustomScrollView 或相关的中,这样做我会再次创建阴影效果。有什么方法可以使用 SliverGrid 让我没有滚动行为?

0 投票
6 回答
34037 浏览

dart - flutter implement sticky headers and the snap to item effect

For the last few days, I've been reading through flutter framework documentation and especially the sliver part but I'm not quite sure where to start. I'm trying to implement the sticky headers and snap effect. Might the RenderSliverList be a good start? Do I need to re-layout things? Do I need to do additional drawing? And if so where?

Any help on where to start would be a huge help, thanks in advance!

Edit: I think I understood the layout part now, but I just can't find where the painting is supposed to happen.

Edit 2: For clarification, this is the desired "sticky header effect":

How can I make sticky headers in RecyclerView? (Without external lib)

and this is the "snap" effect:

https://rubensousa.github.io/2016/08/recyclerviewsnap

0 投票
4 回答
5419 浏览

layout - 有没有办法在 SliverAppBar 的底部小部件中实现动态高度

SliverAppBar 有一个属性底部,它必须具有preferredSize。

现在我让它返回常量值:

我想在这个底部的小部件中放置一个文本,但我不知道它里面的文本会有多长时间。

如何实现底部小部件的动态高度?

有没有办法在布局之前测量小部件的高度?

编辑 25/04/2018

最终,我按照 Thibault 的指示完成了以下操作:

0 投票
1 回答
736 浏览

dart - 将“Future”api 调用添加到 json 数据作为无限滚动 Flutter_gallery 示例项目

尝试学习新的颤振框架,看起来非常有前途!浏览了所有在线演示,我现在尝试将外部数据添加到“pesto”部分的flutter_gallery示例项目中,这些数据可以通过每10个项目的新Future数据调用无限滚动。

https://github.com/flutter/flutter/blob/master/examples/flutter_gallery/lib/demo/pesto_demo.dart

我已经成功地对外部数据进行了“未来”调用并填充了示例的香蒜酱部分,但是现在我想将它提升到一个新的水平,并在用户滚动到另一个未来数据项时调用另外 10 个项目清单上的第 7 项。

很难找到一个例子来揭示我的困惑,想知道是否有人知道使用 flutter_gallery 示例解决这个问题的任何编码示例。在使用 CustomScrollView 的示例中,我无法理解正确的结构来执行此操作(有很多 ListView 示例,但这无济于事),无论是语法还是结构或两者兼而有之。

期待任何想法或代码片段。

0 投票
0 回答
456 浏览

flutter - Flutter:如何创建一个带有项目消失/出现平滑的 CustomScrollView

我想要一个灵活的页眉,通过覆盖从透明到页面其余部分颜色的渐变CustomScollView的顶部和底部限制,滚动时项目消失/出现平滑。SliverList就像在这个示意图布局中一样。

布局

在底部,通过将Container渐变放置在Stack具有重叠=真的 a 中并将其定位在堆栈之外,这是可能的,没有任何问题。

SliverAppBar我在's内部尝试了相同的方法,flexiSpace但它不允许渐变容器重叠其限制,而是被剪裁。

有没有简单的方法来完成它?我通过在所有东西周围使用 a 找到了一个解决方案,Stack并通过聆听 flexispace 的移动将渐变容器定位在那里,但这似乎有点麻烦。

0 投票
2 回答
1070 浏览

flutter - Flutter 是否支持 iOS 功能?

我开始从事一个大项目,其中包括 Sirikit、游戏中心、指纹、健康工具包和家庭工具包等。所以我怀疑我是否可以使用颤振实现 ios 提供的那些功能和其他功能..?

0 投票
1 回答
6838 浏览

flutter - Flutter:如何使用 SliverList 将 CupertinoActivityIndi​​cator 放入 customScrollView

这是我想要实现的模型 - 它是 CupertinoSliverNavigationBar 下方的 CupertinoActivityIndi​​cator,用于通知用户正在下载数据。 在此处输入图像描述

下载后,它应该如下所示:

在此处输入图像描述

现在,我一直在尝试使用以下代码来获得这种效果:

但是,我收到此错误是因为我试图将非 RenderSliv​​er 类型放入 Sliver。换句话说,我将 CupertinoActivityIndi​​cator 放入 Sliver 并且代码拒绝它。

theftion trible tribrars捕获的例外╞═════════════════════════════════════════ ══════════════════ 在构建Container(bg: BoxDecoration(color: Color(0xffffffff)))时抛出了以下断言:A RenderViewport 需要一个RenderSliv​​er类型的子级,但收到了一个RenderDecoratedBox 类型的子级。RenderObjects 期望特定类型的子对象,因为它们在布局和绘制过程中与子对象协调。例如,RenderSliv​​er 不能是 RenderBox 的子级,因为 RenderSliv​​er 不理解 RenderBox 布局协议。

最接近我想要的效果显示在下面的 gif 中。但是,您可以清楚地看到,当 CupertinoActivityIndi​​cator 可见时,CupertinoSliverNavigationBar 并未显示。只有在下载数据后,显示“Coffee Shop”的 CupertinoSliverNavigationBar 才可见。

在此处输入图像描述

我使用以下代码实现了上述目标:

谁能告诉我如何才能达到我想要的效果?

0 投票
1 回答
619 浏览

flutter - Flutter SliverAppBar 类似于 iPhone 谷歌地图

我尝试在 Flutter 中使用 CustomScrollView 和 SliverAppBar 和 flexibleSpaceBar 实现类似的 Google Maps AppBar,但我没有找到任何选项来仅在 AppBar 的“打开”状态下显示小部件。

假装结果的表示是这样的:

打开视图

酒吧视图

尝试开发后,我没有成功。

知道怎么做吗?

更新

所需的效果在该 gif 中可视化:

通过 GIPHY

0 投票
2 回答
16873 浏览

flutter - Flutter 中 SliverList 与 ListView 的区别

SliverListFlutter和Flutter有什么区别ListView