【问题标题】:How can set background image each row GridView如何设置每一行GridView的背景图片
【发布时间】:2018-09-06 14:27:40
【问题描述】:

我正在使用 Gridview 显示带有 crossAxisCount 的项目,如何设置每行的背景图像 我想做这样的

谢谢大家

【问题讨论】:

    标签: dart flutter


    【解决方案1】:

    我可以提出两种相对简单的方法来实现这一点,但我现在必须让你自己去实现。

    这取决于您要展示多少本书,以及您是否确切知道每个书架要展示多少本书。

    如果您决定每行需要固定数量的项目(比如 5 本书),我相信最简单的解决方案是使用 ListView,ListView 中的每个项目都是一个 DecoratedBox(或容器)。此项目将有一个图像背景,即书架,以及包含 5 本书的行。

    这对于大量书籍来说应该是相当有效的,因为它应该一次只构建每一行。缺点是您需要确定每行的书数,并且在横向或窄纵横比时可能必须有单独的代码来绘制(或者至少要选择每行多少书,并且仅当您需要横向时)。 (请注意,您可以获得屏幕宽度,并可以据此决定每行有多少本书)。

    另一种方法是使用 Scrollable、Stack 和 Wrap。您将 Stack 放在 Scrollable 中,堆栈将有两层 - 背景和项目。背景必须知道如何根据其高度进行绘制 - 您可以使用 BoxDecoration 和 DecorationImage 并重复。 Wrap 将包含所有图像。

    有几件事我不是 100% 确定的,比如堆栈是否可以处理调整大小为换行。但我认为这会奏效。优点是它可以很好地处理屏幕旋转和不同的纵横比,但缺点是它不能很好地处理大量书籍。

    还有第三种选择,但它变得更加复杂(尽管客观上这是最好的方法) - 使用 CustomScrollView 和/或 Slivers。我什至不完全确定我会怎么做,但these 是文档。

    【讨论】:

    • 感谢您的回答。我会尝试这些解决方案。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2017-10-30
    • 1970-01-01
    • 1970-01-01
    • 2012-04-02
    • 1970-01-01
    • 2023-03-25
    • 2020-04-17
    相关资源
    最近更新 更多