如何在 QML 中创建交错网格视图? [英] How does one create a staggered grid view in QML?

问题描述

我正在尝试为我的 QML 应用程序创建交错网格视图，如下图所示.我尝试过使用 QML Flow 和 QML Grid，但是它们都没有得到我想要的设计.

I am trying to create a staggered grid view for my QML application as shown in the image below. I have tried using QML Flow and QML Grid, however both of them don't result in the design I want.

例如，当我使用 QML Flow 时，它导致行总是从相同的 Y 值开始.

For instance when I used QML Flow, it resulted in where the rows always start at the same Y value.

推荐答案

我为我的应用 Project Dashboard 实现了一个交错网格视图(我称之为 ColumnFlow)，并将它放在一个单独的库中根据 GPLv3 许可.这是它的外观:

I implemented a staggered grid view (what I call a ColumnFlow) for my app Project Dashboard, and have it in a separate library licensed under the GPLv3. Here is how it looks:

ColumnFlow 的源代码在我的 GitHub 存储库中 iBeliever/ubuntu-ui-extras.最初的实现是由另一个开发人员在我的库的一个分支中启动的，然后我将其撤回并进行了巨大的更改，以使其按照我需要的方式工作.

The source code for ColumnFlow is in my GitHub repository iBeliever/ubuntu-ui-extras. The original implementation was started by another developer in a fork of my library, which I then pulled back in and made huge changes to get it to work the way I needed it to.

您可以在 sonrisesoftware/project-dashboard 中找到有关如何使用它的各种示例，例如 设置页面.

You can find various examples of how to use it in sonrisesoftware/project-dashboard, for example the Settings page.

这篇关于如何在 QML 中创建交错网格视图?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！