离子3自动调整网格布局-Java 学习之路

我使用离子网格和一个离子排构建了一个仪表板 . 离子行包含10-12个离子色谱柱 . 所以基本上，一旦屏幕宽度被击中，列就开始向下流动 .

这一切都很好并且符合预期 . 但是，当这些列具有不同的宽度和高度时，问题就开始了 . 我已经定义了3种宽度类型的col：200px，400px和600px . 高度也有3种变化200px，400px和600px . 因此总体上每个col可以是1 * 1,2 * 1,1 * 2,2 * 2,3 * 1和3 * 2大小 .

我正在使用dragula能够拖放 Headers 以根据需要调整布局 . 但是，初始布局总是呈现一些洞，尽管它们可以通过手动拖放来填充 .

那么，应该在初始时处理它以正确的方法来避免布局中的漏洞 .

1 回答

1
你可能可以使用css flex grow . 为每行使用一个父div并将css设置为
```
.row {
  display: flex;
  justify-content: center;
  align-items: center
}
```
对于每列，使用flex grow来定义它们的大小 .

例如 . flex-grow：1 - 正常，flex-grow：2表示更大的宽度 .

在这里，我已经附上了我所做的 . 在我的情况下，列号应该是动态的，但具有相同的 .
回复于 2024-04-20T01:57:47+08:00

离子3自动调整网格布局

1 回答

相关问题